Flex中让鼠标移至AdvancedDataGrid的行上不自动修改显示效果
2009-05-25 12:34
459 查看
公司项目中出于性能考虑,把mx:Repeater控件换成了mx:AdvancedDataGrid控件来显示。
注意:事实上发现,mx:Repeater控件在数据大的时候性能很差。
但是当换成AdvancedDataGrid发现,鼠标在Grid上移动Flex自动为焦点所在行修改css,为屏蔽该效果,自定义如下控件:
ApmAdvancedDataGrid.as
ApmAdvancedDataGridColumn.as
用法示例:
注意:LabelTextReqRes.mxml
注意:事实上发现,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的行上不自动修改显示效果
- 鼠标移至小图,自动显示相应大图
- [原]鼠标移至小图,自动显示相应大图
- 鼠标移至小图,自动显示相应大图
- Flex中DataGrid绑定ComboBox ,自动显示行号,增加行,删除行,保存数据
- Flex AdvancedDataGrid能够修改某一条背景颜色的继承方法
- 鼠标移至小图,自动显示相应大图
- Flex4 DataGrid自动显示行号
- Flex datagrid 鼠标over cell roll selected效果
- flex advanceddatagrid禁止排序,不显示排序倒三角按钮,判断是否有某个属性或方法
- flex AdvancedDataGrid显示列表和分组显示列表
- Flex根据后台的数据自动生成AdvancedDataGrid
- Flex根据后台的数据自动生成AdvancedDataGrid
- Flex之旅--AdvancedDataGrid 修改树节点图标
- asp.net下用js实现鼠标移至小图,自动显示相应大图
- asp.net下用js实现鼠标移至小图,自动显示相应大图
- Flex之旅--AdvancedDataGrid 修改树节点图标
- 这样控制DataGrid的单元格内内容自动隐藏,鼠标移上时显示全部
- FLEX实践—Datagrid保存列模板及自动显示行号
- Flex中如何创建一个自定义数据显示Tips的slider控件。鼠标按住滑标察看效果