[flex] DataGrid追加ToolTip后的奇怪问题，求解！（不知是否Flex的Bug）
 |
tianyi_qingwu
2011-09-20
在给DataGrid（或AdvancedDataGrid）的表头添加了弹出ToolTip功能后，将光标放在第一列的数据值上，然后刷新页面（或者执行其他可能刷新表的操作），这时就会在光标的位置上弹出最后一个标头的ToolTip内容，最后一个标题如果不添加ToolTip就会弹出更前面一个表头的ToolTip内容，很奇怪。查了很久没有找到原因，我自己尝试着更改表头ToolTip弹出的方式（DataGrid固有的showDataTips或者更改headerRenderer），都不能解决问题。希望各位高人能够帮忙解惑，或者提供下课调查方向。
[img]C:\Documents and Settings\wangweicai\デスクトップ\ToolTipBug.JPG[/img] 重新做了测试，发现，当根据数据源动态追加列的时候，在刷新页面和点击第一列以改变数据源的时候，会有ToolTip弹出，如果是固定的列，即使刷新页面和通过点击更改数据源也不会有ToolTip弹出。 另外，不仅限于第一列，当第一列的列宽比较小的时候，第2列也会有类似现象，大概是表示开始100像素左右的宽度都会有这个现象。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:component="component.*" creationComplete="init()" xmlns:renderer="renderer.*" xmlns:local="*">
<mx:Script>
<![CDATA[
import mx.controls.DataGrid;
import mx.events.ListEvent;
import mx.controls.dataGridClasses.DataGridColumn;
[Bindable]
public var xml:XML = <DATA>
<ROW><PartName title="部品名" toolTip="部品名" textAlign="left" type="text" event="" width="0.154">QFP-100P(16.0)</PartName><MC title="MC" toolTip="マシン番号" textAlign="left" type="text" event="" width="0.03">1</MC><TBL title="TBL" toolTip="テーブル番号" textAlign="left" type="text" event="" width="0.035">2</TBL><MissRate title="ミス率[%]" toolTip="ミス率[%]" textAlign="right" type="text" event="" width="0.09">22.81</MissRate><MissCount title="合計" toolTip="合計" textAlign="right" type="text" event="" width="0.06">13</MissCount><PICKUP title="吸着" toolTip="吸着" textAlign="right" type="text" event="" width="0.06">9</PICKUP><RECOG title="認識" toolTip="認識" textAlign="right" type="text" event="" width="0.06">4</RECOG><HEIGHT title="高さ" toolTip="高さ" textAlign="right" type="text" event="" width="0.06">0</HEIGHT><MOUNT title="装着" toolTip="装着" textAlign="right" type="text" event="" width="0.06">0</MOUNT><DROP title="落下" toolTip="落下" textAlign="right" type="text" event="" width="0.06">0</DROP><TRAN title="転写" toolTip="転写" textAlign="right" type="text" event="" width="0.06">0</TRAN>
</ROW>
<ROW><PartName>QFP-100P(16.0)</PartName><MC>1</MC><TBL>2</TBL><ADDRESS>T2-1</ADDRESS><MissRate>11.11</MissRate><MissCount>3</MissCount><PICKUP>2</PICKUP><RECOG>1</RECOG><HEIGHT>0</HEIGHT><MOUNT>0</MOUNT><DROP>0</DROP><TRAN>0</TRAN>
</ROW>
</DATA>;
private var xmlNHADD:XML = <DATA> <ROW> <NHADD title="ヘッド番号" toolTip="ヘッド番号" textAlign="left" type="text" event="" width="0.13">1</NHADD> <MC title="MC" toolTip="マシン番号" textAlign="left" type="text" event="" width="0.03">1</MC> <TBL title="TBL" toolTip="テーブル番号" textAlign="left" type="text" event="" width="0.035">2</TBL> <MissRate title="ミス率[%]" toolTip="ミス率[%]" textAlign="right" type="text" event="" width="0.09">18.75</MissRate> <MissCount title="合計" toolTip="合計" textAlign="right" type="text" event="" width="0.06">9</MissCount> <PICKUP title="吸着" toolTip="吸着" textAlign="right" type="text" event="" width="0.06">7</PICKUP> <RECOG title="認識" toolTip="認識" textAlign="right" type="text" event="" width="0.06">2</RECOG> <HEIGHT title="高さ" toolTip="高さ" textAlign="right" type="text" event="" width="0.06">0</HEIGHT> <MOUNT title="装着" toolTip="装着" textAlign="right" type="text" event="" width="0.06">0</MOUNT> <DROP title="落下" toolTip="落下" textAlign="right" type="text" event="" width="0.06">0</DROP> <TRAN title="転写" toolTip="転写" textAlign="right" type="text" event="" width="0.06">0</TRAN> </ROW> <ROW> <NHADD>3</NHADD> <MC>1</MC> <TBL>2</TBL> <MissRate>19.44</MissRate> <MissCount>7</MissCount> <PICKUP>4</PICKUP> <RECOG>3</RECOG> <HEIGHT>0</HEIGHT> <MOUNT>0</MOUNT> <DROP>0</DROP> <TRAN>0</TRAN> </ROW></DATA>
/**
* DataGrid用のデータ
*/
private var rowList:XMLList = xml.children();
private function init():void
{
initDataGrid();
}
protected function initDataGrid():void
{
var colNameArr:Array = new Array();
var colTitleArr:Array = new Array();
var colDataTipArr:Array = new Array();
for each(var m:XML in XML(rowList[0]).children()) {
colNameArr.push(m.name());
colTitleArr.push(String(m.@title));
colDataTipArr.push(m.@toolTip);
}
var columnArr:Array = [];
for(var index:int; index < colNameArr.length; index++) {
if(String(colTitleArr[index]).length != 0) {
var dgc:DataGridColumn = new DataGridColumn();
dgc.dataField = colNameArr[index];
dgc.dataTipField = colDataTipArr[index];
dgc.headerText = colTitleArr[index];
if (index == 0) {
dgc.width = 150;
}
dgc.headerRenderer = new ClassFactory(HeaderRenderer);
columnArr.push(dgc);
}
}
datagrid.columns = columnArr;
}
private function datagridClick(e:ListEvent):void
{
if (e.target is DataGrid) {
e.target.dataProvider = xmlNHADD.children();
rowList = xmlNHADD.children();
initDataGrid();
}
}
private function datagrid1Click(e:ListEvent):void
{
if (e.target is DataGrid) {
if (e.target.id == "datagrid1") {
id1.dataField = "NHADD";
id1.headerText = "ヘッド番号";
id1.dataTipField = "ヘッド番号";
e.target.dataProvider = xmlNHADD.children();
}
}
}
]]>
</mx:Script>
<mx:Label x="30" y="10" text="动态追加列：1.在数据源刷新时，如果光标在第一列的表格内会有ToolTip弹出；2.点击第一列的内容也会有ToolTip弹出" fontSize="14" color="red"/>
<mx:DataGrid id="datagrid" x="30" y="30" dataProvider="{rowList}" width="600" height="150" itemClick="datagridClick(event)"
headerColors="[0x1D417A, 0x1D417A]"/>
<mx:Label x="30" y="200" text="固定列：不会有ToolTip弹出" fontSize="14" color="red"/>
<mx:DataGrid id="datagrid1" x="30" y="220" dataProvider="{rowList}" width="600" height="150" itemClick="datagrid1Click(event)"
headerColors="[0x1D417A, 0x1D417A]">
<mx:columns>
<mx:DataGridColumn id="id1" dataField="PartName" headerText="部品名" dataTipField="部品名" fontSize="12" textAlign="left" width="150">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="MC" headerText="MC" dataTipField="マシン番号" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="TBL" headerText="TBL" dataTipField="テーブル番号" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="MissRate" headerText="ミス率[%]" dataTipField="ミス率[%]" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="MissCount" headerText="合計" dataTipField="合計" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="PICKUP" headerText="吸着" dataTipField="吸着" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="RECOG" headerText="認識" dataTipField="認識" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="HEIGHT" headerText="高さ" dataTipField="高さ" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="MOUNT" headerText="装着" dataTipField="装着" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="DROP" headerText="落下" dataTipField="落下" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="TRAN" headerText="転写" dataTipField="転写" fontSize="12" textAlign="left">
<mx:headerRenderer>
<mx:Component>
<local:HeaderRenderer />
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:Application>
package
{
import mx.controls.Text;
public class HeaderRenderer extends Text
{
public function HeaderRenderer()
{
super();
}
private var _data:Object;
override public function set data(value:Object):void
{
_data = value;
initSpecialTextLable();
}
override public function get data():Object
{
return _data;
}
public function initSpecialTextLable():void
{
this.text = data.headerText;
this.toolTip = data.dataTipField;
//ラベルのテクスト設定
this.setStyle("textAlign", "center");
this.setStyle("color", "#FFFFFF");
this.setStyle("fontSize", "12");
this.setStyle("fontWeight", "normal");
this.setStyle("fontFamily", "ＭＳ ゴシック");
}
}
}
|
