2013-02-20 27 views
5

Witam Jestem bardzo nowy w Adobe Flex, przepraszam, jeśli moje pytanie brzmi głupio. Tak czy inaczej tutaj jest. Próbuję prosty datagrid, który sprawdza zasadniczo 2 warunki 1) Jeśli wykonawcą jest 01, a albumem jest "Album 01" ustaw Tło dla odpowiedniej komórki w kolumnie "Rok".Zmień kolor tła komórki datagrid na podstawie więcej niż jednego warunku w Flex

Z poniższym kodem "ustaw styl" na kolor tła, ponieważ właściwość nie działa, ale zmiana koloru czcionki działa, a po drugie nie mam pewności, jak napisać kod, aby powyższe warunki zagnieżdżone działały? Jeśli ktokolwiek mógłby mi pomóc w tym aspekcie, byłbym naprawdę wdzięczny. Dziękujemy! z góry.

Poniżej znajduje się kod: Newdatagrid.mxml

<?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" > 
<fx:Script> 
    <![CDATA[ 
     import mx.collections.ArrayCollection; 
     import mx.controls.Alert; 
     [Bindable] 
     public static var initDG:ArrayCollection = new ArrayCollection([ 
      {Artist:'01', Album:'Album 01', Year:'2008'}, 
      {Artist:'01', Album:'Album 02', Year:'2009'}, 
      {Artist:'03', Album:'Album 03', Year:'2007'}, 
      {Artist:'03', Album:'Album 04', Year:'2003'}, 

     ]); 

    ]]> 

</fx:Script> 


<s:VGroup> 
    <s:DataGrid id="myGrid" width="360" dataProvider="{initDG}"> 
     <s:columns> 
      <s:ArrayList> 
       <s:GridColumn dataField="Artist" headerText="Artist" itemRenderer="CellRenderer"/> 
       <s:GridColumn dataField="Album" headerText="Album" itemRenderer="CellRenderer"/> 
       <s:GridColumn dataField="Year" headerText="Year" itemRenderer="CellRenderer"/> 
      </s:ArrayList> 
     </s:columns>  
    </s:DataGrid> 
</s:VGroup> 
</s:Application> 

Renderer:

<?xml version="1.0" encoding="utf-8"?> 
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" 
        implements="mx.controls.listClasses.IDropInListItemRenderer"> 
<fx:Script> 
    <![CDATA[ 
     import mx.controls.dataGridClasses.DataGridListData; 
     import mx.controls.listClasses.BaseListData; 
     import mx.controls.Alert; 

     private var _listData:BaseListData; 

     [Bindable]private var isSelected:Boolean = false; 

     override public function set data(value:Object) : void 
     { 
      super.data = value; 
      lblData.text = data[column.dataField]; 

      if (data[column.dataField].valueOf() >= 2008){ 
       //styleName="myStyles.BgColor"; 
       setStyle('backgroundColor',0xFFFF00); 
      }else{ 
       setStyle('backgroundColor',0x32CD32); 
      } 

     } 

     [Bindable]public function get listData() : BaseListData 
     { 
      return _listData; 
     } 
     public function set listData(value:BaseListData) : void 
     { 
      _listData = value; 
     } 

    ]]> 
</fx:Script> 
<s:Label id="lblData" top="9" left="7" width="100%" height="100%" textAlign="center"/> 

</s:GridItemRenderer> 

Moja Pożądany Wyjście: Stan: Jeżeli Wykonawca = 01 i rok> = 2.008 następnie komórka Tło zmiany Roku na czerwono

+0

http://stackoverflow.com/questions/748213/setting-background-color-for-datagrid-row-in-adobe-flex odnoszą ten link. – Triode

+0

Dzięki Rajesh, jednak nie mogę uzyskać całego kodu, a link kodu źródłowego mówi, że strona wygasła. –

Odpowiedz

7

Klasa GridItemRenderer nie ma takiego stylu backgroundColor. Nie ma to żadnego wpływu na ustawienie.

To, co możesz zrobić, to dodać Rect do ItemRenderer i ustawić jego właściwość koloru w zależności od twojego stanu.

przykładem byłoby coś jak:

