Website templates, flash templates, oscommerce skins, video loops, free stuff !

Populate Label Components with the XMLConnector

Posted by admin | Published 2006-07-20 | Not rated yet

So from the arsenal of new Macromedia Flash 8 components you see Labels , and you may think, -well why in earth would I need Labels, when I have text fields? This component must be the least useful here, right? - Wrong!

Labels are very powerful, when used properly and in conjunction with other components. If you live in a multilingual society like Montreal , where we have two official languages Labels will be your best friends when creating your Flash apps.

Before we start

For this recipe we need the following ingredients:

* 3 Macromedia Flash 8 Label Components
* 1 Macromedia Flash XMLConnector Component
* 1 XML document.
* 1 Line of ActionSctipt

Setting the stage

Create a new empty flash document, name it labels.fla Make your movie 300x250 pixels and save. Then drag into the stage and XMLConnector component and 3 label components. Give your label components the following Instance names:

• name_lb
• lastName_lb
• phone_lb

Then give your XMLConnector component the name: labels_xc

Keep in mind the ending “_lb” and “_xc” are not required but is good practice to identify your components in this fashion for sake of clarity, as you may have already guessed “_lb” stands for Label and “_xc” XMLConnector. You may use your own way of identifying them as long as you keep your notation consistent .
Creating the XML file

Now using DreamWeaver or Notepad we need to create the XML file, copy and paste the code bellow and save it as labels.xml in the same directory as your labels.fla

<?xml version="1.0" encoding="iso-8859-1"?>
<labels>
<name value="Name"/>
<lastName value="Last Name"/>
<phone value="Phone"/>
</labels>

Our XML file will serve to describe the content for each Label, this is great because, should you need to rename the fields to something else or translate them to another language, it can be done easily by you or someone else by simply modifying this XML file.
Binding

OK, now that we have our XML files in place let's bind that XML file to our Labels, for this we are going to need the help of our friend the XMLConnector.

Select the XMLConnector, and open the component inspector window (CRTL+F7), then click on Parameter Tab.

In the URL field type labels.xml here we are telling the XMLConnector to concern itself with this XML file.

On direction select receive, we are not sending back anything to our XML file just receiving data.

For this particular tutorial we are leaving the other options as they are by default.

Your window should look like this:

xml connector window

The next step is to tell our XMLConnector a description of the data it's going to be dealing with, this is really simple, first make sure the results:XML field is selected, then by clicking on the small right arrow near the top right of the window an Open window will appear, look for your xml file (labels.xml) and open it.

You should see under results:XML the structure of our xml file. Leave all other parameters as they are by default.

Now we move on to the Bindings tab, this is where the magic happens. Click on the Bindings tab and then on the + sign. Select the line right bellow name:<empty> which is : @value:String and Click OK.

We just told the XMLConnector to get whatever string value is under name, and now we need to tell it what do with it.

Now in the direction property select out , then double click the bound to property and chose the name label (name_lb) and click OK.

Here we completed the binding by telling to the XMLConnector where to send out the String value.

Your window should look like this:

xml connector binding window

Excellent! You have successfully completed your first binding between the XMLConnector and Label name_lb.

Behaviors

Create a new layer and name it AS or ActionScript, select the first empty keyframe and open the Behaviors panel (Shift F3) then click on the + sign and select : Data>Trigger Data Source, select labels_x c and click OK. You will notice the following ActionScript line has been added to your timeline:

this.labels_xc.trigger();

This basically is the line that makes the XMLConnector Component to execute at runtime.

Do control >Test Movie, you should see first label being renamed to “ Name”. Now you can apply the same steps to bind the other two Label Components.

You should see at the end, all the labels displaying: Name, Last name and Phone.

Congrats you just baked your first 3 Label Components, learned how to bind components, as well as your first behavior.

Author:  LordAlex León




Poor Excellent
Your Name:
Title:
Comment:
Verification code:
CAPTCHA


{show_comment}
 
 
 
Copyright © 2006 Flashtrue Layouts. All Rights Reserved.
Flashtrue Directory - Articles & Tutorials  | Web design News | Terms of use | FAQ
Flash video loops Website Templates Website Templates