0 Replies Latest reply on Jun 25, 2009 7:05 PM by eldho123

    Flip effect not working properly

    eldho123

      Hello Friends,

       

      I am just a beginner in flex. Sorry for asking such a silly question. In the below code I am trying to make a Flip effect using Alex Uhlmann's libraries. When I click on the Datagrid, its not flipping properly. (When the table flips the red colored canvas is supposed to be on the other side of the datagrid. But it just stays in the background). I am missing something in my code. I very much appreciate your help

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:mxeffects="com.adobe.ac.mxeffects.*" layout="absolute">
          <mx:states>
              <mx:State name="anotherState">
                  <mx:AddChild relativeTo="{tab1}">
                      <mx:Canvas id="canvas2" left="10" right="10" top="110" bottom="10" backgroundColor="red"/>
                  </mx:AddChild>
              </mx:State>
          </mx:states>
          
          <mx:transitions>
              <mx:Transition fromState="" toState="anotherState" effect="{flip}"/>
          </mx:transitions>
          
          <mx:Sequence id="flip" duration="2000">
              <mxeffects:Flip target="{canvas1}" siblings="{[canvas2]}"/>
          </mx:Sequence>
      
          <mx:TabNavigator right="10" left="10" bottom="10" top="100" cornerRadius="6">
              <mx:Canvas id="tab1" label="Tab-2" width="100%" height="100%">
                  <mx:Canvas id="canvas1" left="10" right="10" top="110" bottom="10">
                      <mx:DataGrid width="100%" height="100%" click="currentState='anotherState'">
                          <mx:columns>
                              <mx:DataGridColumn headerText="Column-1" dataField=""/>
                              <mx:DataGridColumn headerText="Column-2" dataField=""/>
                              <mx:DataGridColumn headerText="Column-3" dataField=""/>
                              <mx:DataGridColumn headerText="Column-4" dataField=""/>
                          </mx:columns>
                      </mx:DataGrid>
                  </mx:Canvas>
              </mx:Canvas>
          </mx:TabNavigator>
      </mx:Application>