2 Questions: <Parallel> and Binding to target

[Flash Gordon]

1) In the code pasted below, why doesn't the <Parallel> <Move> X work correctly? It never moves in the "x" direction at all. It works if it is a sequence.

2) Why does FB give me a warning about 'Data binding will not be able to detect assignments to "target"'? I'm not trying to data bind, I just need the target's currently location. What does this error message really mean?

Cheers
:)


application code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute"
>

<mx:Sequence id="shake">
<mx:Move xBy="5" duration="50"/>
<mx:Move xBy="-10" duration="50"/>
<mx:Move xBy="10" duration="50"/>
<mx:Move xBy="-10" duration="50"/>
<mx:Move xBy="10" duration="50"/>
<mx:Move xBy="-5" duration="50"/>

<mx:Parallel> <!-- WHY DOESN"T THIS PARALLEL CORRECTLY? -->
<mx:Rotate duration="1000" />
<mx:Move yFrom="{shake.target.y}" yTo="10" duration="1000"/>
<mx:Move xFrom="{shake.target.x}" xTo="10" duration="1000"/>
</mx:Parallel>
</mx:Sequence>

<mx:Panel id="myPanel"
width="300" height="200"
click="{shake.play([myPanel])}"
x="212" y="94" />

</mx:Application>

[wvxvw]

2 is simple :)
Data binding requires the target (the owner of the property) to be IEventDispatcher. Array isnt' IEventDispatcher. (because binding works this way - it generates a function that will dispatch a "changeProperty" event for the property you're binding, but, if the property doesn't belong to IEventDispatcher, apparently, you cannot dispatch that event.

1. Is somewhat complicated... I've played a bit with Flex effects... but, to be honest, I find them quite useless because of:
- lots of overrides of basic X / Y / width / height properties + Flex display objects are very difficult to control when you want them to stop laying out themselves as they want :) I.e. you never know for sure what happens after some object that is buried inside number of containers will validate it's display list... so, I use transform property of Flex display objects for animations :) Somehow those who wrote Flex layout validation have avoided modifying it to much, thus it usually works fine :)

Just to give you an example:
<?xml version="1.0" encoding="utf-8"?>
<Group
xmlns="http://ns.adobe.com/mxml/2009"
xmlns:d="http://ns.adobe.com/fxg/2008/dt"
resizeMode="scale"
creationComplete="initSkin()">

<Script>
<![CDATA[
import flash.events.Event;
import flash.geom.Transform;
import flash.geom.Matrix;

private var _cRotation:Number = 0;
private var _cTransform:Transform;
private var _cMatrix:Matrix;

private function initSkin():void
{
_cTransform = new Transform(rotatingGroup);
addEventListener(Event.ENTER_FRAME, renderFrame);
}

private function renderFrame(event:Event):void
{
_cRotation++;
_cRotation = _cRotation % 360;
_cMatrix = new Matrix();
_cMatrix.translate(-8, -8);
_cMatrix.rotate(_cRotation * Math.PI / 180);
_cTransform.matrix = _cMatrix;
}
]]>
</Script>
<Declarations>
<FxRotate
id="rotateEffect"
target="{rotatingGroup}"
angleBy="360"
duration="5000"/>

<Number id="radius">32</Number>

<ArrayCollection id="xArray">
<source>
<Array>
<Number>{ Math.cos(Math.PI / 4) * radius }</Number>
<Number>{ Math.cos(Math.PI / 2) * radius }</Number>
<Number>{ Math.cos(Math.PI * 3 / 4) * radius }</Number>
<Number>{ Math.cos(Math.PI) * radius }</Number>
<Number>{ Math.cos(Math.PI * 5 / 4) * radius }</Number>
<Number>{ Math.cos(Math.PI * 3 / 2) * radius }</Number>
<Number>{ Math.cos(Math.PI * 7 / 4) * radius }</Number>
<Number>{ Math.cos(Math.PI * 2) * radius }</Number>
</Array>
</source>
</ArrayCollection>

