Simple Flex Tutorial

web

I've been learning Flex for a presentation at my local CFUG, and I'm actually quite impressed with how much you can do with so little code.

However, most of the Flex tutorials I have found are very long and over simplified, so I've created a simple blog reader in 23 lines of MXML code to use as a tutorial. Here's what our Flex Application will look like:

flex blog reader screen shot

How does the example work?

When you click the Load Blog Entries button my RSS feed entries are loaded into the datagrid. When you click on a row in the datagrid the corresponding entry is loaded into the text area.

Step 1 - XML and Application declaration

Start your XML file with a XML declaration, and an mx:Application tag:

<?xml version="1.0" ?>

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">

Step 2 - Define your HTTPService

Our first step is to define the HTTPService that we will use to connect to my RSS feed. We will give an id of httpRSS so we can refer back to it.

<mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" />

Step 3 - Enclose your controls within a panel

A panel is simply a container to put controls (the DataGrid, TextArea, and Button) into. We are going to set some attributes on the panel as well, it should be pretty easy to figure out what they mean:

<mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500">

Step 4 - Define your DataGrid

We are using the DataGrid component to display the list of blog entries in my RSS feed, along with their date.

This step is probably the most complicated step because we have to bind our RSS xml data to the datagrid, and define an event handler when the rows are clicked.

In the attributes of the DataGrid we are using dynamic variables or expressions denoted by the curly braces {variable}.

<mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.result.rss.channel.item}" cellPress="{body.htmlText=httpRSS.result.rss.channel.item[entries.selectedIndex].description}">
  <mx:columns>
    <mx:Array>
      <mx:DataGridColumn columnName="title" headerText="Title" />
      <mx:DataGridColumn columnName="pubDate" headerText="Date" />
    </mx:Array>
  </mx:columns>	
</mx:DataGrid>

Ok so there is a lot going on there, first so I'll break it down a bit:

width

We are setting the width dynamically based on the size of its parent panel reader, specifically we set it to be 15 pixels narrower than its panel.

dataProvider

In the dataProvider attribute we are binding the data for this grid to the result of our HTTPService named httpRSS. More specifically we want to bind each item tag in our XML file to a row in the datagrid. Since the item tags are inside the rss and channel tags we refer to it the array of items as httpRSS.result.rss.channel.item.

cellPress

Next we want to create an event handler that will display the contents of the description tag inside the item that is clicked on. Using the variable entries.selectedIndex we know which item was clicked on, and we can refer to the description (the entry body) of that item as: httpRSS.result.rss.channel.item[entries.selectedIndex].description.

Now we just need to set the value of our TextArea which we will define in the next step to the rss item description, so we simply assign that value to the htmlText property of the TextArea (whose name will be body).

columns

Now we need to define which columns we are to display in the datagrid. The columnName must match the tag name that we want it to correspond to.

Step 5 - Define the TextArea

Use the mx:TextArea tag to define the text area where the entry body will go:

<mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" />

Step 6 - Create a Button

Our last control to define is a Button which will simply tell the HTTPService to make the request.

<mx:Button label="Load Blog Entries" click="{httpRSS.send()}" />

In the click event handler we call the send() method on our HTTPService object.

Step 7 - Close Panel and Application

Simply close some tags, and your done!

</mx:Panel>
</mx:Application>

One Caveat

Flex 1.5 uses a proxy to invoke HTTPService calls, and other remote service calls, and for security reasons the proxy will block the HTTP call. You add the RSS feed url (or simply http://*) to the proxy whitelist in your flex-config.xml. See this KB article for more info.

Complete MXML source code:

<?xml version="1.0" ?>

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">

 <mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" />

 <mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500">

  <mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.result.rss.channel.item}" cellPress="{body.htmlText=httpRSS.result.rss.channel.item[entries.selectedIndex].description}">
    <mx:columns>
      <mx:Array>
        <mx:DataGridColumn columnName="title" headerText="Title" />
        <mx:DataGridColumn columnName="pubDate" headerText="Date" />
      </mx:Array>
    </mx:columns>	
  </mx:DataGrid>

  <mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" />

  <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" />
  
 </mx:Panel>
</mx:Application>


Related Entries

156 people found this page useful, what do you think?

Trackbacks

Trackback Address: 490/6F65A82E5841A79FA6AD48CDCAE9A5B4

Comments

On 11/07/2005 at 6:46:58 PM EST Doug Cain wrote:
1
When I compile the MXML in your example it takes exception to the applicaion line:

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">

I think it should read:

<mx:Application xmlns:mx="http://www.macromedia.com/2005/mxml">

On 11/07/2005 at 7:08:54 PM EST Pete Freitag wrote:
2
Doug, Are you running this on Flex 1.5 or Flex 2.0, I have tested this on 1.5 but not Flex 2.0

On 11/07/2005 at 8:02:11 PM EST Scott Fitchet wrote:
3
Nice job, Pete ...

On 11/08/2005 at 9:57:02 PM EST Sho Kuwamoto wrote:
4
To make this work in the Flex 2.0 alpha:

1) Modify the namespace URL as suggested above.

2) Change the two places where "{reader.width-15}" occurs to "100%", as the data binding expressions cause unwanted scrollbars to appear in the alpha.

On 11/08/2005 at 11:03:11 PM EST Pete Freitag wrote:
5
Thanks Scott, and thanks for the tips Sho!

