With this new library projectI made a flex application which reads a xml with all the scrolling text entries. Now I only have to update the xml if I make a change to the website. You can click on one of the scrolling entries and the link event redirects this to the right url. Here is an picture of the scrolling bar.
Here is the xml which I use as input for the scrolling htmlText.
<updates>
<update date="28-06-2008" link="http://www.sbsframes.nl/raceteam/raceteam.html" label="Raceteam"/>
<update date="26-06-2008" link="http://www.sbsframes.nl/youtube/youtube.html#video=119" label="Kerkdriel race 2"/>
<update date="26-06-2008" link="http://www.sbsframes.nl/youtube/youtube.html#video=118" label="Kerkdriel race 1"/>
<update date="24-06-2008" link="http://www.sbsframes.nl/fotos/Fotos.html" label="Fotoalbum"/>
</updates>
My Flex project code which reads the input xml and handles the link event.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:comp="com.keaura.controls.*"
applicationComplete="service.send()"
width="100%" height="25"
backgroundGradientColors="[#CCCCCC, #CCCCCC]"
horizontalScrollPolicy="off"
verticalScrollPolicy="off" layout="absolute">
<mx:Script>
<![CDATA[
import flash.events.TextEvent;
import mx.rpc.events.ResultEvent;
public function linkHandler(event:TextEvent):void {
navigateToURL(new URLRequest(event.text), '_self')
}
private function resultHandler(event:ResultEvent):void {
var resultObj:Object = event.result as Object;
var i:int;
var updatesText:String = "<font color='#000000' size='14'>"
+"Laatste updates: ";
for ( i = 0 ; i < resultObj.updates.update.length ; i++ ) {
updatesText += "<a href='event:"+resultObj.updates.update[i].link+"'>"
+"<b>"+resultObj.updates.update[i].date+"</b> "
+resultObj.updates.update[i].label+"</a> ";
trace(resultObj.updates.update[i].label);
}
scroll.htmlText = updatesText;
scroll.addEventListener("link", linkHandler);
scroll.start();
}
private function mouseOver():void {
scroll.stop();
}
private function mouseOut():void {
scroll.start();
}
]]>
</mx:Script>
<mx:HTTPService id="service" url="updates.xml"
result="resultHandler(event)"
resultFormat="object"
useProxy="false"
showBusyCursor="true" />
<comp:ScrollingText id="scroll" width="100%" height="100%"
color="black" speed="3" x="0" y="0"
mouseOver="mouseOver()" mouseOut="mouseOut()"/>
</mx:Application>
Hi Edwin,
ReplyDeleteI am tryig to use you component to make a scrolling news ticker. I have it woking quite well, and the content is refreshed every 10 minutes via XML. however as soon as I have more text than can fit on the screen at once the component resizes and I get scrollbars. I have it inside a Panel as in your example but I have the width at 100% so that it fills the screen. is there a way to prevent the scrollbars appearing?
Hi Martin,
ReplyDeleteI will take a look.
Thanks Edwin
Hi Martin,
ReplyDeleteI changed the mxml so there is no scrollbars and if you do a mouse over the scrolling text stops so you can click on the update.
Thanks Edwin
I'm trying to do something very similar to this and tried to use your code just as is. I am fairly new to Flex but know the basics. I imported the project and then copied your MXML contents into a new MXML document in the project. I get an error that says:
ReplyDelete"046: Type was not found or was not a compile-time constant: ScrollingText. RSS2/src RSS3.mxml line 49 1221706942592 190"
Any ideas?
Hi
ReplyDeleteare you using Flex 3 and did you download my library component and add this to the project.
thanks Edwin
Hi Edwin,
ReplyDeleteThanks for posting this online. It was a very helpful find!
In case anyone else needed this... I was able to smooth out the scrolling animation by adding a 'frameRate="60"' attribute to my mx:Application tag.
Hi Edwin,
ReplyDeleteThanks for putting this together, first of all. :)
I'm having a small problem, though. I need to have line-breaks in my scroller - it's a vertically-scrolling list of urls. I can't seem to get it to recognise
tags, although I had understood that the main reason for your creating your version was to allow more HTML to be used. I also tried using the \n type of line-break, but all that happens then is that it displays the first item and nothing else.
Can you suggest what I might be doing wrong?
You don't need that hack .. to have html text in Peter Ent's Scrolling Text it's enaugh to change lines 198 - 199 from this:
ReplyDeletecache[0].text = text;
cache[1].text = text;
to this:
cache[0].htmlText = text;
cache[1].htmlText = text;
Its an xcellent job... working very much fine and was looking for this component.. thanks
ReplyDeletehi edwin,
ReplyDeletehow to display the text with some linebreak if i use this component? pls advice