Question

我正在尝试创建一个自定义的Flex DataGrid，它由两列组成，一列用于标签，另一列用于复选框。该复选框包含在一个名为CustomRenderer的类中，该类继承自GridItemRenderer并实现IFactory。

在CustomRenderer的每个实例中，我都有一个名为number的变量，这样当单击一个复选框时，它可以传回该数字，以便我知道哪一行已被点击。

问题是我的CustomRenderer在程序运行时没有显示。

请有人帮忙。

这是我的代码。

MyProgram.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"
               initialize="initData()">

    <fx:Script> 
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;
            import mx.controls.CheckBox;
            import mx.rpc.events.AbstractEvent;

            private var ArrayItems:Array = [
                {Label:'Table'},
                {Label:'Chair'},
                {Label:'Stool'},
                {Label:'Bench'},
                {Label:'Sofa'}];

            [Bindable]
            private var ArrayCollectionItems:ArrayCollection;

            private var t:CustomRenderer;

            public function initData():void
            {
                ArrayCollectionItems=new ArrayCollection(ArrayItems);

                t = new CustomRenderer();
                t.cb.addEventListener(MouseEvent.CLICK, HandleClick);
                MainGrid.columns[1].itemRenderer = t.newInstance();     
            }

            public function HandleClick(event:Event):void
            {
                var c:CustomRenderer = (event.currentTarget) as CustomRenderer
                var RowClicked:int = c.number;
            }       

        ]]>
    </fx:Script>
    <s:states>
        <s:State name="State1"/>
    </s:states>

    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:Panel x="99" y="14" width="379" height="268" skinClass="spark.skins.spark.PanelSkin">
        <s:DataGrid id="MainGrid" x="19" y="17" width="340" height="199"
                    dataProvider="{ArrayCollectionItems}" requestedRowCount="4" requireSelection="false"
                    resizableColumns="false" selectionMode="singleRow" showDataTips="false">
            <s:columns>
                <s:ArrayList>
                    <s:GridColumn minWidth="200" dataField="Label" headerText="Label"></s:GridColumn>
                    <s:GridColumn minWidth="30" dataField="" headerText="">                 
                    </s:GridColumn>
                </s:ArrayList>
            </s:columns>
            <s:typicalItem>
                <fx:Object dataField1="Sample Data" dataField2="Sample Data" dataField3="Sample Data"></fx:Object>
            </s:typicalItem>
        </s:DataGrid>
    </s:Panel>
</s:Application>

CustomRenderer.as

import mx.controls.Alert;
import mx.controls.CheckBox;
import mx.core.IFactory;

import spark.components.gridClasses.GridItemRenderer;

public class CustomRenderer extends GridItemRenderer implements IFactory
{   
    private static var count:int = 0;
    public var number:int;
    public var cb:CheckBox;

    public function CustomRenderer()
    {       
        cb = new CheckBox();
        number = count++;
        cb.x = 22;
        cb.y = 4;           
        addElement(cb);
    }

    public function newInstance():*
    {
        return new CustomRenderer();
    }
}

Answer 1

可能这是因为您将itemrenderer的实例传递给列（new CustomRenderer（））而不是类（CustomRenderer）。常见的方法是将itemrenderer类传递给您的列，然后处理其中的点击/选择：

<s:GridColumn minWidth="30" headerText="" itemRenderer="com.yourpackage.CustomRenderer">

分配时只需开始键入“Customrenderer”，您就应该能够自动完成，以便写出完整的包路径。

然后，您将捕获渲染器内的复选框选择事件，并可以设置一些自定义数据属性（例如，data.selected）。如果您在选择后确实需要在Grid之外执行某些操作，则可能需要在选择时从渲染器触发自定义事件并在数据网格上进行侦听。

在Flex DataGrid

1 个答案: