在DataGrid中添加總列

Question

我在Flex中有一個Datagrid。在datagrid中有4列，如mark1，mark2，mark3，Total。 當我輸入mark1，mark2，mark3時，我想更新總數。

Answer 1

假設我理解你的要求正確地，這應該是很容易的事情。

如果您爲DataGrid中的每一行使用自定義對象，則可以創建一個只添加其他字段並返回總和的屬性。

示例類：

package 
{ 
    [Bindable] 
    public class MyCustomClass 
    { 
    private mark1:int = 0; 
    private mark2:int = 0; 
    private mark3:int = 0; 

    public function get Mark1():int { return mark1; } 
    public function set Mark1(value:int):void { mark1 = value; } 

    public function get Mark2():int { return mark2; } 
    public function set Mark2(value:int):void { mark2 = value; } 

    public function get Mark3():int { return mark3; } 
    public function set Mark3(value:int):void { mark3 = value; } 

    public function get Total():int { return mark1 + mark2 + mark3; } 
    } 
} 

Answer 2

你有兩種方法可以做到這一點。第一種方法是在你的數據對象的下列方式計算總：

package 
{ 
public class GridData 
{ 
    [Bindable] 
    public var mark1:int; 
    [Bindable] 
    public var mark2:int; 
    [Bindable] 
    public var mark3:int; 

    public function get total():int 
    { 
     return mark1 + mark2 + mark3; 
    } 

} 
} 

，我們的應用是：

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application layout="absolute" xmlns:local="*" xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:ArrayCollection id="dataList"> 
     <mx:source> 
      <mx:Array> 
       <local:GridData mark1="5" mark2="7" mark3="14" /> 
       <local:GridData mark1="4" mark2="2" mark3="4" /> 
       <local:GridData mark1="15" mark2="72" mark3="1" /> 
       <local:GridData mark1="25" mark2="37" mark3="15" /> 
       <local:GridData mark1="55" mark2="1" mark3="6" /> 
       <local:GridData mark1="43" mark2="7" mark3="12" /> 
       <local:GridData mark1="11" mark2="11" mark3="22" /> 
      </mx:Array> 
     </mx:source> 
    </mx:ArrayCollection> 
    <mx:VBox horizontalCenter="0" verticalCenter="0"> 
     <mx:DataGrid dataProvider="{dataList}" id="dg"> 
      <mx:columns> 
       <mx:DataGridColumn dataField="mark1" headerText="mark1" /> 
       <mx:DataGridColumn dataField="mark2" headerText="mark2" /> 
       <mx:DataGridColumn dataField="mark3" headerText="mark3" /> 
       <mx:DataGridColumn dataField="total" headerText="total" /> 
      </mx:columns> 
     </mx:DataGrid> 
     <mx:Form enabled="{dg.selectedItem}"> 
      <mx:FormItem label="mark1"> 
       <mx:NumericStepper change="dg.selectedItem.mark1 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark1}" /> 
      </mx:FormItem> 
      <mx:FormItem label="mark2"> 
       <mx:NumericStepper change="dg.selectedItem.mark2 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark2}" /> 
      </mx:FormItem> 
      <mx:FormItem label="mark3"> 
       <mx:NumericStepper change="dg.selectedItem.mark3 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark3}" /> 
      </mx:FormItem> 
     </mx:Form> 
    </mx:VBox> 
</mx:Application> 

第二種方法是使用標籤功能。因此，我們的數據對象：

package 
{ 
public class GridData 
{ 
    [Bindable] 
    public var mark1:int; 
    [Bindable] 
    public var mark2:int; 
    [Bindable] 
    public var mark3:int; 
} 
} 

，我們的應用：

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application layout="absolute" xmlns:local="*" xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Script> 
    <![CDATA[ 
     private function calculateTotal(data:GridData, column:DataGridColumn):String 
     { 
      return (data.mark1 + data.mark2 + data.mark3).toString(); 
     } 
    ]]> 
    </mx:Script> 
    <mx:ArrayCollection id="dataList"> 
     <mx:source> 
      <mx:Array> 
       <local:GridData mark1="5" mark2="7" mark3="14" /> 
       <local:GridData mark1="4" mark2="2" mark3="4" /> 
       <local:GridData mark1="15" mark2="72" mark3="1" /> 
       <local:GridData mark1="25" mark2="37" mark3="15" /> 
       <local:GridData mark1="55" mark2="1" mark3="6" /> 
       <local:GridData mark1="43" mark2="7" mark3="12" /> 
       <local:GridData mark1="11" mark2="11" mark3="22" /> 
      </mx:Array> 
     </mx:source> 
    </mx:ArrayCollection> 
    <mx:VBox horizontalCenter="0" verticalCenter="0"> 
     <mx:DataGrid dataProvider="{dataList}" id="dg"> 
      <mx:columns> 
       <mx:DataGridColumn dataField="mark1" headerText="mark1" /> 
       <mx:DataGridColumn dataField="mark2" headerText="mark2" /> 
       <mx:DataGridColumn dataField="mark3" headerText="mark3" /> 
       <mx:DataGridColumn labelFunction="calculateTotal" headerText="total" /> 
      </mx:columns> 
     </mx:DataGrid> 
     <mx:Form enabled="{dg.selectedItem}"> 
      <mx:FormItem label="mark1"> 
       <mx:NumericStepper change="dg.selectedItem.mark1 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark1}" /> 
      </mx:FormItem> 
      <mx:FormItem label="mark2"> 
       <mx:NumericStepper change="dg.selectedItem.mark2 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark2}" /> 
      </mx:FormItem> 
      <mx:FormItem label="mark3"> 
       <mx:NumericStepper change="dg.selectedItem.mark3 = event.currentTarget.value" maximum="10000" 
        minimum="0" value="{dg.selectedItem.mark3}" /> 
      </mx:FormItem> 
     </mx:Form> 
    </mx:VBox> 
</mx:Application>