flex，AdvancedDataGrid，自定义项目渲染器

当涉及到flex itemrenderer时，我似乎错过了一些关键概念，特别是当它适用于AdvancedDataGrid时。我正在做很多其他人试图做的事情：根据行中的数据更改字段的bg颜色。我的问题似乎是在访问数据字段？基本上，当这个加载时，没有任何东西出现。如果我从渲染器中删除了我试图访问字段数据的部分，它可以正常工作，但这种做法会影响目的。flex，AdvancedDataGrid，自定义项目渲染器

下面是我得到了什么：

<mx:AdvancedDataGrid width="100%" height="100%" 
    id="topAccountsGrid" 
    borderStyle="solid" dropShadowEnabled="true" treeColumn="{list_name}" editable="false" selectionMode="singleRow" 
    dragEnabled="true" dropEnabled="true" dragMoveEnabled="true" dragDrop="topAccountsGrid_dragDropHandler(event)" 
    doubleClickEnabled="true" itemDoubleClick="topAccountsGrid_itemDoubleClickHandler(event)" 
    sort="topAccountsGrid_sortHandler(event)" backgroundColor="#ffffff"> 
    <mx:dataProvider> 
     <mx:HierarchicalData source="{filteredList}" 
      childrenField="children" /> 
    </mx:dataProvider> 
    <mx:columns> 
     <mx:AdvancedDataGridColumn id="colRank" headerText="Rank" dataField="Rank__c" width="60"> 
      <mx:itemRenderer> 
       <fx:Component> 
        <mx:HBox paddingLeft="2"> 
         <s:Label id="tempLabel" text="{data.Rank__c}" /> 
         <fx:Script> 
          <![CDATA[ 
           override public function set data(value:Object) : void{ 
            super.data = value; 
            if(data.Health__c == 0){ 
             setStyle("backgroundColor",0xFF5050); 
             } else if(data.Health__c == 50){ 
              setStyle("backgroundColor",0xFFFF99); 
             } else if(data.Health__c == 100){ 
              setStyle("backgroundColor",0x66FF66); 
            } 
           } 
          ]]> 
         </fx:Script> 
        </mx:HBox> 
       </fx:Component> 
      </mx:itemRenderer> 
     </mx:AdvancedDataGridColumn> 
     <mx:AdvancedDataGridColumn id="list_name" headerText="Name" dataField="Name" /> 
     <mx:AdvancedDataGridColumn id="colPrevRank" headerText="Previous Rank" dataField="Previous_Rank__c" /> 
     <mx:AdvancedDataGridColumn id="colType" headerText="Type" dataField="Type" /> 
     <mx:AdvancedDataGridColumn id="colContacts" headerText="# Contacts" dataField="Contacts__c" /> 
     <mx:AdvancedDataGridColumn id="colDeals" headerText="# Deals" dataField="Deals__c" /> 
    </mx:columns> 
</mx:AdvancedDataGrid>

来源

2011-01-07 Dave S

显示你的数据提供程序，最好提供一个可运行的代码示例。 – JeffryHouser 2011-01-07 13:09:13

据我可以看到这应该工作。我同意Flextras。请提供一个可运行的示例。我想你的dataProvider存在问题。尝试调试你的`set data`函数并查看这个值。 – 2011-01-07 15:56:51

使用HierarchicalData时，我也有过类似的问题，在过去。我得到的方式是使用AdvancedDataGridRendererProvider。

下面是一些示例代码：

<mx:AdvancedDataGrid width="100%" height="100%" 
    id="topAccountsGrid" 
    backgroundColor="#ffffff"> 
    <mx:dataProvider> 
     <mx:HierarchicalData source="{filteredList}" 
      childrenField="children" /> 
    </mx:dataProvider> 
    <mx:columns> 
     <mx:AdvancedDataGridColumn id="colRank" headerText="Rank" dataField="Rank__c" width="60" /> 
     <mx:AdvancedDataGridColumn id="list_name" headerText="Name" dataField="Name" /> 
     <mx:AdvancedDataGridColumn id="colPrevRank" headerText="Previous Rank" dataField="Previous_Rank__c" /> 
     <mx:AdvancedDataGridColumn id="colType" headerText="Type" dataField="Type" /> 
     <mx:AdvancedDataGridColumn id="colContacts" headerText="# Contacts" dataField="Contacts__c" /> 
     <mx:AdvancedDataGridColumn id="colDeals" headerText="# Deals" dataField="Deals__c" /> 
    </mx:columns> 
    <mx:rendererProviders> 
     <mx:AdvancedDataGridRendererProvider column="{colRank}" depth="1" dataField="Rank__c" renderer="AdvancedDataGridRankCRenderer" /> 
    </mx:rendererProviders> 
</mx:AdvancedDataGrid>

而且AdvancedDataGridRendererProvider：

<?xml version="1.0" encoding="utf-8"?> 
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" 
      backgroundColor="{SetBackgroundColor(data)}" 
      paddingLeft="2" paddingRight="2" paddingTop="2" 
      horizontalScrollPolicy="off" 
      verticalScrollPolicy="off" 
      height="22"> 
    <fx:Script> 
     <![CDATA[ 
      [Bindable] private var bgColor:uint = 0xD6E5FF; 

      private function SetBackgroundColor(obj:Object):uint 
      { 
       var returnColor:uint = 0xFF5050; 

       if (obj["Rank__c"] != null) 
       { 
        switch (obj["Rank__c"].toString().toUpperCase()) 
        { 
         case "0": 
          returnColor = 0xFF5050; 
          break; 
         case "50": 
          returnColor = 0xFFFF99; 
          break; 
         case "100": 
          returnColor = 0x66FF66; 
          break; 
         default: 
          returnColor = 0xFF5050; 
                break; 
        } 
       } 

       return returnColor; 
      } 

      override public function set data(value:Object):void 
      { 
       super.data = value; 
       rankLabel.text = value["Rank__c"].toString();    
       validateDisplayList(); 
      } 
     ]]> 
    </fx:Script> 
    <mx:Label id="rankLabel" /> 
</mx:HBox>

来源

2011-01-07 17:42:11

flex，AdvancedDataGrid，自定义项目渲染器

回答

相关问题