首页 > 网页制作 > Flash > Flex > Flex AdvancedDataGrid

Flex中让鼠标移至AdvancedDataGrid的行上不自动修改显示效果

2009-05-25 18:27:07 作者：

公司项目中出于性能考虑，把mx:Repeater控件换成了mx:AdvancedDataGrid控件来显示。

注意：事实上发现，mx:Repeater控件在数据大的时候性能很差。
但是当换成AdvancedDataGrid发现，鼠标在Grid上移动Flex自动为焦点所在行修改css，为屏蔽该效果，自定义如下控件:
ApmAdvancedDataGrid.as

复制代码代码如下:

package com.nauproject.apm.common.custom 
{ 
    import flash.events.MouseEvent; 

    import mx.controls.AdvancedDataGrid; 
    import mx.core.mx_internal; 
    use namespace mx_internal; 

    public class ApmAdvancedDataGrid extends AdvancedDataGrid 
    { 
        public function ApmAdvancedDataGrid() 
        { 
            super(); 
        } 

        override protected function mouseOverHandler(event:MouseEvent):void { 
        } 

        override protected function mouseDownHandler(event:MouseEvent):void { 
        } 
    } 
}

ApmAdvancedDataGridColumn.as

复制代码代码如下:

package com.nauproject.apm.common.custom 
{ 
    import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn; 

    [DefaultProperty("apmColumn")] 

    public class ApmAdvancedDataGridColumn extends AdvancedDataGridColumn 
    { 
        public function ApmAdvancedDataGridColumn(columnName:String=null) 
        { 
            super(columnName); 
        } 

    } 
}

用法示例：

复制代码代码如下:

<custom:ApmAdvancedDataGrid id="reqResearchSeeds" headerHeight="0" 
                        sortableColumns="false" 
                        selectionMode="multipleCells" 
                        alternatingItemColors="[0xccffcc, 0xfafad2]" 
                        variableRowHeight="true" 
                        designViewDataType="flat" 
                        borderStyle="none" 
                        verticalGridLineColor="#FFFFFF" 
                        themeColor="#FFFFFF" 
                        width="100%" 
                        height="100%"> 
                        <custom:columns> 
                            <custom:ApmAdvancedDataGridColumn headerText="Album" dataField="album" width="50"/> 
                            <custom:ApmAdvancedDataGridColumn itemRenderer="com.nauproject.apm.common.custom.LabelTextReqRes"/> 
                        </custom:columns> 
                    </custom:ApmAdvancedDataGrid>

注意：LabelTextReqRes.mxml

复制代码代码如下:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Script> 
        <!--[CDATA[ 
            import mx.collections.ArrayCollection; 
            import mx.controls.AdvancedDataGrid; 
        ]]--> 
    </mx:Script> 
    <mx:VBox> 
        <mx:Label id="lab1" text="◆研究テーマ"/> 
         <mx:Text id="txt1" htmlText="{data.rthema}" width="455" y="{lab1.height}"/>     
         <mx:Label id="lab2" text="◆キーワード" y="{lab1.height + txt1.height}"/> 
         <mx:Text id="txt2" htmlText="{data.keyword}" width="455" y="{lab1.height + txt1.height + lab2.height}"/> 
         <mx:Label id="lab3" text="◆研究の特徴" y="{lab1.height + txt1.height + lab2.height + txt2.height}"/> 
         <mx:Text id="txt3" htmlText="{data.rtoku}" width="455" y="{lab1.height + txt1.height + lab2.height + txt2.height + lab3.height}"/> 
         <mx:Label id="lab4" text="◆技術移転の可能性" y="{lab1.height + txt1.height + lab2.height + txt2.height + lab3.height + txt3.height}"/> 
         <mx:Text id="txt4" htmlText="{data.rkanousei}" width="455" y="{lab1.height + txt1.height + lab2.height + txt2.height + lab3.height + txt3.height + lab4.height}"/> 
    </mx:VBox> 
</mx:Canvas>

Flex中让鼠标移至AdvancedDataGrid的行上不自动修改显示效果

您可能感兴趣的文章: