6 min read

 

Loading external XML documents

You can use the URLLoader class to load external data from a URL. The URLLoader class downloads data from a URL as text or binary data. In this section, we will see how to use the URLLoader class for loading external XML data into your application. You can create a URLLoader class instance and call the load() method by passing URLRequest as a parameter and register for its complete event to handle loaded data. The following code snippet shows how exactly this works:

private var xmlUrl:String = "http://www.foo.com/rssdata.xml";
private var request:URLRequest = new URLRequest(xmlUrl);
private var loader:URLLoader = new URLLoader(;
private var rssData:XML;
loader.addEventListener(Event.COMPLETE, completeHandler);
loader.load(request);
private function completeHandler(event:Event):void {
rssData = XML(loader.data);
trace(rssData);
}

Let’s see one quick complete sample of loading RSS data from the Internet:


creationComplete="loadData();">


height="100%" width="100%">



dataField="pubDate"/>
dataField="description"/>





In the code above, we are loading RSS feed from an external URL and displaying it in DataGrid by using data binding.

Output:

Working with XML in Flex 3 and Java-part2

An example: Building a book explorer

In this section, we will build something more complicated and interesting by using many features, including custom components, events, data binding, E4X, loading external XML data, and so on. We will build a sample books explorer, which will load a books catalog from an external XML file and allow the users to explore and view details of books. We will also build a simple shopping cart component, which will list books that a user would add to cart by clicking on the Add to cart button.

Create a new Flex project using Flex Builder. Once the project is created, create an assetsimages folder under its src folder. This folder will be used to store images used in this application. Now start creating the following source files into its source folder.

Let’s start by creating a simple book catalog XML file as follows:

bookscatalog.xml:


Building Websites with Joomla! 1.5

Hagen
Graf

../assets/images/184719530X.png
363
Rs.1,247.40
The best-selling Joomla! tutorial guide updated for the latest 1.5 release


Drupal 6 JavaScript and jQuery

Matt
Butcher

../assets/images/1847196160.png
250
Rs.1,108.80
Putting jQuery, AJAX, and JavaScript effects into your Drupal 6 modules and themes


Expert Python Programming

Tarek
Ziadé

../assets/images/184719494X.png
350
Rs.1,247.4
Best practices for designing, coding, and distributing your Python software


Joomla! Web Security

Tom
Canavan

../assets/images/1847194885.png
248
Rs.1,108.80
Secure your Joomla! website from common security threats with this easy-to-use guide


The above XML file contains details of individual books in an XML form. You can also deploy this file on your web server and specify its URL into URLRequest while loading it.

Next, we will create a custom event which we will be dispatching from our custom component. Make sure you create an events package under your src folder in Flex Builder called events, and place this file in it.

AddToCartEvent.as:
package events
{
import flash.events.Event;
public class AddToCartEvent extends Event
{
public static const ADD_TO_CART:String = "addToCart";
public var book:Object;
public function AddToCartEvent(type:String, bubbles_Boolean=false, cancelable_Boolean=false)
{
super(type, bubbles, cancelable);
}
}
}

This is a simple custom event created by inheriting the flash.events.Event class. This class defines the ADD_TO_CART string constant, which will be used as the name of the event in the addEventListener() method. You will see this in the BooksExplorer.mxml code. We have also defined an object to hold the reference of the book which the user can add into the shopping cart. In short, this object will hold the XML node of a selected book.

Next, we will create the MXML custom component called BookDetailItemRenderer.mxml. Make sure that you create a package under your src folder in Flex Builder called components, and place this file in it and copy the following code in it:


cornerRadius="8" paddingBottom="2" paddingLeft="2"
paddingRight="2" paddingTop="2">

[Event(name="addToCart", type="flash.events.Event")]


paddingLeft="2" paddingRight="2" paddingTop="2" height="100%"
borderStyle="solid" borderThickness="2" borderColor="#6E6B6B"
cornerRadius="4">
width="78" maintainAspectRatio="false"/>
paddingBottom="0" paddingLeft="0" paddingRight="0"
paddingTop="0" verticalAlign="middle">




Subscribe to the weekly Packt Hub newsletter

* indicates required

LEAVE A REPLY

Please enter your comment!
Please enter your name here