<ArrayCollection id="yArray">
<source>
<Array>
<Number>{ Math.sin(Math.PI / 4) * radius }</Number>
<Number>{ Math.sin(Math.PI / 2) * radius }</Number>
<Number>{ Math.sin(Math.PI * 3 / 4) * radius }</Number>
<Number>{ Math.sin(Math.PI) * radius }</Number>
<Number>{ Math.sin(Math.PI * 5 / 4) * radius }</Number>
<Number>{ Math.sin(Math.PI * 3 / 2) * radius }</Number>
<Number>{ Math.sin(Math.PI * 7 / 4) * radius }</Number>
<Number>{ Math.sin(Math.PI * 2) * radius }</Number>
</Array>
</source>
</ArrayCollection>

</Declarations>

<Group id="rotatingGroup" autoLayout="false" maintainProjectionCenter="false">
<Ellipse
height="16" x="{Number(xArray.getItemAt(0))}"
width="16" y="{Number(yArray.getItemAt(0))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(1))}"
width="16" y="{Number(yArray.getItemAt(1))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(2))}"
width="16" y="{Number(yArray.getItemAt(2))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(3))}"
width="16" y="{Number(yArray.getItemAt(3))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(4))}"
width="16" y="{Number(yArray.getItemAt(4))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(5))}"
width="16" y="{Number(yArray.getItemAt(5))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(6))}"
width="16" y="{Number(yArray.getItemAt(6))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
<Ellipse
height="16" x="{Number(xArray.getItemAt(7))}"
width="16" y="{Number(yArray.getItemAt(7))}">
<fill>
<SolidColor color="0xf48631"/>
</fill>
</Ellipse>
</Group>

</Group>

I've spent more then 5 hours trying to get the thing rotating with FxRotate... and, I just gave it up... using transform.matrix appeared to be much easier and, actually rendered the animation as I wanted it to be...

[Flash Gordon]

1) okay...it's another stupid bug....urgh.

2) Does everything have to be data bound when using inline mxml? Can't I just access a property without having to bind to it? All I want is the "x" property of the target (an object btw not array...that's targets) at that current time.

Flex is a pain in my butt. If it wasn't for the data binding and layout managers there'd be no reason to use it over flash. (my little rant....)

Cheers
:)

[wvxvw]

Hehe, you can actually use databinding classes + styling + embedding apart from the rest of the framework :)
here're some of my lame attempts to do that:
http://code.google.com/p/e4xu/source/browse/#svn/trunk/src
:D

The only problem is that you still have to implement IUComponent if you want your own components to be used by other flexers... though, I found that if you implement it, it only brings in like 5 useless interfaces, which isn't to much considering... but implementing it is a pain... only the dummy implemetator class will have something like 1K lines of code :)

And... I'd say that layout manager is rather evil... it adds a lot overhead for quite simple stuff... though, the concept behind it is actually good... the implementation sucks immensely...

Ah, and it's just a warning... (the databinding) you can turn that off in the build file, if you don't wont to hear about it :)
Also, you can make a function that will return the same value, and Flex will be able to bind that.
Ah, yet another thing, if the property getter / setter wasn't originally binable (i.e. didn't dispatch "change" event, like, for eg. the "id" property - it will also give the same warning. So, sometimes you can just extend that class and make the property bindable.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import flash.events.Event;

private var _array:Array = ["A", "B", "C"];

public function bindingHelper():String
{
return _array[(Math.random() * 3) >> 0];
}

[Bindable("changeRandomText")]
public function bindingHelper2():String
{
return _array[(Math.random() * 3) >> 0];
}

public function get bindedProperty():String
{
return bindingHelper();
}

public function set bindedProperty(value:String):void
{
dispatchEvent(new Event("changeRandomText"));
}
]]>
</mx:Script>
<mx:Text text="{bindingHelper()}"/>
<mx:Text text="{bindingHelper2()}"/>
<mx:Button label="Change Text" click="bindedProperty='Whatever'"/>
</mx:Application>
Here's a quick example.

[Flash Gordon]

yeah...i'm ok with that kind of stuff. It's just still, I don't need data binding just the damn property at the moment. Get over it Flex!!!

and this is still retard

<mx:Parallel id="myTween" target="{myPanel}">
<mx:Move yTo="300" duration="220"/>
<mx:Move xTo="300" duration="200"/>
</mx:Parallel>


You think someone would have check that before making a release build? :o

thanks for the help.
best,
:)