0

数時間前、カスタム コンポーネント (textInput および label コンポーネントを作成し、コンポーネント定義を作成) を作成する方法を尋ねましたが、あなたの答えで今それを行うことができます。

問題 2: そのコンポーネントを datagrid 列で使用して、ユーザーが textInput に値を入力できるようにしたいと考えています。これにより、基になるデータプロバイダーが更新されます。チェックボックス列で行ったようにセルレンダラーを使用する必要があることはわかっていますが（ネットの助けも借りて）、この段階では髪の毛を引っ張っているだけです。助けてください。

4

1 に答える 1

0

これは変更された例であるため、面倒に見えるかもしれません。

これを試してみたい fla のライブラリに、DataGrid、Label、および TextInput コンポーネントがあることを確認してください。

// Import the required component classes.
import fl.controls.DataGrid;
import fl.controls.dataGridClasses.DataGridColumn;
import fl.data.DataProvider;
//get some data ready, notice data and label
var dp:DataProvider = new DataProvider();
for(var i:int = 0 ; i < 7; i++)
    dp.addItem({data:'input '+(i+1),label:'label '+(i+1), title:"item " + (i+1)});
var dataCol:DataGridColumn = new DataGridColumn("data");
dataCol.cellRenderer = CustomCell;
var titleCol:DataGridColumn = new DataGridColumn("title");

var myDataGrid:DataGrid = new DataGrid();
myDataGrid.addColumn(dataCol);
myDataGrid.addColumn(titleCol);
myDataGrid.dataProvider = dp;
myDataGrid.rowHeight = 64;
myDataGrid.width = 500;
myDataGrid.rowCount = dp.length - 1;
myDataGrid.move(10, 10);
myDataGrid.editable = true;
addChild(myDataGrid);

CustomCell クラスは次のようになります。

package {
    // Import the required component classes.
    import fl.controls.listClasses.ICellRenderer;
    import fl.controls.listClasses.ListData;
    import fl.controls.Label;
    import fl.controls.TextInput;
    import fl.core.InvalidationType;
    import fl.core.UIComponent;
    import fl.data.DataProvider;
    import flash.display.Sprite;
    import flash.events.Event;

    public class CustomCell extends UIComponent implements ICellRenderer {
        protected var _data:Object;
        protected var _listData:ListData;
        protected var _selected:Boolean;
        //the custom components
        private var labelComponent:Label;
        private var inputComponent:TextInput;
        /**
         * Constructor.
         */
        public function CustomCell():void {
            super();
            init();
        }
        /**
         * Draws the Label and TextInput components
         */
        private function init():void{
            labelComponent = new Label();
            labelComponent.autoSize = 'right';
            inputComponent = new TextInput();
            inputComponent.editable = true;

            addChild(labelComponent);
            addChild(inputComponent);
            inputComponent.x = labelComponent.width + 5;//5 pixels distance between components
            inputComponent.drawFocus(true);
        }

        public function get data():Object {
            return _data;
        }
        /** 
         * @private (setter)
         */
        public function set data(value:Object):void {
            _data = value;
            //there's label data, update the label
            if(_data.label) labelComponent.text = _data.label;
            //there's data for the input, update that too
            if(_data.data) inputComponent.text = _data.data;
        }

        public function get listData():ListData {
            return _listData;
        }
        public function set listData(value:ListData):void {
            _listData = value;
            invalidate(InvalidationType.DATA);
            invalidate(InvalidationType.STATE);
        }
        public function get selected():Boolean {
            return _selected;
        }
        public function set selected(value:Boolean):void {
            _selected = value;
            invalidate(InvalidationType.STATE);
        }
        public function setMouseState(state:String):void {
        }

    }
}

コードの大部分は、この devnet の記事からのものです。

編集可能であるため、問題なく動作します。

解決策は、コンポーネント クラス (fl.core.UIComponent を拡張するクラス) であり、レンダラーとして設定できるように ICellRender インターフェイスを実装し、Label および TextInput コンポーネントを含みます。また、データは TextInput.text にマップされるため、簡単に編集できます。

DataGrid が少し肥大化していて、コンポーネント定義またはより単純なものを使用したい場合。List を使用してソリューションをハックし、styles を使用してカスタム cellRenderer を設定できると思います。カスタム クリップは、トゥイーンライトページのプラグイン リストでセル レンダラーとして使用されていると思います。

HTH、ジョージ

于 2010-01-09T03:11:14.650 に答える