3 Replies Latest reply on May 18, 2010 3:31 PM by EliezerReis

    Scroll large amount of text

    EliezerReis

      During these days I've tryed everything to do readable scrolling text, but everything that I tryed I got to much vibrations on text. The code below ilustrate my last test. If someone have some suggestion to optimize the scroller or some customization to the text it will be very helpfull. What I don't understand well is if I use images, or draw squares it works well, the problems are just with text. Anyone has any ideia?

       

      Thanks a lot

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
           xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"
           creationComplete="init()" frameRate="60">
      
           <fx:Declarations>
                <s:Linear id="linearEaser" easeInFraction="0" easeOutFraction="0.5"/>
                <s:Animate id="animate" target="{dataGroup}" duration="{dataGroup.contentHeight*5}"
                     easer="{linearEaser}">
                     <s:SimpleMotionPath id="motion" property="verticalScrollPosition" valueFrom="0"
                          valueTo="{dataGroup.contentHeight}"/>
                </s:Animate>
           </fx:Declarations>
      
           <fx:Script>
                <![CDATA[
                     import mx.collections.ArrayCollection;
                     import mx.effects.Move;
      
                     import spark.components.VScrollBar;
                     import spark.effects.*;
                     import spark.effects.animation.*;
                     import spark.effects.easing.*;
      
                     [Bindable]
                     private var collection:ArrayCollection=new ArrayCollection();
      
                     private function init():void {
                          collection.disableAutoUpdate();
                          for (var i:int=0; i < 5; i++) {
                               var str:String="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut odio. Nam sed est. Nam a risus et est iaculis adipiscing. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer ut justo. In tincidunt viverra nisl. Donec dictum malesuada magna. Curabitur id nibh auctor tellus adipiscing pharetra. Fusce vel justo non orci semper feugiat. Cras eu leo at purus ultrices tristique.";
                               collection.addItem(str);
                          }
                          collection.enableAutoUpdate();
                          maximize();
                     }
                ]]>
           </fx:Script>
      
           <s:layout>
                <s:HorizontalLayout/>
           </s:layout>
      
           <s:VGroup width="300">
                <s:HGroup>
                     <s:Button click="{animate.play()}" label="Play"/>
                </s:HGroup>
           </s:VGroup>
      
           <s:DataGroup id="dataGroup" width="100%" height="100%" dataProvider="{collection}"
                clipAndEnableScrolling="true" >
                <s:layout>
                     <s:VerticalLayout gap="0"/>
                </s:layout>
                <s:itemRenderer>
                     <fx:Component>
                          <s:ItemRenderer  width="100%" height="100%" autoDrawBackground="true">
                               <s:RichText text="{data}" width="{width}" fontSize="50"/>
                          </s:ItemRenderer>
                     </fx:Component>
                </s:itemRenderer>
           </s:DataGroup>
      
      </s:WindowedApplication>