On 11/14/2005 at 1:16:59 PM EST mojo wrote:
6
Nice job... I'm trying to make this work in the Flex 2.0 Alpha, but if I change the url rss, with some others (ex. http://rss.macgeneration.com/), it give me an error "Security error accessing url" ! How doing it?

On 12/05/2005 at 2:35:44 AM EST gaurav wrote:
7
Can show an example to convert an .aspx page to Flex

On 02/07/2006 at 10:16:01 PM EST flexdummy wrote:
8
Can u show sample on hw 2 pass variable on the mxml page to ASP page to retrieve the value

On 02/24/2006 at 11:35:04 AM EST vesa wrote:
9
Hi Pete, I know you are busy with stuff but I get errors with this one when using Flex 2.0 Beta.. I did what Sho told to do and I get this error:

"TypeError: Error #1010: undefined has no properties. at Peter/__entries_cellPress() at flash.events::EventDispatcher/dispatchEvent() at mx.core::UIComponent/dispatchReplayableInteraction() at mx.controls::DataGrid/mouseDownHandler() "

After that It will work,strange..

On 04/05/2006 at 5:02:49 AM EDT John Henry wrote:
10
Hi everyone. I guess no one has posted on this in a while but...

I've noticed that there have been a few changes in the Flex 2.0 Beta since the last build that affect this application.

#1: Everyone is probably already aware that the default namespace has changed again after Adobe's acquisitionof Macromedia. It is now "http://www.adobe.com/2006/mxml"

#2: The "cellPress" is replaced by the "click" property.

#3: The "columnName" property is replaced by the "dataField" property.

If you make changes to the code accordingly, it will run in the current build.

Finally much thanks to you Mr. Freitag. Your site is a wonderful resource for learning.

On 05/11/2006 at 8:50:48 AM EDT Kees wrote:
11
Hmm I'm using flex builder 2.0 beta 3 and I get the following errors:

Design mode: Error updating attributes for item DataGrid "entries". Cannot resolve attribute 'columnName' for component type mx.controls.dataGridClasses.DataGridColumn. Cannot resolve attribute 'columnName' for component type mx.controls.dataGridClasses.DataGridColumn. Cannot resolve attribute 'cellPress' for component type mx.controls.DataGrid.

Does anyone know how to fix these problems?

grtz

On 05/15/2006 at 6:00:17 AM EDT Nathan wrote:
12
Hey grtz,

Do u read stuf, or just post???

Read the previous post and u will see that you need to change the columnName property to dataField and cellPress to click.

Duh...

On 05/16/2006 at 10:29:55 AM EDT Pete wrote:
13
I've made some adjustments but it won't work in flex 2...

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%"> <mx:HTTPService id="RSSfeed" url="http://www.petefreitag.com/rss/" resultFormat="object" />

<mx:Panel width="372" height="330" layout="absolute" horizontalCenter="0" verticalCenter="-37.5" title="XML lezen"> <mx:DataGrid x="28" y="10" width="296" id="entries" dataProvider="{RSSfeed.result.rss.channel.item}" click="{body.htmlText=RSSfeed.result.rss.channel.item[entries.selectedIndex].description}"> <mx:columns> <mx:DataGridColumn dataField="title" headerText="Titel"/> <mx:DataGridColumn dataField="pubDate" headerText="Datum"/> </mx:columns> </mx:DataGrid> <mx:TextArea x="28" y="160" width="296" height="90" id="body" /> <mx:Button x="143" y="258" label="Check" click="{RSSfeed.send()}"/> </mx:Panel> </mx:Application>

Can anyone help me? Thnx in advance!

On 05/16/2006 at 11:06:30 AM EDT Bla wrote:
14
The result needs to be lastResult. This would work in flex 2:

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%" horizontalAlign="center" verticalAlign="middle"> <mx:HTTPService showBusyCursor="true" id="RSSfeed" url="http://www.petefreitag.com/rss/" resultFormat="object" />

<mx:Panel width="372" height="330" layout="absolute" horizontalCenter="0" verticalCenter="-18.5" resizeEffect="Resize" title="XML lezen"> <mx:DataGrid width="296" id="entries" dataProvider="{RSSfeed.lastResult.rss.channel.item}" click="{body.htmlText=RSSfeed.lastResult.rss.channel.item[entries.selectedIndex].description}" horizontalCenter="0" verticalCenter="-64"> <mx:columns> <mx:DataGridColumn dataField="pubDate" headerText="Datum"/> <mx:DataGridColumn dataField="title" headerText="Titel"/> </mx:columns> </mx:DataGrid> <mx:TextArea width="296" height="90" id="body" verticalCenter="60" horizontalCenter="0"/> <mx:Button toolTip="Haal recente rss feed binnen" label="Check" click="RSSfeed.send()" verticalCenter="124" horizontalCenter="0"/> </mx:Panel> </mx:Application>

On 06/29/2006 at 3:04:24 AM EDT Nac wrote:
15
Thanks for the sample. I got it working nicely with 2.0, and PHP.

aka flex newb

On 07/10/2006 at 4:55:09 PM EDT doc_x wrote:
16
Thank you for this example.. I would also love to see an example of accessing an MSAcess or MSSql database via an ASP page...

On 07/18/2006 at 12:33:46 PM EDT tester wrote:
17
Macromedia Sucks, They doesnt care about their users I have spend hours learning Flex 1.5 and now none of my projects works in flex 2. They simply change a lot. They doesnt care, they just did it. I would like an Open Source tool to rivalize with Flewx and flash and so on, they have the monoopoly and that is not good for anybody

