Question

我在blog.flexexamples.com使用此示例。

我有一个数据网格，并尝试动态添加按钮到datagrid列之一。但我希望这个Button作为ItemRenderer用ActionScript而不是MXML编写。

我该怎么做？

由于

Answer 1

我认为这就是你所需要的。

ActionButtonItemRenderer.as ：

package
{
    import flash.events.MouseEvent;

    import mx.controls.Alert;
    import mx.controls.Button;
    import mx.controls.listClasses.IDropInListItemRenderer;
    import mx.controls.listClasses.IListItemRenderer;
    import mx.core.IFlexDisplayObject;

    public class ActionButtonItemRenderer extends Button implements IFlexDisplayObject, IListItemRenderer, IDropInListItemRenderer
    {
        public var btn:Button;
        public function ActionButtonItemRenderer()
        {
            super();
            btn = new Button();
            btn.label = "Take Action";
            btn.addEventListener(MouseEvent.CLICK,clickHandler);
            btn.visible = btn.includeInLayout = true;

        }

        override protected function clickHandler(event:MouseEvent):void
        {
            super.clickHandler(event);
            Alert.show("Button clicked");

        }
    }
}

DynamicDataGridButton.mxml：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600">
    <mx:ApplicationControlBar dock="true">
        <mx:Button label="Add column" click="init();" />
    </mx:ApplicationControlBar>
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            [Bindable]
            private var arr:ArrayCollection = new ArrayCollection
                (
                    [
                        {fname:'A',lname:'B'},
                        {fname:'C',lname:'B'},
                        {fname:'D',lname:'B'}
                    ]           
                );

            private function addDataGridColumn(dataField:String):void {
                var dgc:DataGridColumn = new DataGridColumn(dataField);
                dgc.itemRenderer = new ClassFactory(ActionButtonItemRenderer);
                var cols:Array = dg.columns;
                cols.push(dgc);
                dg.columns = cols;
            }

            private function init():void {
                addDataGridColumn("Details");
            }
        ]]>
    </mx:Script>
    <mx:DataGrid id="dg" dataProvider="{arr}">
        <mx:columns>
            <mx:DataGridColumn id="dgc1" dataField="fname" headerText="First Name" 
                               width="75"/>
            <mx:DataGridColumn id="dgc2" dataField="lname" headerText=" Last Name" 
                               width="150"/>

        </mx:columns>
    </mx:DataGrid>

</mx:Application>

Answer 2

要以AS3语法动态创建按钮，您可以这样做：

var button:Button = new Button();

然后在创建按钮后，您可以设置它的属性，如下所示：

button.label = "Click Me!";

最后，您会将其添加到您的某个商品中：

var dp:Array = [{label: "Button 1", button: button},{label: "Button 2", button: button}];
myDg.dataProvider = dp;

然后你会把它提供给你的数据网格，如下所示：

<mx:DataGrid id="myDG" variableRowHeight="true">
  <mx:columns>
    <mx:DataGridColumn dataField="label" headerText="Labels"/>
    <mx:DataGridColumn dataField="button" headerText="Buttons"/>
  </mx:columns>
</mx:DataGrid>

不确定这是否真的有用，您可能需要在整个列上设置一个按钮itemRenderer，如this example。

DataGrid中的ActionScript项呈示器

2 个答案: