Skip to main content
October 11, 2012
Question

background color disappears when scrolling horizontally in advance datagrid in flex

  • October 11, 2012
  • 1 reply
  • 1377 views

Hi,

I am tring to set color in 3 columns in advance data grid using "setStyle" function and i am able to do it successfully. But as soon as i scroll horizontally background color disaapears.

In the image "beforeScroll.PNG" the 3 columns header1, header2 and header3 are having background color grey which is good. But when i scroll the datagrid horizontall(see "after-1st-Hscroll.PNG") color from header2 disappears and on the 2nd scroll(see "after-2st-Hscroll.PNG") color from header 3 also disappears.

I am using sdk 4.6.0

beforeScroll

after-1st-Hscroll

after-2st-Hscroll

Please find my code below:

<?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" minWidth="955" minHeight="600"
                  
creationComplete="onComplete()">
       
<fx:Declarations>
           
<!-- Place non-visual elements (e.g., services, value objects) here -->
       
</fx:Declarations>
       
<fx:Script>
            <![CDATA[
                import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
                private function onComplete():void{
                    var colsArr:Array=new Array();
                    var column1:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column1.headerText="Header1";
                    column1.setStyle("backgroundColor","0xcccccc");
                    colsArr.push(column1);
                    var column2:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column2.headerText="Header2";
                    column2.setStyle("backgroundColor","0xcccccc");
                    colsArr.push(column2);
                    var column3:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column3.headerText="Header3";
                    column3.setStyle("backgroundColor","0xcccccc");
                    colsArr.push(column3);
                    var column4:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column4.headerText="Header4";
                    colsArr.push(column4);
                    var column5:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column5.headerText="Header5";
                    colsArr.push(column5);
                    sampleDG.columns=colsArr;
                    var column6:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column6.headerText="Header6";
                    colsArr.push(column6);
                    sampleDG.columns=colsArr;
                    var column7:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column7.headerText="Header7";
                    colsArr.push(column7);
                    sampleDG.columns=colsArr;
                    var column8:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column8.headerText="Header8";
                    colsArr.push(column8);
                    sampleDG.columns=colsArr;
                    var column9:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column9.headerText="Header9";
                    colsArr.push(column9);
                    sampleDG.columns=colsArr;
                    var column10:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column10.headerText="Header10";
                    colsArr.push(column10);
                    sampleDG.columns=colsArr;
                    var column11:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column11.headerText="Header11";
                    colsArr.push(column11);
                    sampleDG.columns=colsArr;
                    var column12:AdvancedDataGridColumn=new AdvancedDataGridColumn();
                    column12.headerText="Header12";
                    colsArr.push(column12);
                    sampleDG.columns=colsArr;
                }
            ]]>
       
</fx:Script>
       
<mx:Box horizontalAlign="center" width="100%">


       
<mx:AdvancedDataGrid id="sampleDG" rowCount="3" width="70%" horizontalScrollPolicy="on" height="300"/>
       
</mx:Box>
   
</s:Application>
 

This topic has been closed for replies.

1 reply

October 12, 2012

Anybody any luck. Are you guys able to replicate the issue?