On 07/26/2006 at 11:29:29 PM EDT Welly wrote:
18
About Macromedia Sucks... Well the big job was done by Adobe, who finally buy Macromedia.

On 10/10/2006 at 11:29:04 PM EDT Sam wrote:
19
Hi Pete,

I would like to have a simple Contact Manager Application written in Flex and Coldfusion backend MSSQL or MSAccess database.

I would like you to help me develop this application. Please contact me via email and we could discuss more and price.

On 11/08/2006 at 5:24:00 AM EST Ron wrote:
20
Hey Pete, Could you put up some more interesting examples? I found this similar exercise in the Adobe tutorials too.

On 11/29/2006 at 10:24:27 AM EST Matze wrote:
21
Hello Mr. Freitag,

I have a problem in flex and hope that you or anybody else can help us.

I have a problem with the MenuBar and a question to delete a component out of storage.

1. We have implemented the MenuBar, which was filled dynamically with XML data.

Sporadically it will appear following fault, if we "mousover" the root layer.

RangeError: Error #2006: Der angegebene Index liegt außerhalb des zulässigen Bereichs. at flash.display::DisplayObjectContainer/addChildAt() at mx.managers::SystemManager/http://www.adobe.com/2006/flex/mx/internal::rawChildren_addChildAt() at mx.managers::SystemManager/addChild() at mx.managers::PopUpManager$/addPopUp() at mx.controls::Menu/show() at mx.controls::MenuBar/::showMenu() at mx.controls::MenuBar/::mouseOverHandler()

Here a abrid ged version of our XML to create the MenuBar:

<Menuebar> ... <menu label="Artikel"> <menu label="Artikel anlegen" data="new_article" /> <menu label="Artikel bearbeiten" data="edit_article" /> <menu label="Verpackung"> <menu label="Verpackung anlegen" data="new_package" /> <menu label="Verpackung bearbeiten" data="edit_package" /> </menu> <menu label="Materialgruppe"> <menu label="Materialgruppe anlegen" data="new_materialgroup" /> <menu label="Materialgruppe bearbeiten" data="edit_materialgroup" /> </menu> </menu> ... </Menuebar>

It is a well-formed XML.

2. Delete a component out of storage We have some own components (basically forms), which will be created and shown by an construct e.g. var myComponent : T_Component = new T_Component ; this.addChild(myComponent)

Some of our forms will be created in an popup. On every call of the popup, we lost 5 mb or more, all childs on the windows will be removed by formname.removeAllChild(); What cann we do, that the garbage collector will dispose this objects. Is there a way to show all objects with references (NOT NULL)?

I have read in the Flex Help, that this.removeChild(myComponent) not delete the form and/or object out of the storage. Rather the object must be destroyed.

It is sufficient to call delete(myComponent) about remove this object out of the storage as the case may be that the garbage-collector remove this object at any time? Or how can I destroy a component correctly. What happens with the widgets on this component e.g. input fields or datagrids? Are they also being deleted?

Thanks for your help.

Matze

On 12/08/2006 at 1:02:25 AM EST nithya wrote:
22
i am new to flex?

plz can u let me know about flex?

On 01/20/2007 at 1:04:33 AM EST lekha wrote:
23
i am new to flex?plz can u let me know about flex?

On 01/24/2007 at 4:59:43 AM EST ankit mittal wrote:
24
i am working on flex 2, i made an mxml application with some cutom controls added to the library but it is not showing me the controls on design mode when added. however when we run it the controls are shown fine. in design mode it gives the error Design mode: Error updating attributes for item MstrGauge. please suggest me some thing

On 01/26/2007 at 1:04:18 PM EST Andre wrote:
25
I have a question. I put the code that bla say, and i changed the url to http://exameinformatica.clix.pt/rss/?output=rss i can't it read that? sorry, if i have any error but i'm not english.

On 04/03/2007 at 1:23:00 AM EDT steven wrote:
26
I want to ask how to use the httpservice works. I mean what if i want to get data from a local file? I'm sorry if the question seem stupid but i am new to this. can you put something like a localhost in the parameters of httpservice?

On 04/03/2007 at 6:49:24 AM EDT Balasubramanian wrote:
27
How to put navigation bar using mxml,i'm new to flex.

On 05/01/2007 at 4:27:40 AM EDT Flexer111 wrote:
28
hi@all is it posible to build a search engine to scan the xml or Rss file?

On 05/11/2007 at 2:30:44 AM EDT Bali wrote:
29
Hi Can we use this thing in php

if yes, how can

bali http://www.developnew.com

On 05/11/2007 at 8:32:12 AM EDT KMJ wrote:
30
Hi, i am a newb 2 dis. cld anybody plz suggest me with links that have good flex tutorials? Thanks in advance.

On 06/22/2007 at 4:55:27 AM EDT ASP wrote:
31
After converting above example to Flex 2 I am getting the following error.

1119: Access of possibly undefined property result through a reference with static type mx.rpc.http.mxml:HTTPService.

Plz guide as I am a newB.

On 07/04/2007 at 12:51:32 AM EDT Aysha wrote:
32
how can i bind the data of DataGrid row on the Onclick event to the column chart in Flex 2.0 pls tell me

