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>
但是当换成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与.NET互操作(十):FluorineFx.Net的及时通信应用(ApplicationAdapter)(一)
使用FluorineFx.Net开发的每一个实时通讯功能应用都拥有一个应用程序适配器(ApplicationAdapter),用来管理整个实时通讯应用的生命周期,以及接受和拒绝客户端的连接等。2009-06-06使用asx3m与xstream配合解决flex与java利用httpservice传递xml数据问题
过年期间抽空在弄flex前端对象与后端java对象利用httpservice交互的问题。比如前端需要user list数据,构造了flex user object类。2009-02-02Flex与.NET互操作 了解FluorineFx的环境配置(远程对象、网关、通道、目的地)
Flex中的远程对象访问,也就是服务端提供一个远程服务对象(RemotingService Object),在Flex客户端通过相应的访问技术去调用远程对象的过程。2009-06-06
最新评论