• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Flex中如何动态生成DataGrid以及动态生成表头
    在Flex中动态生成表格,并且表格的表头也是动态生成

    1、源码
    复制代码 代码如下:

    ?xml version="1.0" encoding="utf-8"?>
    mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    creationComplete="initHandler()"
    width="100%" height="100%">
    mx:Script>
    ![CDATA[
    import mx.events.FlexEvent;
    import mx.events.ListEvent;
    import mx.controls.ComboBox;
    import mx.controls.DataGrid;
    import mx.collections.ArrayCollection;
    import mx.controls.dataGridClasses.DataGridColumn;

    [Bindable]
    //自定义数据源
    private var grid:Array = [
    {age:'25', sex: "男",name: "张三"},
    {age:'22', sex: "女",name: "李四"},
    {age:'23', sex: "男",name: "王五"},
    {age:'21', sex: "女",name: "赵六"},
    {age:'24', sex: "男",name: "钱七"},
    {age:'20', sex: "女",name: "魏八"}
    ];

    /*初始化函数*/
    private function initHandler():void
    {
    var gridArray:ArrayCollection = new ArrayCollection(grid);

    gridArray.filterFunction;
    //自定义DataGrid控件
    var dataGrid:DataGrid = new DataGrid();
    //X轴坐标
    dataGrid.x = 20;
    //Y轴坐标
    dataGrid.y = 20;
    //数据项是否能编辑
    dataGrid.editable = false;
    //控件宽度
    dataGrid.width = 1300;
    //控件高度
    //dataGrid.height = 600;
    //设置表格行数
    dataGrid.rowCount = gridArray.length + 1;
    //设置控件内容字体大小
    dataGrid.setStyle("fontSize", 20);
    //设置表头颜色
    dataGrid.setStyle("headerColors",[0xB0C4DE,0xB0C4DE]);
    //设置字体位置
    dataGrid.setStyle("textAlign","center");
    //设置样式名
    dataGrid.styleName;
    // 设置数据源
    dataGrid.dataProvider = gridArray;
    // 添加监听事件类型与触发函数
    dataGrid.addEventListener(ListEvent.ITEM_CLICK, itemClickHandler);
    // 添加dataGrid控件
    addChild(dataGrid);
    //声明一个数组
    var columns:Array = new Array();
    var column:DataGridColumn;
    for ( var i:* in grid[0] ) {
    column = new DataGridColumn(i);
    columns.push(column);
    }
    dataGrid.columns = columns;

    }

    /*事件*/
    private function itemClickHandler(event:ListEvent):void
    {
    trace(event.target);
    }

    ]]>
    /mx:Script>

    /mx:Application>

    2、结果如下图
    上一篇:flex实现DataGrid高亮显示数据功能的解决方案
    下一篇:Flex中的HDividedBox和VDividedBox的比较附图
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    Flex中如何动态生成DataGrid以及动态生成表头 Flex,中,如何,动态,生成,