On 07/11/2007 at 10:16:56 AM EDT Ritesh wrote:
33
ASP: change the result to lastResult and it'll work..good luck

On 08/24/2007 at 4:33:50 AM EDT Balaji wrote:
34
Hi,,,I need to connect the flex in the mysql,,, dont know how to connect,,, can any one help me,. for connecting with database...

On 08/30/2007 at 6:26:53 PM EDT Pj wrote:
35
I use a php file to translate my Mysql to Xml $Query = "SELECT * from flex"; $Result = mysql_query( $Query ); $Return = "<pjflex>"; while ( $Flex = mysql_fetch_object( $Result ) ) { $Return .= "<flex> <1>".$Flex->flex_id."</1> <2>".$Flex->flex_id."</2> <3>".$Flex->flex_id."</3> <4>".$Flex->flex_id."</5> <5>".$Flex->flex_id."</5> </flex>"; } $Return .= "</pjflex>"; the numbers are just chosen XML tags flex_id = = the name you have it in Flex and for storing it in an datafield <mx:HTTPService url="XML.php" id="myData" showBusyCursor="true" useProxy="false"/> <mx:Panel width="562" height="417" layout="absolute"> <mx:DataGrid x="10" y="10" width="522" height="357" dataProvider="{myData.lastResult.pjflex.flex} " > <mx:columns> <mx:DataGridColumn headerText="name" dataField="1" sortDescending="true" width="30"/> <mx:DataGridColumn headerText="name" dataField="2" width="50"/> <mx:DataGridColumn headerText="name" dataField="3"/> <mx:DataGridColumn headerText="name" dataField="4"/> <mx:DataGridColumn headerText="name" dataField="5"/> you have to chose the name ofcourse myData.lastResult.pjflex.flex this a the hierarchy of my XML file pjflex > flex but this is not nessesairy. hope this helps

On 10/03/2007 at 9:48:11 PM EDT Lee wrote:
36
A full body x-ray scan is an effective method of maintaining a high level of security

On 10/04/2007 at 11:39:38 PM EDT Alan Garcia wrote:
37
Hello all,

I hae two weeks to build out a report module to a Flex 2.0 project using ColdFusion and MSSQL as a backend.

Up until now, I've only worked with PHP and Rails (both using MySQL).

The report is a little intense, but it is in a spreadsheet format. Are there any recommendations in terms of tutorials on built-in report features in Flex 2.0 as well as export functionality to different office/adobe document formats?

On 10/11/2007 at 10:41:55 AM EDT ibitus wrote:
38
Hi Pete, thank you for this nice Reader!

Some RSS-Feeds are working fine and some bring the Error-Message: [RPC Fault faultString="Security error accessing url" faultCode="Channel.Security.Error" faultDetail="Destination: DefaultHTTP"] at mx.rpc::AbstractInvoker/http://www.adobe.com/2006/flex/mx/internal::faultHandler() at mx.rpc::Responder/fault() at mx.rpc::AsyncRequest/fault() at ::DirectHTTPMessageResponder/securityErrorHandler() at flash.events::EventDispatcher/flash.events:EventDispatcher::dispatchEventFunction() at flash.events::EventDispatcher/dispatchEvent() at flash.net::URLLoader/flash.net:URLLoader::redirectEvent()

What is going wrong ?

On 10/22/2007 at 1:08:19 PM EDT manisha wrote:
39
HI, I had tried that above example and made changes as Click and DataField too. But still I am getting this error "1119: Access of possibly undefined property result through a reference with static type mx.rpc.http.mxml:HTTPService. testing/src testing.mxml"

Pls anyone can explain me...

On 11/12/2007 at 5:54:51 AM EST Balaji wrote:
40
Hi all hope all doing well in flex... i am doing the connectivity for Mysql through webservice, i can able to get the data from database. now need to do the circle of Insert, edit, delete.. send me if anyone knows about this,,

On 12/17/2007 at 7:07:07 PM EST Don wrote:
41
Just installed Flex 3, tried out your code, got, Severity and Description Path Resource Location Creation Time Id Cannot resolve attribute 'columnName' for component type mx.controls.dataGridClasses.DataGridColumn. firstFlexApp/src firstFlexApp.mxml line 15 1197935559448 7

Looks like, cellPress and DataGridColumn are not defined? Any further idea?

Thanks.

On 01/08/2008 at 6:44:28 PM EST Emil wrote:
42
For those who got the 1119 error:

1119: Access of possibly undefined property result through a reference with static type mx.rpc.http.mxml:HTTPService.

Change: httpRSS.result to httpRSS.lastResult

in both occurrences.

On 01/18/2008 at 4:19:18 AM EST Touriste wrote:
43
cellPress may be replaced with itemFocusIn: http://livedocs.adobe.com/flex/2/langref/mx/controls/DataGrid.html#event:itemFocusIn

On 01/18/2008 at 4:59:44 AM EST touriste wrote:
44
My bad.. In fact, instead of using the cellPress property in the datagrid, you will use the selectedItem method in another controler. Here is the complete code (take a look a the DataGrid and the TextArea): <?xml version="1.0" ?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" />

<mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500">

<mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.lastResult.rss.channel.item}"> <mx:columns> <mx:Array> <mx:DataGridColumn dataField="title" headerText="Title" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> </mx:Array> </mx:columns> </mx:DataGrid>

<mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" htmlText="{entries.selectedItem.description}" />

