在Flex DataGrid中显示复选框列

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

在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(); 
    } 
}

来源

2016-11-13 user3468174

也许那是因为你传递的itemRenderer的实例来柱（新CustomRenderer（）），而不是一类（CustomRenderer）。常见的方法是将ItemRenderer类传递给你的专栏，然后处理点击它里面/选择：

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

只需输入“Customrenderer”当你将它和你应该能够自动完成，因此写出完整的包路径。

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

来源

2016-11-14 08:33:03 Philarmon

我已经修改了我的代码，以便现在可以使用自定义事件将选中的复选框的行和列发送回主类。 – user3468174

我需要添加另一列将显示一个按钮，并单击时将删除该按钮所在的行，所以我现在报废行和列编号。我想要做的是将复选框值绑定到ArrayCollection变量中的元素。但是，如何将一个类中的checkbox值绑定到另一个类中声明的arraycollection？ – user3468174

您需要在您的itemrenderer中覆盖set数据（），createChildren（）和commitProperties（）方法。将复选框的创建移动到createChildren（）方法 - 这是标准的Flex生命周期练习。设置data（）是对象传递给你的itemrenderer的地方。在这里你可以查看你的对象的属性值（例如“selected”）并将属性存储在本地变量中。然后在commitProperties（）中，根据“selected”值设置复选框的状态。 – Philarmon

在Flex DataGrid中显示复选框列

回答

相关问题