DataGrid--在列中显示图片

最新推荐文章于 2020-04-30 13:56:18 发布

djy1135

最新推荐文章于 2020-04-30 13:56:18 发布

阅读量2.6k

点赞数

CC 4.0 BY-SA版权

文章标签： datagrid import function object image string

本文链接：https://blog.youkuaiyun.com/djy1135/article/details/4782463

本文介绍如何在Flash中使用DataGrid组件展示包含外部及本地图片的数据，并通过自定义单元格渲染器LoaderCellRenderer实现图片的正确加载。

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 {
            }
       }
   }