<mx:Button label="Load Blog Entries" click="{httpRSS.send()}" /> </mx:Panel> </mx:Application>

nb: For flex3: - "http://www.macromedia.com/2003/mxml" became "http://www.adobe.com/2006/mxml" - "result" became "lastResult" - "cellPress" doesn't exist anymore (may be "itemClick" now)

nb2: To automatically, get the rss data when you load the page you can add a "completeCreation" paramater in the application tag: <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="{httpRSS.send()}" >

On 01/22/2008 at 9:34:52 PM EST anjaiah wrote:
45
please can you help me out from this issue: I want to flex(dataGrid) to mysql connection and get data from mysql for displaying on the dataGrid

On 01/24/2008 at 11:06:49 PM EST bangers xxx wrote:
46
Rural development is the main cause of wildfires

On 01/25/2008 at 10:47:08 AM EST Touriste wrote:
47
I think you should create a server to connect to your SQL database and then send data to your Flex client. that's the project I am doing.

try MySQL for you DB, Axis2 and Java for your server and maybe some SOAP for the transfert protocole :p

On 02/04/2008 at 3:23:03 PM EST Josh wrote:
48
Thanks for posting this. I am just learning Flex and it was super-helpful. A quick question though: is there a way to set the system to grab more results from the RSS than the 10 or so that it does currently? Thanks!

On 03/17/2008 at 5:22:59 AM EDT MechanisM wrote:
49
I'm sorry, New in Flex.. So.. I wanna know how to autoload RSS content without using this button: <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" /> hmmm??

On 03/18/2008 at 11:43:04 AM EDT Anonymous wrote:
50
I wrote in my comment on 01/18/2008 at 2:59:44 AM MST

To automatically, get the rss data when you load the page you can add a "completeCreation" paramater in the application tag: <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="{httpRSS.send()}" >

On 04/14/2008 at 6:18:33 AM EDT Sid B wrote:
51
For the error "Security error accessing url", have a look at this thread:

http://www.iknowkungfoo.com/blog/index.cfm/2007/12/5/Security-error-accessing-url-problem-with-Flex-SWF

On 05/07/2008 at 5:26:13 PM EDT james wrote:
52
This tutorial is three years old. Does it still work??

On 05/11/2008 at 9:27:36 AM EDT Taran wrote:
53
------------------

On 10/11/2007 at 8:41:55 AM MDT ibitus wrote: 38 Hi Pete, thank you for this nice Reader! Some RSS-Feeds are working fine and some bring the Error-Message: [RPC Fault faultString="Security error accessing url" faultCode="Channel.Security.Error" faultDetail="Destination: DefaultHTTP"] at mx.rpc::AbstractInvoker/http://www.adobe.com/2006/flex/mx/internal::faultHandler() at mx.rpc::Responder/fault() at mx.rpc::AsyncRequest/fault() at ::DirectHTTPMessageResponder/securityErrorHandler() at flash.events::EventDispatcher/flash.events:EventDispatcher::dispatchEventFunction() at flash.events::EventDispatcher/dispatchEvent() at flash.net::URLLoader/flash.net:URLLoader::redirectEvent()

What is going wrong ? ---------------------------

I am also getting the same error.

My file runs fine when i run from Flex. but when i copy the folder to another location, it gives me this error. Any solutions??

On 05/15/2008 at 9:08:56 PM EDT FlexNewb wrote:
54
The problem with all the "beginner tutorials" I'm finding is that none of them explain the crazy "project" creation in Flex Builder! The Flex code looks simple, but what of all these paths, server technologies, remote object access service, Live Cycle, Flash remoting, locations... That is what I need for a beginner's tutorial.

On 05/23/2008 at 11:50:52 AM EDT hippity wrote:
55
Thanks for the tutorial and for the comments. It worked and made sense.

On 05/27/2008 at 7:02:21 AM EDT David wrote:
56
Thanks for this tutorial, Pete, and many thanks Ritesh for your comments

On 06/03/2008 at 1:19:30 PM EDT Ciffy wrote:
57
If you follow the post touriste wrote on 1/18/08, it still works to anyone wondering if it still functions. The code (s)he posted does work.

On 06/09/2008 at 10:19:07 AM EDT Mike wrote:
58
Great tutorial. Implemented it on Flex 3, and with above-mentioned changes, it works!

On 06/18/2008 at 12:30:08 PM EDT Mags wrote:
59
Thanks Pete, great tutorial. Also touriste for updates which worked perfectly first time in Flex3.

On 06/27/2008 at 12:09:00 PM EDT joetopshot wrote:
60
If you follow the changes posted by other people, the rss app works fine under flex 3 (build using eclipse and the flex plugin).

I do have one problem. Links are not showing up nor are some of my escaped literals, such as &rsquo; I need to find another site to see if simple strings like ampersand followed by "lt;" are properly converted. I'm not sure where the problem lies (fyi, the rss feed i'm using that has these funny chars is http://feeds.feedburner.com/littlegreenfootballs/ilds.

On 06/29/2008 at 6:03:02 AM EDT GH wrote:
61
very excellent. U should provide us Free Source code

On 07/08/2008 at 11:46:51 AM EDT David B wrote:
62
This tutorial Rocked!!

I know absolutely nothing about Flex, yet I got this app working in about 30 minutes after reading the whole thing through once. The changes in the comments are necessary for Flex Builder 3.0 as well, just FYI.

Thanks!

