DataGrid–在列中顯示圖片

 1.在代碼層加入如下代碼

      (注意, 先把DataGrid組件加入到為庫面板中)

 

     import fl.controls.DataGrid;
     import fl.controls.dataGridClasses.DataGridColumn;
     import fl.data.DataProvider;

     /* Create and populate a new DataProvider object. Note that three of the items
        in the data provider refer to externally-loaded images, whereas the last two
       items refer to symbol linkages in the library. */
     var dp:DataProvider = new DataProvider();
     dp.addItem({data:"http://www.helpexamples.com/flash/images/image1.jpg", title:"image1.jpg"});
     dp.addItem({data:"http://www.helpexamples.com/flash/images/image2.jpg", title:"image2.jpg"});
     dp.addItem({data:"http://www.helpexamples.com/flash/images/image3.jpg", title:"image3.jpg"});
     dp.addItem({data:"Bear", title:"Bear.jpg"});   //讀本地圖片檔案
     dp.addItem({data:"Lion", title:"Lion.jpg"});   //讀本地圖片檔案

     var dataGrid:DataGrid = new DataGrid();

     var dataCol:DataGridColumn = new DataGridColumn("data");
     var titleCol:DataGridColumn = new DataGridColumn("title");
     dataGrid.addColumn(dataCol);
     dataGrid.addColumn(titleCol);

     dataCol.cellRenderer = LoaderCellRenderer;

     dataGrid.dataProvider = dp;
     dataGrid.rowHeight = 64;
     dataGrid.width = 200;
     dataGrid.rowCount = dp.length - 1;
     dataGrid.move(10, 10);
     trace(dataGrid);
     addChild(dataGrid);

 

2.LoaderCellRenderer類

     package {
         import fl.containers.UILoader;
         import fl.controls.listClasses.ICellRenderer;
         import fl.controls.listClasses.ListData;
         import fl.core.InvalidationType;
         import fl.data.DataProvider;
         import flash.events.Event;
  
         public class LoaderCellRenderer extends UILoader implements ICellRenderer {
             protected var _data:Object;
             protected var _listData:ListData;
             protected var _selected:Boolean;
      
             public function LoaderCellRenderer():void {
                 super();
             }
      
             public function get data():Object {
                 return _data;
             }
      
             public function set data(value:Object):void {
                 _data = value;
                 source = value.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 {
            }
         }
     }