2 Replies Latest reply on May 8, 2009 6:33 AM by Gregory Lafrance

    Grid adding row/item effect

    Yaar86

      Hi all,

       

      I'm trying to make a Grid which shows each item being added one by one, or each row one by one, so you get a nice visual effect when initializing the grid. To give you an idea; I'm making a complete yearview of a calendar, so you see all the days of each month, but I'd love to have an addedEffect or showEffect. So far all my tries have resulted into the same thing: all items/rows get loaded and then you see the effect thrown on ALL rows/items in the end.

       

      Piece of code to help you get started in case you want to help:

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init(event)">
          <mx:Script>
              <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.controls.Button;
                  import mx.containers.GridRow;
                  import mx.containers.GridItem;
                  import mx.controls.Label;
                  import mx.effects.easing.*;
                 
                  private var _gridItem:GridItem;
                  private var _gridRow:GridRow;
                  private var _label:Button;
                 
                  private function init(event:Event):void{
                      for(var j:uint = 0; j < 10; j++){
                          _gridRow = new GridRow();
                          for(var i:uint = 0; i < 10; i++){
                              _gridItem = new GridItem();
                              _gridItem.setStyle("addedEffect", rotate);
                              _label = new Button();
                              _label.setStyle("addedEffect", rotate);
                              _label.label = "knop" + j + i;
                              _gridItem.addChild(_label);
                              _gridRow.addChild(_gridItem);
                              for(var k:uint = 0; k < 9999; k++){
                                  trace("lol" +k);
                              }
                          }
                          gridje.addChild(_gridRow);
                      }
                  }
                 
              ]]>
          </mx:Script>
         
          <mx:Grid id="gridje" />
           
          <mx:Fade id="fade" />
          <mx:Rotate id="rotate"
                  angleFrom="-180"
                  angleTo="0"
                  easingFunction="Elastic.easeInOut"
                  duration="2000" />
                 
      </mx:Application>

       

       

       

       

       

       

       

      Thanks in advance.

      Yannick