On 07/16/2008 at 2:13:14 AM EDT wannabeRockstar wrote:
63
more then 2 1/2 years old yet useful very practical example. thnx!

On 08/07/2008 at 5:31:17 AM EDT Lora wrote:
64
Hi! Thanks to Mr. John Henry's, touriste's comments, its really helpful. And thanks to Mr. Freitag as well, it's really helpful.

It run successfully in Flex 3 here's the edited code: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object"/> <mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500"> <mx:DataGrid id="entries" width="100%" dataProvider="{httpRSS.lastResult.rss.channel.item}" itemClick="{body.htmlText=httpRSS.lastResult.rss.channel.item[entries.selectedIndex].description}"> <mx:columns> <mx:Array> <mx:DataGridColumn dataField="title" headerText="Title" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> </mx:Array> </mx:columns> </mx:DataGrid> <mx:TextArea id="body" editable="false" width="100%" height="300"/> <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" /> </mx:Panel> </mx:Application>

On 08/27/2008 at 7:09:23 AM EDT ronita de wrote:
65
hi how can i create an array of custom components dynamically?

On 09/24/2008 at 11:58:45 PM EDT hyder wrote:
66
@ronita de Use a repeater component http://www.adobe.com/devnet/flex/quickstart/using_the_repeater/

Few more tutorials here: alamgirdesigns.blogspot.com

On 11/03/2008 at 12:53:23 PM EST Abdul Areef A wrote:
67
i am new to Flex, in my application, i have JSP to Display the Data coming from Struts. but i want to display the data using Flex not with JSP. is it possible. give me your valuable suggestion to my areef@visiontss.com

thanks areef

On 11/04/2008 at 1:50:30 AM EST Abdul Areef A wrote:
68
i am new to Flex, in my application, i have JSP to Display the Data coming from Struts. but i want to display the data using Flex not with JSP. is it possible. give me your valuable suggestion to my areef@visiontss.com

thanks areef

On 12/24/2008 at 9:53:38 AM EST chintan wrote:
69
Hi,

First of all thanks for such a wonderful blog.

I am using your technique to display the contents in a text area when an entry is clicked in a DataGrid.

This what I use in DataGrid: click="{body.htmlText=service.lastResult.report.recs[entries.selectedIndex].detail}"

This works fine except for the case when the grid has just one entry. In this case when I click on the entry it gives an error: TypeError: Error #1010: A term is undefined and has no properties.

Can you please guide with this one,

Thanks, Chintan

On 02/02/2009 at 3:09:21 PM EST Mark wrote:
70
First, and seriously, thanks for the cool example. Now - can you help me write some flex code to do the dishes and put away my laundry? OK - back to serious - anyone who has read all the posts this far will know how to modify the original example so that it works. If you don't - go back and read again. Hey there's even code back there that will do your dishes!

On 02/06/2009 at 6:02:46 PM EST Rob wrote:
71
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="{httpRSS.send()}" > <mx:HTTPService id="httpRSS" url="your_site_name_here" />

Completed code with auto load <mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500">

<mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.lastResult.rss.channel.item}"> <mx:columns> <mx:Array> <mx:DataGridColumn dataField="title" headerText="Title" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> </mx:Array> </mx:columns> </mx:DataGrid>

<mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" htmlText="{entries.selectedItem.description}" /> </mx:Panel> </mx:Application>

On 02/21/2009 at 3:58:43 PM EST Keisha wrote:
72
I am using Flex builder 3 for this tutorial. I am very new to Flex and when I released this project to an html file the text field is not editable, nor is the load blog entries button working. I uploaded the project with the swf, html and js file, I entered the url for my website into the http field, so I am not sure what I am doing wrong. Could someone please give me some tips? Thanks.

On 05/04/2009 at 1:27:04 AM EDT ravi wrote:
73
I want to learn flex. plz any one can give the link for the tutorials and examples with source code.

On 05/17/2009 at 1:16:19 AM EDT ravi wrote:
74
how do i use this rss feed example while running on a server like Tomcat 5.5?

On 05/18/2009 at 5:04:51 AM EDT ravi kumar wrote:
75
Excellent Pete.This is very good example for a starter like me.Thanks...

On 05/22/2009 at 7:33:30 PM EDT Amjad Hussein wrote:
76
Hey - I changed his code to make it work with Flex 3. Here it is !

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

<mx:Script> <![CDATA[ import mx.rpc.events.ResultEvent; import mx.collections.ArrayCollection; [Bindable] private var dataFeed:ArrayCollection; private var theEvent:ResultEvent; private function feedHanlder(event:ResultEvent):void{ theEvent = event; dataFeed = event.result.rss.channel.item as ArrayCollection; } private function fillBody(event:Event):void{ var item:Object; item = dataFeed.getItemAt(entries.selectedIndex, 0); body.htmlText = item.description; } ]]> </mx:Script>

<mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" result="feedHanlder(event)" />

<mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500" height="100%">

<mx:Box verticalAlign="middle" horizontalAlign="center" width="100%"> <mx:DataGrid id="entries" width="100%" dataProvider="{dataFeed}" itemClick="fillBody(event)"> <mx:columns> <mx:DataGridColumn dataField="title" headerText="Title" width="200" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> </mx:columns> </mx:DataGrid> <mx:TextArea id="body" editable="false" width="85%" height="300" /> <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" />

</mx:Box> </mx:Panel> </mx:Application>

