Now the most basic way of doing this is to put the code in the object .. like this
<mx:Label
id='myLabelThingie'
text="I'm Waiting"/>
<mx:Button
id="bigButtonOne"
label="Click Me Hard"
click="myLabelThingie.text='OOOO that was good'"/>
OK there are two things here... the first is a LABEL object which has an id of myLabelThingie A Label is a very simple object that will hold some text, in this example it starts of displaying the text I'm Wating. I need an id so that I can access it later on. Please make sure your IDs are always unique in your application!!
Next to it there is a BUTTON object. The text on it reads "Click me Hard" it looks like this
When a user clicks on the object the click=".." kicks in and the text on the label, accessed via it's ID is changed to "OOOO that was good".. like this
Just the same as LS, JS and even VB ;-)
this is a fine and dandy way of doing things but when you want to be really smart it does limit it you a little.. so you build functions to do the exciting stuff and call them in the Click Event of the object. functions are written in ActionScript and are placed in a <mx:Script> tag, Like this :-
<mx:Script>
<![CDATA[
private function clickMe().void
{
myLabelThingie.text='OOOO that was good';
}
]]>
</mx:Script>
<mx:Label id='myLabelThingie' text="I'm Waiting"/>
<mx:Button id="bigButtonOne" label="Click Me Hard" click="clickMe()"/>
Note that the actionscript code is nothing that even closely resembles well formed XML and this is why we surround it with the <![CDATA][ ... ]]> tag. If you forget this you will have LOADS of fun with errors!
Also of note here is that functions that types (the :void bit) this means that the function will not return any data. It is not strictly required, the complier will moan at you if you don't type your functions. Best practise is to :void functions that do not return things, it helps you and those that come after you recognise the function as a non-return function:-)
If you wanted to pass some data to the function, lets say some text for the label you can do this but you MUST type the value passed, just like in dear old LS.
<mx:Script>
<![CDATA[
private function clickMe(myWeeMessage:String).void
{
myLabelThingie.text=myWeeMessage;
}
]]>
</mx:Script>
<mx:Label id='myLabelThingie' text="I'm Waiting"/>
<mx:Button id="bigButtonOne" label="Click Me Hard" click="clickMe()"/>
Notice the :String - this is the equivilant of this LS
function clickMe(myWeeMessage as String)
OK now I want to mention a VERY important event creationComplete This event is fired when a component is all ready and waiting in the application. Every object in your app has a creationComplete event. The app itself has a creationComplete event and this is fired when all the component objects contained in the application are loaded and ready and have broadcast their creationComplete events upwards to the Application.
The Application level creationComplete is analogous to the onLoad() event in JS.
All your Flex applications have a built in "listener" function that listens for events, you don't need to know how it does this just know that it does and it does and know that it is your friend!
When the "listener" function "hears" an event being fired somewhere in the application, it generates an event object and this event object contains lots of useful information. The event object's contents depend on the event that was "heard" by the listener" but all events objects are based on the same Actionscript base class.
In my next wander into FLEX land I will look at the event object in more detail
