Flex and AS3

[su43berkut17]

hello!

Im new into this and I´m very confused about the way I can use AS3 and Flex as I don´t understand very well the way I can use vars and functions I have in AS3 in the flex objects :(

Is there a tutorial that can explain it to me?

Now im loading an xml file in flex in an as3 class:


package Carga

import flash.events.Event;
import flash.net.URLLoader;
import flash.net.URLRequest;

{
public class Carga
{
public function Carga()
{
var myXML:XML = new XML();
var XML_URL:String = "datos/objeto.xml";
var myXMLURL:URLRequest = new URLRequest(XML_URL);
var myLoader:URLLoader = new URLLoader(myXMLURL);
myLoader.addEventListener("complete", xmlLoaded);

function xmlLoaded(event:Event):void
{
myXML = XML(myLoader.data);
trace("Data loaded.");
}

}

}
}


So, I want to use the data that I loaded in my myXML object in Flex, how do i do that? I´m so confused I got a headache!!!!

Thanks :mad:

[Barna Biro]

I don't watch or read tutorials so, sadly, I can't help your out with an exact tutorial. What I can do, is to point you in a direction. From what I can understand, you are in fact having problems understanding classes and Object Orietend Programming ( OOP ). So, I'd suggest you look for articles on OOP ( the language shouldn't really matter... the principles are the same in every language ) and work your way up from simple examples to more advanced ones.

A quick Google search should bring up quite a few articles that can get you started. You should also surf the official Adobe website because it's also filled with useful articles ( for example: http://www.adobe.com/devnet/flash/quickstart/creating_class_as3/ , http://www.adobe.com/devnet/flash/?view=quickstart ).

PS: The code you have posted might not work for many reasons. One reason why it is surely not working is because your import statements are outside the package body ( the statements should be after the first curly bracket ). In case your class in not situated inside a folder called "Carga" then it will not work ( for example: if your package definition would look like com.example , that would mean that your class should be inside a folder called "example" and the "example" folder should be inside a folder called "com" ... surf the internet for more detailed explanations ).

A more correct structure would have look something like this:

package com.example
{
import flash.events.Event;
import flash.events.IOErrorEvent;
import flash.events.SecurityErrorEvent;
import flash.net.URLLoader;
import flash.net.URLRequest;

/**
* Simple example class that demonstrates how to load an external
* xml file using ActionScript 3.0.
*
* @author Barna Biro
*
*/
public class Carga
{
/**
* Will hold the loaded <code>XML</code> data structure.
*/
protected var _xmlData:XML = null;

// --------------------------------------------
// Constructor
// --------------------------------------------

/**
* Class constructor.
*
*/
public function Carga()
{
loadXml("datos/objeto.xml");
}

// --------------------------------------------
// Data loading
// --------------------------------------------

/**
* Called to load external xml files.
*
* @param path The path to the xml file that sould be loaded.
*
*/
protected function loadXml(path:String):void
{
// Make sure an URL is passed.
if (!path) throw new Error("Error! No file path specified.");

// Initialize the loader and subscribe to events.
var urlLoader:URLLoader = new URLLoader();
urlLoader.addEventListener(Event.COMPLETE, onXmlLoadCompleteHandler);
urlLoader.addEventListener(IOErrorEvent.IO_ERROR, onXmlIOErrorHandler);
urlLoader.addEventListener(SecurityErrorEvent.SECU RITY_ERROR, onXmlSecurityErrorHandler);
// Attempt to load the file situated at the specified path.
urlLoader.load(new URLRequest(path));
}

// --------------------------------------------
// Event handling
// --------------------------------------------

/**
* Called once the
*
* @param event
*
*/
protected function onXmlLoadCompleteHandler(event:Event):void
{
try
{
// Try to store the loaded data as an XML structure. If the
// conversion fails, throw an error.
_xmlData = XML(event.target.data);
}
catch (event:Error)
{
throw event.message;
}
}

/**
* Called if a security error occurs.
*
* @param event
*
*/
protected function onXmlSecurityErrorHandler(event:SecurityError):voi d
{
throw new Error(event.message);
}

/**
* Called if an Input-Output error occurs.
*
* @param event
*
*/
protected function onXmlIOErrorHandler(event:IOErrorEvent):void
{
throw new Error(event.text);
}
}
}
Don't worry if you don't understand these things on your first attempt... In time and after you read up on OOP, all these things will become clear. Good luck.

[suchislife801]

Ok. So the idea of this example is to create a UrlRequest of the xml file, get it as a String, load it into an XmlDocument, parse its root nodes, look for the record node, parse its child nodes and add as many of them as we find to our ArrayCollection. This ArrayCollection is then set as the dataProvider of our DataGrid. All this happens as we load our Application by adding our init() function to our Application creationComplete Event.

Please notice how the objects we create on the fly to add to our ArrayCollection match the name of the DataGrid columns exactly.

myPhonebook.xml - XML FILE STRUCTURE:

<?xml version="1.0" encoding="ISO-8859-1" ?>

<root>

<record>
<firstname>John</firstname>
<lastname>Doe1</lastname>
<phonenumber>555-555-1111</phonenumber>
</record>

<record>
<firstname>John</firstname>
<lastname>Doe2</lastname>
<phonenumber>555-555-2222</phonenumber>
</record>

<record>
<firstname>John</firstname>
<lastname>Doe3</lastname>
<phonenumber>555-555-3333</phonenumber>
</record>

</root>

carga.mxml SOURCE CODE:

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

<mx:Script>
<![CDATA[

import mx.controls.DataGrid;
import mx.collections.ArrayCollection;

[Bindable]
private var arrColl:ArrayCollection;

private function init():void
{

var doc:String = "C:\\myPhonebook.xml";
//var doc:String = "../xml/myPhonebook.xml";
var request:URLRequest = new URLRequest(doc);
var loader:URLLoader = new URLLoader();

loader.load(request);
loader.addEventListener(Event.COMPLETE, docLoad_Complete);

}

private function docLoad_Complete(event: Event): void
{

// Once document has finished loading...
var xmlDoc:XMLDocument = new XMLDocument();
xmlDoc.ignoreWhite = true;
xmlDoc.parseXML(String(event.currentTarget.data));

var root:XMLNode = xmlDoc.firstChild;
parseRoot(root);

}

private function parseRoot(root:XMLNode): void
{
arrColl = new ArrayCollection();
var xmlRoot:Array = root.childNodes;


for each(var item:XMLNode in xmlRoot) {

switch(item.nodeName.toString())
{
case 'record':
parseRecord(item);
break;
}

}

}

private function parseRecord(subroot:XMLNode): void
{
var xmlRecord:Array = subroot.childNodes;

var obj:Object = new Object();

obj.firstname = XMLNode(xmlRecord[0]).childNodes.toString();
obj.lastname = XMLNode(xmlRecord[1]).childNodes.toString();
obj.phonenumber = XMLNode(xmlRecord[2]).childNodes.toString();

arrColl.addItem(obj);

}


]]>
</mx:Script>
<mx:DataGrid dataProvider="{arrColl}">
<mx:columns>
<mx:DataGridColumn headerText="First Name" dataField="firstname"/>
<mx:DataGridColumn headerText="Last Name" dataField="lastname"/>
<mx:DataGridColumn headerText="Phone #" dataField="phonenumber"/>
</mx:columns>
</mx:DataGrid>

</mx:Application>

Hope this helps.