Flash RSS Scroller / Vertical Ticker using ActionScript
Posted by matthew | Posted in Tutorial | Posted on 18-12-2009
Tags: ActionScript, Flash, RSS, Twitter, XML
2
Showing an RSS feed in Flash can often be tricky, however we have found a way to make it a lot easier and to animate the feed. Our example uses an RSS feed from Twitter, but this piece of code will work for any standard RSS feed.
First off create a dynamic text box with the multi-line option and HTML formatting turned on. Format the font colour and size to whatever you like and make the box 600 pixels tall (you’ll see why in a minute).
Now on your first and only frame you will require, paste this code into your actions panel:
String.prototype.replace = function(searchStr, replaceStr):String {
var arr:Array = this.split(searchStr);
return arr.join(replaceStr);
};
//create the xml object
xmlLoad = new XML();
//load the feed. This is grabbed from the GET parameter "feed"
xmlLoad.load("http://twitter.com/statuses/user_timeline/xxxx.rss");
xmlLoad.ignoreWhite = true;
//When the XML file has fully loaded, change the text
xmlLoad.onLoad = function(success){
//if successful
if(success && xmlLoad.status == 0){
//reset the text
textfield="";
//List of items
var xmlItems:XML = xmlLoad.firstChild.firstChild;
for (var m = 0; m
//grab each item
if (xmlItems.childNodes[m].nodeName == "item") {
for (var n = 0; n
if (xmlItems.childNodes[m].childNodes[n].nodeName == "link") {
//grab the link of the item
var str:String = itemlink=xmlItems.childNodes[m].childNodes[n].firstChild.toString();
// replace $person with 'Flash developer' and trace it
var replacedStr:String = str.replace('mytweetname: ','');
itemlink=replacedStr;
}
if (xmlItems.childNodes[m].childNodes[n].nodeName == "title") {
//grab the title of the item
var str:String = itemlink=xmlItems.childNodes[m].childNodes[n].firstChild.toString();
// replace $person with 'Flash developer' and trace it
var replacedStr:String = str.replace('mytweetname: ','');
itemtitle=replacedStr;
}
}
//add the current item to the feed scroller
textfield+= itemtitle+"
-
";
}
}
//if there are no items in the feed, set it to " " to show an empty feed
//set the text
scrollingtext.htmlText=textfield;
scrollingtext.autoSize = true;
scrollingtext._height;
starty = scrollingtext._y;
startheight = scrollingtext._height;
//trace(startheight*-1);
//reset the scroll position
//if there are no items in the feed, set it to " " to show an empty feed
if(textfield==""){
textfield=" ";
}
}}
stop();
onEnterFrame = function() {
if (scrollingtext._y < (startheight*-1)+400) {
scrollingtext._y = starty+600;
}
speed = 1;
scrollingtext._y -= speed;
//trace(scrollingtext._y+"<"+(startheight*-1));
}
The items you will need to change are the feed address:
xmlLoad.load("http://twitter.com/statuses/user_timeline/xxxx.rss");
If you are using a Twitter feed then you will need to change this line to your Twitter username or remove it if this is not a Twitter feed:
var replacedStr:String = str.replace('mytweetname: ','');
This line removes the Twitter username from displaying, but can be removed or you may wish to use this function to replace different words (obsense ones spring to mind).
Also if you haven’t made the box 600 pixels tall you will need to change the overflow repeat value:
scrollingtext._y = starty+600;
Where you change 600 to the height you made the box, this can be configured to a different value if you prefer however. If you do choose a different value consider changing the 400 value on the previous lines to 2/3’s of the new height you set.
You may also wish to change the speed which is set on this line:
speed = 1;
This will move the box one pixel at a time, making it a higher number will increase the scrolling speed and lower making it slower (anything lower than zero will make it go backwards). Here is what ours looks like for inspiration:




Great tutorial, easy to follow, unfortunately I’m have a problem, it keeps telling me
‘)’ expected
on the line that says
if(success && xmlLoad.status == 0){
Am I doing something wrong?, I followed all the instructions perfectly….I don’t know….
Looks like the WordPress editor has messed that line up it should read:
if(success && xmlLoad.status == 0){
Simply replace the ampersands for the correct symbols, sorry about that!