Can someone confirm if this is a bug (I'm assuming one bug, but let me know if you think it's two)?
If so, I'll enter into JIRA... Problem observed: 4.10.0 spark datagrid horizontal scrollbar behavior changes based on the applications state history. This problem is not observed in SDK 4.5.1 (I'm not sure when it was introduced). EXAMPLE 1 (use example 1 code below): 1. Click button to change to state 2. 2. Once in state 2, click button again to return to state 1. 3. Observe horizontal scroll bar does not permit to view all of datagrid. EXAMPLE 2 (use example 2 code below): 1. Click and drag horizontal scroll bar to right and notice it goes to end of column 4. 2. Click button to change to state 2. 3. Once in state 2, click button again to return to state 1. 4. Click and drag horizontal scroll bar to right and notice it goes BEYOND end of column 4. ----------EXAMPLE 1 CODE---------- <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="600" maxWidth="600" height="300"> <fx:Declarations> <fx:String id="sampleText">Lorem Ipsum is the standard dummy text of the typesetting industry.</fx:String> <s:ArrayCollection id="ac"> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> </s:ArrayCollection> </fx:Declarations> <fx:Script> <![CDATA[ private function stateHandler():void { currentState=(currentState=="state2")?"state1":"state2"; } ]]> </fx:Script> <s:states> <s:State name="state1"/> <s:State name="state2"/> </s:states> <s:VGroup horizontalAlign="left" paddingLeft="30" paddingTop="30" includeIn="state1"> <s:Label text="STATE 1" color="0xFF0000"/> <s:Label text="1. Click button to change to state 2."/> <s:Label text="2. Once in state 2, click button again to return to state 1."/> <s:Label text="3. Observe horizontal scroll bar does not permit to view all of datagrid."/> <s:DataGrid id="dg1" width="500" dataProvider="{ac}"> <s:columns> <s:ArrayList> <s:GridColumn dataField="value" headerText="Column 1" width="200"/> <s:GridColumn dataField="value" headerText="Column 2" width="200"/> <s:GridColumn dataField="value" headerText="Column 3" width="200"/> </s:ArrayList> </s:columns> </s:DataGrid> <s:Button label="Change State" click="stateHandler()"/> </s:VGroup> <s:VGroup horizontalAlign="left" paddingLeft="30" paddingTop="30" includeIn="state2"> <s:Label text="STATE 2" color="0xFF0000"/> <s:Label text="1. Click button to change to state 2."/> <s:Label text="2. Once in state 2, click button again to return to state 1."/> <s:Label text="3. Observe horizontal scroll bar does not permit to view all of datagrid."/> <s:DataGrid id="dg2" width="500" dataProvider="{ac}"> <s:columns> <s:ArrayList> <s:GridColumn dataField="value" headerText="Column 1" width="200"/> <s:GridColumn dataField="value" headerText="Column 2" width="200"/> <s:GridColumn dataField="value" headerText="Column 3" width="200"/> </s:ArrayList> </s:columns> </s:DataGrid> <s:Button label="Change State" click="stateHandler()"/> </s:VGroup> </s:Application> ----------- EXAMPLE 2 CODE --------------- <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="600" maxWidth="600" height="450"> <fx:Declarations> <fx:String id="sampleText">Lorem Ipsum is the standard dummy text of the typesetting industry.</fx:String> <s:ArrayCollection id="ac"> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> <s:DataItem value="{sampleText}"/> </s:ArrayCollection> </fx:Declarations> <fx:Script> <![CDATA[ private function stateHandler():void { currentState=(currentState=="state2")?"state1":"state2"; } ]]> </fx:Script> <s:states> <s:State name="state1"/> <s:State name="state2"/> </s:states> <s:VGroup paddingLeft="30" paddingTop="30"> <s:Label text="1. Click and drag horizontal scroll bar to right and notice it goes to end of column 4."/> <s:Label text="2. Click button to change to state 2."/> <s:Label text="3. Once in state 2, click button again to return to state 1."/> <s:Label text="4. Click and drag horizontal scroll bar to right and notice it goes BEYOND end of column 4"/> <s:VGroup horizontalAlign="left" includeIn="state1"> <s:Label text="STATE 1" color="0xFF0000"/> <s:DataGrid id="dg1" width="500" dataProvider="{ac}" alternatingRowColors="[0xFFFFFF,0xBBBBBB]"> <s:columns> <s:ArrayList> <s:GridColumn headerText="Col 1" dataField="value" width="75"/> <s:GridColumn headerText="Col 2" dataField="value" width="75"/> <s:GridColumn headerText="Col 3" dataField="value" width="200"/> <s:GridColumn headerText="Col 4" dataField="value" width="200"/> </s:ArrayList> </s:columns> </s:DataGrid> <s:Button label="Change State" click="stateHandler()"/> </s:VGroup> <s:VGroup horizontalAlign="left" includeIn="state2"> <s:Label text="STATE 2" color="0xFF0000"/> <s:DataGrid id="dg2" width="500" dataProvider="{ac}" alternatingRowColors="[0xFFFFFF,0xBBBBBB]"> <s:columns> <s:ArrayList> <s:GridColumn headerText="Col 1" dataField="value" width="75"/> <s:GridColumn headerText="Col 2" dataField="value" width="75"/> <s:GridColumn headerText="Col 3" dataField="value" width="200"/> <s:GridColumn headerText="Col 4" dataField="value" width="200"/> </s:ArrayList> </s:columns> </s:DataGrid> <s:Button label="Change State" click="stateHandler()"/> </s:VGroup> </s:VGroup> </s:Application>