<?xml version="1.0" encoding="utf-8"?> 
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true"> 

    <fx:Script> 
     <![CDATA[ 
      override public function prepare(hasBeenRecycled:Boolean):void { 


       if(this.data) { 

        if(this.data.Year >= 2008 && this.data.Artist == '01' && column.dataField == 'Year') 
         bgColor.color = 0xFF0000; 
        else 
         bgColor.color = 0xFFFFFF; 
       } 
      } 
     ]]> 
    </fx:Script> 

    <s:Rect top="0" bottom="0" left="0" right="0"> 
     <s:fill> 
      <s:SolidColor id="bgColor" color="0xFFFFFF"/> 
     </s:fill> 
    </s:Rect> 
    <s:Label id="labelDisplay" top="9" left="7"/> 

</s:GridItemRenderer> 
+0

Dzięki michPooh za szybką odpowiedź. Twój kod podświetla cały wiersz, a zamiast tego wymagałbym, aby podświetlał tylko te komórki, które pasują do warunku w kolumnie "Rok". Moje pożądane wyjście: Warunek: Dla np. Jeśli Artysta = 01 i Rok> = 2008, odpowiadająca komórka Tło Zmiana roku na czerwony, w tym przykładzie będzie to tylko rok 2008. –

+0

po prostu zmień warunek na np. if (this.data.Year> = 2008 && this.data.Artist == '01' && column.dataField == 'Year') \t \t \t \t \t \t bgColor.color = 0xFF0000; \t \t \t \t \t inny \t \t \t \t \t \t bgColor.color = 0xFFFFFF; – michaPau

+0

Wow! Człowiek dziękuje bardzo! Cierpię z powodu tego problemu! Zrobiłeś mój dzień. Dzięki jeszcze raz! –

1
<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication 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" > 
    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.controls.Alert; 
      [Bindable] 
      public static var initDG:ArrayCollection = new ArrayCollection([ 
       {Artist:'01', Album:'Album 01', Year:'2008'}, 
       {Artist:'01', Album:'Album 02', Year:'2009'}, 
       {Artist:'03', Album:'Album 03', Year:'2007'}, 
       {Artist:'03', Album:'Album 04', Year:'2003'}, 

      ]); 

     ]]> 

    </fx:Script> 


    <s:VGroup> 
     <s:DataGrid id="myGrid" width="360" dataProvider="{initDG}"> 
      <s:columns> 
       <s:ArrayList> 
        <s:GridColumn dataField="Artist" headerText="Artist"/> 
        <s:GridColumn dataField="Album" headerText="Album"/> 
        <s:GridColumn dataField="Year" headerText="Year" itemRenderer="CellRenderer"/> 
       </s:ArrayList> 
      </s:columns>  
     </s:DataGrid> 
    </s:VGroup> 
</s:WindowedApplication> 

----------------------------CellRenderer.mxml------------------------ 

    <?xml version="1.0" encoding="utf-8"?> 
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true"> 

    <fx:Script> 
     <![CDATA[ 
      override public function prepare(hasBeenRecycled:Boolean):void { 
       lblData.text = data[column.dataField] 
       if(this.data) { 
        lblData.text = data[column.dataField]; 

        if(this.data.Year >= 2008&&this.data.Artist==01) 
         bgColor.color = 0xFF0000; 
        else 
         bgColor.color = 0xFFFFFF; 
       } 
      } 
     ]]> 
    </fx:Script> 

    <s:Rect top="0" bottom="0" left="0" right="0"> 
     <s:fill> 
      <s:SolidColor id="bgColor" color="0xFFFFFF"/> 
     </s:fill> 
    </s:Rect> 
    <s:Label id="lblData" top="9" left="7" width="100%" height="100%" textAlign="center"/> 

</s:GridItemRenderer> 
+0

Dziękujemy! te rozwiązania też były dobre! –

+0

Dziękujemy! Ponieważ użyłem komponentu iskrownika dla datagridu, użyłem funkcji override public function prepare (hasBeenRecycled: Boolean): void, która zatrzymała moje dane przed niepoprawnością podczas przewijania datagridu. –

+0

Element renderujący zastępuje funkcję Etykieta zdefiniowaną w kolumnie DataGlob, która wywołuje funkcję formatu waluty, więc teraz kolumna nie pokazuje formatu Waluta ani liczba. Czy możesz podać rozwiązanie tego problemu? Z góry dziękuję. –