On 05/26/2009 at 7:39:46 AM EDT Eisner wrote:
77
Hi - most of your textboxes are too small in IE 7.0 to display the content.

On 06/10/2009 at 3:01:39 PM EDT thiazzi wrote:
78
How would you make the button cycle through different RSS feeds? I've been working at this for hours now and can't quite figure it out. I'm sure it's a quick fix for someone who knows what they're doing..

Thanks so much in advance!

On 06/20/2009 at 11:46:47 PM EDT Gabriel Ungureanu wrote:
79
I have written more on the power of Flex and handling browser links with Flex here: http://groups.adobe.com/posts/6bca8cb2e9

On 10/23/2009 at 12:04:57 AM EDT BadGirl91 wrote:
80
And they actually asked me some questions from here. ,

On 11/04/2009 at 2:18:33 PM EST carlos wrote:
81
am looking 4 someone can help me how to creatis link.becouse am bulding webpage in flex 4 fist time and need same help please

On 11/18/2009 at 3:49:15 AM EST karthika wrote:
82
hi; I am new in flex, ImageSnapshot.defaultEncoder; Imagearray=ImageSnapshot.encodeImageAsBase64(ImageSnapshot.captureImage(ColumnChart)); i use adove code for snapshot but i didnt get it,any one tell wat wrong with this code

On 11/26/2009 at 10:06:16 PM EST Manivas wrote:
83
Hi, I am new to Flex, in my application, i need help of learning materials, creating sample coding,how to linking internet application through source code.

On 12/19/2009 at 12:13:43 AM EST udara wrote:
84
im using Flex builder 3,it says that there is no attribute called "cellPress" in dataGrid.what is the reason for this??if you can email me the answer it is better...

On 01/13/2010 at 3:56:38 AM EST suresh wrote:
85
hai pls any one help to me regarding flex Technology

On 01/29/2010 at 6:34:44 AM EST maria wrote:
86
hai am getinf this error Access of possibly undefined property result through a reference with static type mx.rpc.http.mxml:HTTPService.

On 02/10/2010 at 2:40:27 AM EST Krish wrote:
87
Could you just tell me the advantage of using flex controls instead of .net controls.

On 02/22/2010 at 1:07:53 PM EST swapna wrote:
88
hi.. i am new to flex.. can u please explain code of how navigations occur in flex.??

On 03/02/2010 at 4:10:57 AM EST Giri wrote:
89
Hi.. i am new to flex.. could you please explain the code of how to access live videos from server to cient??All the live videos will be captured by server.

Please someone help me out soon

On 03/02/2010 at 4:45:20 AM EST Jon wrote:
90
Hello, I have no background whatsoever in Flex Builder 3. But I've been asled to edit a project that produces an swf file which is then attached to a webpage. Problem is, although I've changed the code and have rebuilt it, the swf file produced does not reflect the changes I made. Is there a key principle to rebuilding a project that's unique to Flex that I could've missed?

On 03/15/2010 at 9:16:27 AM EDT DJ rocks wrote:
91
Looking for free flash basics tutorial? visit www.flash4students.com

its cool..

On 03/23/2010 at 4:01:31 PM EDT tinku wrote:
92
what is the meaning of mx and we are using this mx.

On 03/29/2010 at 7:02:19 PM EDT Cooler wrote:
93
< script >

alert('hello world!'); </ script >

On 04/30/2010 at 1:29:10 AM EDT madhu wrote:
94
hey can anyone help me? i want 2 arry collections as single array collection and assign this araay collection to data provider of a list after i click a button

On 05/04/2010 at 8:15:00 AM EDT ITJobZone wrote:
95
Good simple tutorial. We conduct Flex Corporate Trainings for our client. This Tutorial may help us. Thanks

<a>www.ITJobZone(dot)biz</a>

On 05/31/2010 at 9:31:22 AM EDT Vadim Slutsky wrote:
96
Pros of Flex:

Truely platform independent, supported on various hardware and operating systems and truely working everywhere great. Open Source makes it really easy to understand and extend the functionality. Every control/component can be extended and there are less restrictions overriding default behaviour. The most easy way to create new components, you can have mxml derive from any control and extend them with extensive binding Flex contains lots of controls and you dont need any third party library

On 05/31/2010 at 9:36:32 AM EDT Vadim Slutsky wrote:
97
Pros of Flex:

Truely platform independent, supported on various hardware and operating systems and truely working everywhere great. Open Source makes it really easy to understand and extend the functionality. Every control/component can be extended and there are less restrictions overriding default behaviour. The most easy way to create new components, you can have mxml derive from any control and extend them with extensive binding Flex contains lots of controls and you dont need any third party library

On 09/16/2010 at 3:38:47 PM EDT Ram balaji wrote:
98
I am new to flex.what basics should i know to work in flex

On 12/09/2010 at 8:58:33 AM EST surya wrote:
99
How to set file path in flex to connect sqlite database

On 02/21/2011 at 1:11:53 PM EST soumik mukherjee wrote:
100
hi!will u help me to find a expression that, how can we color a particular row in a "c1flexgrid".

Thankx

