0 Replies Latest reply on Dec 15, 2011 12:24 AM by Medykus21

    How to make spark datagrid columns to behave like mx datagrid columns

    Medykus21

      Hello.

      I have a problem with spark datagrid component. I can't force spark datagrid columns behave like old mx datagrid columns. In mx datagrid columns fills 100% of datagrid regardles of resizing column or datagrid itself (it will not show horizontal scrolling bar). In spark datagrid last column (colC) will never word wrap, event after setting horizontalScrollPolicy=off. I would like to somehow constrain spark columns to behave like mx ones.

       

      App snippet (try to resize app and columns - especially colC - and you will see what I mean):

       

      <?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">

       

       

          <fx:Declarations>

              <s:ArrayCollection id="dp">

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

                  <s:DataItem colA="some sample data" colB="some sample data" colC="some sample data"/>

              </s:ArrayCollection>

          </fx:Declarations>

       

       

          <s:layout>

              <s:HorizontalLayout/>

          </s:layout>

       

       

          <s:DataGrid id="grid" width="100%" height="100%" dataProvider="{dp}" variableRowHeight="true" horizontalScrollPolicy="off">

              <s:columns>

                  <s:ArrayList>

                      <s:GridColumn headerText="Column A" dataField="colA"/>

                      <s:GridColumn headerText="Column B" dataField="colB"/>

                      <s:GridColumn headerText="Column C" dataField="colC"/>

                  </s:ArrayList>

              </s:columns>

          </s:DataGrid>

       

          <mx:DataGrid id="grid2" width="100%" height="100%" dataProvider="{dp}" wordWrap="true" variableRowHeight="true">

              <mx:columns>

                  <mx:DataGridColumn headerText="Column A" dataField="colA"/>

                  <mx:DataGridColumn headerText="Column B" dataField="colB"/>

                  <mx:DataGridColumn headerText="Column C" dataField="colC"/>

              </mx:columns>

          </mx:DataGrid>

       

      </s:Application>