4 Replies Latest reply on Dec 26, 2016 9:23 PM by kglad

    How to use standart components (DataGrid) in Canvas?

    александрб62780587 Level 1

      Unfortunately, I didn't find any example for Canvas.

       

      How to convert this example from DataGrid - Adobe ActionScript® 3 (AS3 Flash) API Reference

       

      import fl.controls.*;

      import fl.containers.*;

      import fl.controls.listClasses.*;

      import fl.controls.dataGridClasses.*;

      import fl.controls.progressBarClasses.*;

      import fl.core.UIComponent;

      import fl.data.DataProvider;

       

      var dp:DataProvider = new DataProvider();

      dp.addItem( { label: "BaseScrollPane", data:BaseScrollPane } );

      dp.addItem( { label: "Button", data:Button } );

      dp.addItem( { label: "CellRenderer", data:CellRenderer } );

      dp.addItem( { label: "CheckBox", data:CheckBox } );

      dp.addItem( { label: "ColorPicker", data:ColorPicker } );

      dp.addItem( { label: "ComboBox", data:ComboBox } );

      dp.addItem( { label: "DataGrid", data:DataGrid } );

      dp.addItem( { label: "HeaderRenderer", data:HeaderRenderer } );

      dp.addItem( { label: "ImageCell", data:ImageCell } );

      dp.addItem( { label: "IndeterminateBar",data:IndeterminateBar } );

      dp.addItem( { label: "Label", data:Label } );

      dp.addItem( { label: "List", data:List } );

      dp.addItem( { label: "NumericStepper", data:NumericStepper } );

      dp.addItem( { label: "ProgressBar", data:ProgressBar } );

      dp.addItem( { label: "RadioButton", data:RadioButton } );

      dp.addItem( { label: "ScrollPane", data:ScrollPane } );

      dp.addItem( { label: "Slider", data:Slider } );

      dp.addItem( { label: "TextArea", data:TextArea } );

      dp.addItem( { label: "TextInput", data:TextInput } );

      dp.addItem( { label: "TileList", data:TileList } );

      dp.addItem( { label: "UILoader", data:UILoader } );

      dp.addItem( { label: "UIComponent", data:UIComponent } );

       

      var cb:ComboBox = new ComboBox();

      cb.move(10,10);

      cb.setSize(300,25);

      cb.prompt = "Select a component to view its styles";

      cb.rowCount = 12;

      cb.dataProvider = dp;

      cb.addEventListener(Event.CHANGE, showStyleDefinition);

      addChild(cb);

       

      var dg:DataGrid = new DataGrid();

      dg.setSize(425,300);

      dg.move(10,50);

      dg.columns = [ new DataGridColumn("StyleName"), new DataGridColumn("DefaultValue") ];

      addChild(dg);

       

      function showStyleDefinition(e:Event):void {

        var componentClass:Class = e.target.selectedItem.data as Class;

        var styles:Object = componentClass["getStyleDefinition"].call(this);

        trace(styles.toString());

        var styleData:DataProvider = new DataProvider();

        for(var i:* in styles) {

        trace(i + " : " + styles[i]);

        styleData.addItem( { StyleName:i, DefaultValue:styles[i] } );

        }

        styleData.sortOn("StyleName");

        dg.dataProvider = styleData;

      }