Question

我在Flex中有一个Datagrid。在datagrid中有4列，如mark1，mark2，mark3，Total。当我输入mark1，mark2，mark3时，我想要更新总数。

Answer 1

你有两种方法可以做到这一点。第一种方法是以下列方式计算数据对象的总数：

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>

Answer 2

假设我理解你正确的要求，这应该很容易做到。

如果您正在为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; }
  }
}

在DataGrid中添加总列

2 个答案: