
25-09-07, 16:54
|
|
Administrator
|
|
Join Date: Jul 2007
Location: Cesena
Posts: 4,535
Rep Power: 6
|
|
|
How to read and view a RSS with Flash CS3
|
|
Good day to all.
A while ago, we saw how to read an XML file loaded with Flash CS3 .
We also saw how to use a timer.
Conclusion: we have an RSS (nothing else then an XML file) which contains data of the last 10 articles and we have a timer"let"s realise a slideshow of the titles!!
I will use the RSS of this site. You can see it here: Last 10 articles
As the RSS gives us a node attribute which contains the article"s title and a node attribute which contains the url to the article, our slideshow will have each article clickable and linked to the right article.
Let"s see how" I create a FLA and save it as "rss.fla". Inside it, I have some graphics but the important thing is a dynamic text field named "title_txt" to which I will assign the value of the node , node child of in the XML created by the RSS.
I create a Document Class, an AS file saved as "Rss.as", implemented the following way:
Code:
package
{
import flash.display.MovieClip;
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.MouseEvent;
import flash.events.Event;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.AntiAliasType;
import flash.text.TextFormat;
import flash.net.URLRequest;
import flash.net.navigateToURL;
public class Rss extends MovieClip
{
private var xml:LoadingXML;
public var objects_array:Array;
private var clips_array:Array;
private var container_mc:MovieClip;
private var timer:Timer;
private var id:int=0;
public function Rss()
{
init();
}
private function init():void
{
stage.frameRate=31;
objects_array=new Array();
clips_array=new Array();
createContainer();
loadXML();
}
private function createContainer():void
{
container_mc=new MovieClip();
addChild(container_mc);
swapChildren(angles_mc,container_mc);
}
private function loadXML():void
{
xml=new LoadingXML(this);
}
public function createClipsAndFields():void
{
for(var i:int=0;i < objects_array.length;i++)
{
var clip:MovieClip=new MovieClip();
container_mc.addChild(clip);
clip.addChild(getTF(i));
clips_array.push(clip);
}
positionClips();
var time:TimerEvent;
go(time);
}
private function getTF(i:int):TextField
{
var field:TextField=new TextField();
field.autoSize=TextFieldAutoSize.LEFT;
field.multiline=false;
field.selectable=false;
field.embedFonts=true;
field.background=true;
field.antiAliasType=AntiAliasType.ADVANCED;
field.backgroundColor=0xCB4425;
field.defaultTextFormat=getFormat();
field.text=objects_array[i].titolo;
return(field);
}
private function getFormat():TextFormat
{
var tf:TextFormat=new TextFormat();
tf.font='Lucida Sans';
tf.size=22;
tf.color=0xFFFFFF;
return(tf);
}
private function positionClips():void
{
for(var i:int=0;i < clips_array.length;i++)
{
clips_array[i].id=i;
clips_array[i].x=(stage.stageWidth-clips_array[i].width)/2;
clips_array[i].y=stage.stageHeight+clips_array[i].height;
clips_array[i].alpha=0;
clips_array[i].addEventListener(MouseEvent.MOUSE_DOWN,goURL);
}
}
private function startTimer():void
{
timer=new Timer(3000,1);
timer.addEventListener(TimerEvent.TIMER,go);
timer.start();
}
private function go(t:TimerEvent):void
{
clips_array[id].addEventListener(Event.ENTER_FRAME,fadeIn);
var i:int=id-1;
if(i < 0)
i=clips_array.length-1;
clips_array[i].addEventListener(Event.ENTER_FRAME,fadeOut);
}
private function fadeIn(e:Event):void
{
var arrA:Number=1;
var da:Number=arrA-e.currentTarget.alpha;
var aa:Number=da*.2;
e.currentTarget.alpha+=aa;
var arrY:Number=stage.stageHeight/2-e.currentTarget.height/2;
var dy:Number=arrY-e.currentTarget.y;
var ay:Number=dy*.2;
e.currentTarget.y+=ay;
if(Math.abs(dy)<=.2)
{
e.currentTarget.removeEventListener(Event.ENTER_FRAME,fadeIn);
e.currentTarget.y=arrY;
e.currentTarget.alpha=arrA;
id++;
if(id>=clips_array.length)
id=0;
startTimer();
}
}
private function fadeOut(e:Event):void
{
var arrA:Number=0;
var da:Number=arrA-e.currentTarget.alpha;
var aa:Number=da*.2;
e.currentTarget.alpha+=aa;
var arrX:Number=stage.stageWidth;
var dx:Number=arrX-e.currentTarget.x;
var ax:Number=dx*.2;
e.currentTarget.x+=ax;
if(Math.abs(dx)<=.2)
{
e.currentTarget.removeEventListener(Event.ENTER_FRAME,fadeOut);
e.currentTarget.x=(stage.stageWidth-e.currentTarget.width)/2;
e.currentTarget.y=stage.stageHeight+e.currentTarget.height;
e.currentTarget.alpha=arrA;
}
}
private function goURL(m:MouseEvent):void
{
var url:String=objects_array[m.currentTarget.id].link;
var request:URLRequest=new URLRequest(url);
navigateToURL(request);
}
}
}
I then have my LoadingXML class (used more then once in this site), implemented the following way:
Code:
package
{
import flash.display.Loader;
import flash.display.MovieClip;
import flash.events.*;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.xml.*;
public class LoadingXML extends MovieClip
{
private var Root:MovieClip;
public function LoadingXML(m:MovieClip)
{
Root=m;
this.loadXML();
}
private function loadXML():void
{
var loader:URLLoader=new URLLoader();
loader.addEventListener(Event.COMPLETE,completeHandler);
var request:URLRequest=new URLRequest
('http://www.flepstudio.org/english/option,com_rss/feed,OPML/no_html,1.html');
try
{
loader.load(request);
}
catch(error:Error)
{
trace('Unable to load requested document.');
}
}
private function completeHandler(event:Event):void
{
var loader:URLLoader=URLLoader(event.target);
var result:XML=new XML(loader.data);
var myXML:XMLDocument=new XMLDocument();
myXML.ignoreWhite=true;
myXML.parseXML(result.toXMLString());
var node:XMLNode=myXML.firstChild;
var numeroArticoli:int=int(node.firstChild.nextSibling.childNodes.length);
for(var i:int=0;i < numeroArticoli;i++)
{
var obj:Object=new Object();
obj.titolo=node.firstChild.nextSibling.childNodes[i].attributes['title'];
obj.link=node.firstChild.nextSibling.childNodes[i].attributes['url'];
Root.objects_array.push(obj);
}
Root.createClipsAndFields();
}
}
}
The result (click a title to view the right link taken from the RSS):
Let"s analyse the code:
Rss.as Class
Properties
An instance of the LoadingXML class which will load, read and view the XML data
private var xml:LoadingXML;
an array to store the XML data
public var objects_array:Array;
an Array to store the MovieClip, to be able to keep track of them and recall them when needed
private var clips_array:Array;
a MovieClip used as container of all the MovieClip created
private var container_mc:MovieClip;
a Timer
private var timer:Timer;
a numerical variable which contains a value increased so to run trough the index arrays
private var id:int=0;
Methods
init();
I impost the frame rate
stage.frameRate=31;
I initialise the 2 arrays
objects_array=new Array();
clips_array=new Array();
I call the method createContainer
createContainer();
I call the method loadXML
loadXML();
createContainer();
I create the MovieClip container
container_mc=new MovieClip();
I add it to the DisplayObject (otherwise it would not be visible)
addChild(container_mc);
I swap levels of the MovieClips "container_mc" and "angles_mc" which is a MovieClip containing graphics in "rss.fla"
swapChildren(angles_mc,container_mc);
loadXML();
I create an instance of LoadingXML class passing it the value of _root.LoadingXML which once done, will call a Rss.as method "createClipsAndFields"
xml=new LoadingXML(this);
createClipsAndFields();
I open a cycle with the objects_array length (populate by the LoadingXML class) as a maximum iteration
for(var i:int=0;i < objects_array.length;i++)
{
I create a MovieClip
var clip:MovieClip=new MovieClip();
I add it to container_mc
container_mc.addChild(clip);
I add to the clip a text field created by the function "getTF" and pass it the value of "i", the iteration of the cycle at that moment
clip.addChild(getTF(i));
I add the clip to clips_array
clips_array.push(clip);
}
I call the method positonClips
positionClips();
I could directly call the method go(), but to do it, I will need to first create a ghost instance of TimerEvent., as the method go() will be called from a timer except the first time and requires a parameter tipe TimerEvent
var time:TimerEvent;
now I can call the method go() passing it the instance TimerEvent
go(time);
getTF(i:int):TextField
I create a dynamic text field and assign to it the properties needed
var field:TextField=new TextField();
field.autoSize=TextFieldAutoSize.LEFT;
field.multiline=false;
field.selectable=false;
field.embedFonts=true;
field.background=true;
field.backgroundColor=0xCB4425;
I assign a TextFormat to the text field calling the method getFormat which will return an instance of TextFormat
field.defaultTextFormat=getFormat();
I assign the text to the field: the value of index "i" (returned in the cycle of the method createClipsAndFields as already seen) of objects_array containing the instance of the Object class with properties assigned in runtime by the loadingXML class at the lecture of the XML file
field.text=objects_array[i].titolo;
I return the text field
return(field);
getFormat():TextFormat
I create an instance of TextFormat
var tf:TextFormat=new TextFormat();
I assign to them a font so that the font is visible to all users and embedded in the swf. See the article: How to embed fonts in the SWF with Flash CS3
tf.font='Hypatia Sans Pro Semibold';
I assign a font dimension
tf.size=24;
I assign a color
tf.color=0xFFFFFF;
I return the TextFormat
return(tf);
positionsClips();
I create a cycle with clips_array length as the maximum iteration
for(var i:int=0;i < clips_array.length;i++)
I assign a property to the MovieClip, named "id" equal to clips_array index "i"
clips_array[i].id=i;
I position the MovieClips
clips_array[i].x=(stage.stageWidth-clips_array[i].width)/2;
clips_array[i].y=stage.stageHeight+clips_array[i].height;
I impost alpha to zero
clips_array[i].alpha=0;
I add a listener to the event MOUSE_DOWN to the clip which will call the method goURL()
clips_array[i].addEventListener(MouseEvent.MOUSE_DOWN,goURL);
startTimer();
I create an instance of Timer with the values of 3 seconds and one call
timer=new Timer(3000,1);
I start the timer which call the function go() which explains the use of the ghost instance of TimerEvent explained earlier on
timer.addEventListener(TimerEvent.TIMER,go);
timer.start();
go();
I create an interval ENTER_FRAME to the index "id""s clip, numerical variable explained earlier on
clips_array[id].addEventListener(Event.ENTER_FRAME,fadeIn);
Pay attention"as I want a data clip disappears as the next one appears, I will use "id-1" to call the clip which needs to disappear. If "id" equal zero, "id-1" would then be negative which would be impossible as an array do not contain a negative index. I will use a conditional logic that if "id" equal zero, "id-1" would not result to -1 but to the last clip of the array. I create a numerical variable which checks the value of "id" and if "id" is equal to zero, I pass a value equal to the last index of clips_array
var i:int=id-1;
if(i < 0)
i=clips_array.length-1;
At the same time, I will create an interval ENTER_FRAME to the clip which needs to disappear
clips_array[i].addEventListener(Event.ENTER_FRAME,fadeOut);
fadeIn();
I apply the inertia effect to the clip"s y and alpha
var arrA:Number=1;
var da:Number=arrA-e.currentTarget.alpha;
var aa:Number=da*.2;
e.currentTarget.alpha+=aa;
var arrY:Number=stage.stageHeight/2-e.currentTarget.height/2;
var dy:Number=arrY-e.currentTarget.y;
var ay:Number=dy*.2;
e.currentTarget.y+=ay;
if(Math.abs(dy)<=.2)
{
e.currentTarget.removeEventListener(Event.ENTER_FR AME,fadeIn);
e.currentTarget.y=arrY;
e.currentTarget.alpha=arrA;
arrived at destination I increase the variable "id"
id++;
I check that it is not over the maximum index of clips_array
if(id>=clips_array.length)
If it is bigger or equal I reset "id" to zero
id=0;
I recall the function startTimer
startTimer();
}
fadeOut();
I apply the inertia effect to the clip"s x and alpha
var arrA:Number=0;
var da:Number=arrA-e.currentTarget.alpha;
var aa:Number=da*.2;
e.currentTarget.alpha+=aa;
var arrX:Number=stage.stageWidth;
var dx:Number=arrX-e.currentTarget.x;
var ax:Number=dx*.2;
e.currentTarget.x+=ax;
if(Math.abs(dx)<=.2)
{
e.currentTarget.removeEventListener(Event.ENTER_FR AME,fadeOut);
e.currentTarget.x=(stage.stageWidth-e.currentTarget.width)/2;
e.currentTarget.y=stage.stageHeight+e.currentTarge t.height;
e.currentTarget.alpha=arrA;
}
goURL(m:MouseEvent);
I create a string variable inside which I insert the value of index (with number equal to the "id" property added to each clip) of the link property of the array"s object
var url:String=objects_array[m.currentTarget.id].link;
I create an instance of the URLRequest class
var request:URLRequest=new URLRequest(url);
and call the browser
navigateToURL(request);
Easier to do then explain :P
Source files: |
__________________
I recommend: Essential Actionscript 3.0
- I do not reply technicians pvt messages. Open a thread !
- Non rispondo ai messaggi privati con domande tecniche. Apri una discussione sul forum !
Last edited by Flep; 28-08-08 at 06:21..
|