On 02/28/2011 at 8:42:41 AM EST asha wrote:
101
hi, i have to populate my datagrid with the arraylist which is returned by my jaava code. i tried all the means but no progress. am returning an arraylist as <b> while(rs.next()) {System.out.println("hai stupid"); B.add(rs.getInt("Ticket_ID")); C.add(rs.getString("MODIFIED_ON")); D.add(rs.getString("SEVERITY")); E.add(rs.getString("E_MAIL")); F.add(rs.getString("IP")); System.out.println("hai "); abc.add(0,B); abc.add(1,C); abc.add(2,D); abc.add(3,E); abc.add(4,F); } </b> on the other hand in my flex prg am calling<b> [Bindable] public var dp:ArrayCollection; </b> . . . . in result handler <b> dp = (event.result as ArrayCollection); </b> where dp is my dataprovider.

plz give me a solution how i shud populate my datagrid.

regards asha

On 02/28/2011 at 8:44:26 AM EST asha wrote:
102
hi, i have to populate my datagrid with the arraylist which is returned by my jaava code. i tried all the means but no progress. am returning an arraylist as <b> while(rs.next()) {System.out.println("hai stupid"); B.add(rs.getInt("Ticket_ID")); C.add(rs.getString("MODIFIED_ON")); D.add(rs.getString("SEVERITY")); E.add(rs.getString("E_MAIL")); F.add(rs.getString("IP")); System.out.println("hai "); abc.add(0,B); abc.add(1,C); abc.add(2,D); abc.add(3,E); abc.add(4,F); } </b> on the other hand in my flex prg am calling<b> [Bindable] public var dp:ArrayCollection; </b> . . . . in result handler <b> dp = (event.result as ArrayCollection); </b> where dp is my dataprovider.

plz give me a solution how i shud populate my datagrid.

regards asha

On 03/10/2011 at 9:52:38 PM EST Dionicio wrote:
103
buen totorial amigo..

On 04/21/2011 at 7:31:56 AM EDT sdfsdgfd wrote:
104
Awesome Post. I add this Post to my bookmarks.

On 06/02/2011 at 8:02:54 AM EDT Raju wrote:
105
i am new to flex?

plz can u let me know about flex?

& vedio tutorials also

On 06/13/2011 at 8:52:15 AM EDT dreamdezign wrote:
106
nice post thanks for posting

On 06/23/2011 at 5:05:13 PM EDT abdulrahim wrote:
107
hi i want to learn adobe flex .now any body knows to mostly use ful tutorial adobe flex pl z ...

On 08/19/2011 at 8:53:29 AM EDT ikr wrote:
108
nice post pete but i'm fresher please let me know more use full tutorial site and posted by u!!!!!

On 11/16/2011 at 2:21:21 AM EST Arun wrote:
109
hi pete.. nice blog... i am sure you must be well verse with the flex technology.. so can u pls put some light on the flex mobile applications..

On 11/17/2011 at 5:44:15 PM EST kelin99 wrote:
110
Hack again?!

On 12/03/2011 at 9:22:10 AM EST flex application development wrote:
111
It's great information for naive flex developer. Thank you posting.

On 12/21/2011 at 4:37:56 AM EST Ates wrote:
112
this is causing too many errors on FB 4.6, i guess something is changed?

On 02/04/2012 at 3:35:44 AM EST :) wrote:
113
hey hi. . flex is useful? Ter is good scope in tat?

On 02/04/2012 at 3:36:27 AM EST :) wrote:
114
hey hi. . flex is useful? Ter is good scope in tat?

On 06/08/2012 at 8:31:57 PM EDT Aaron Sullivan wrote:
115
MXML code for Flex 4.6.0:

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Declarations> <mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" /> </fx:Declarations> <mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500"> <mx:Box verticalAlign="middle" horizontalAlign="center" width="100%"> <mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.lastResult.rss.channel.item}" editable="true" itemClick="{body.htmlText=httpRSS.lastResult.rss.channel.item[entries.selectedIndex].description}" variableRowHeight="true"> <mx:columns> <mx:DataGridColumn dataField="title" headerText="Title" width="200" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> <mx:DataGridColumn dataField="link" headerText="Link"/> </mx:columns> </mx:DataGrid> <mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" /> <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" /> </mx:Box> </mx:Panel> </s:Application>

On 06/08/2012 at 8:32:06 PM EDT Aaron Sullivan wrote:
116
MXML code for Flex 4.6.0:

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Declarations> <mx:HTTPService id="httpRSS" url="http://www.petefreitag.com/rss/" resultFormat="object" /> </fx:Declarations> <mx:Panel id="reader" title="Pete Freitag's Blog Reader" width="500"> <mx:Box verticalAlign="middle" horizontalAlign="center" width="100%"> <mx:DataGrid id="entries" width="{reader.width-15}" dataProvider="{httpRSS.lastResult.rss.channel.item}" editable="true" itemClick="{body.htmlText=httpRSS.lastResult.rss.channel.item[entries.selectedIndex].description}" variableRowHeight="true"> <mx:columns> <mx:DataGridColumn dataField="title" headerText="Title" width="200" /> <mx:DataGridColumn dataField="pubDate" headerText="Date" /> <mx:DataGridColumn dataField="link" headerText="Link"/> </mx:columns> </mx:DataGrid> <mx:TextArea id="body" editable="false" width="{reader.width-15}" height="300" /> <mx:Button label="Load Blog Entries" click="{httpRSS.send()}" /> </mx:Box> </mx:Panel> </s:Application>

On 06/26/2012 at 3:09:23 AM EDT nishu wrote:
117
please give the basic example of flex

Post a Comment




  



Spell Checker by Foundeo

Recent Entries



foundeo


did you hack my cf?