通过ItemRenderer给DataGrid的Cell设置背景色后,在行高变化时或有滚动条时,背景色表示不正常

天弈isai 2013-11-07 01:09:36
根据需要,各列的值不同时,行的背景色要设置为黄色,这点我通过重写drawRowBackground()实现了。
另外,行中,发生变化的cell的背景色要设置为橙色,这点我是通过ItemRenderer(canvas + label)来实现的。不过,当名称列的表示内容因换行导致行高变大时,ItemRenderer的canvas的位置会向下偏移,没有跟cell重合。
而且,数据过多,有滚动条时(画面初期表示,没有拖动滚动条),ItemRenderer会被执行两次,导致没有变化的行也被按照上面发生变化的行的Cell进行了背景色设置。

请高手帮忙分析,提高解决方法,在线等,谢谢!!!

现象图片:
图片一直传不上来

ItemRenderer代码:

import mx.containers.Canvas;
import mx.controls.Label;

public class HistoryRenderer extends Canvas
{
/**
* data(override)
*/
private var _data:XML;

private var _field:String;

/**
* data Setter
*/
override public function set data(value:Object):void
{
_data = XML(value[field]);

init();
}

/**
* data Getter
*/
override public function get data():Object
{
return _data;
}

/**
* field Setter
*/
public function set field(value:String):void
{
_field = value;
}

/**
* field Getter
*/
public function get field():String
{
return _field;
}

private function init():void {
this.removeAllChildren();

var label:Label = new Label();
label.percentWidth = 100;
label.percentHeight = 100;
label.text = data.toString();
label.setStyle("textAlign", "center");
this.addChild(label);
if (XML(data).@change == "1") {
this.setStyle("backgroundColor", 0xFFA500)
}
}

override protected function commitProperties():void
{
super.commitProperties();
this.percentWidth = 100;
this.percentHeight = 100;
this.setStyle("horizontalScrollPolicy", "off");
this.setStyle("verticalScrollPolicy", "off");
}
}
...全文
209 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
天弈isai 2013-11-07
  • 打赏
  • 举报
回复
去掉DataGrid的this.setStyle("verticalAlign", "middle");设定后,问题2就不再发生了。个人推测,应该是由于Label没有垂直居中属性,DataGrid为了实现文字的垂直居中,内部设置了Label的paddingTop,从而使得文字显示具有了垂直居中效果。不过,一设置背景色,就出现了问题2的偏移现象。 现在解决了问题2, 又出现了文字垂直居中表示的问题,尝试了重写Label的updateDisplayList方法,不过这种方法就是通过textField的坐标设置实现的,我现在是通过textField设置的背景色,所以如果实现了文字垂直居中,肯定就会出现背景色偏移的问题,头疼啊~~~~~~~~~ 高手帮忙给支支招哈~~~拜谢!!!
天弈isai 2013-11-07
  • 打赏
  • 举报
回复
1.set the property of the grid 'verticalAlign' ->"middle"
这个方法现在已经在用了,没有效果

方法2我试了下,没有效果。

另外,我按照下面的方法改了下ItemRenderer,能过解决问题1,但是解决不了问题2.

不用canvas,只用label。


import common.CommonDefine;

import mx.controls.Label;

public class HistoryRenderer extends Label
{
/**
* data(override)
*/
private var _data:XML;

private var _field:String;

/**
* data Setter
*/
override public function set data(value:Object):void
{
_data = XML(value[field]);

init();
}

/**
* data Getter
*/
override public function get data():Object
{
return _data;
}

/**
* field Setter
*/
public function set field(value:String):void
{
_field = value;
}

/**
* field Getter
*/
public function get field():String
{
return _field;
}

private function init():void {
this.text = data.toString();
this.setStyle("textAlign", "center");
textField.alpha = 1;
textField.background = false;
textField.border = false;
if (XML(data).@change == "1") {
textField.background = true;
textField.backgroundColor = 0xFFA500;
}
}

override protected function commitProperties():void
{
super.commitProperties();
this.percentWidth = 100;
this.percentHeight = 100;
this.setStyle("horizontalScrollPolicy", "off");
this.setStyle("verticalScrollPolicy", "off");
}
}


textField.border = true;的时候,通过label的边框位置可以看出来,label不是在单元格的左上角开始的。

用心做软件 2013-11-07
  • 打赏
  • 举报
回复
you can try do it like this 1.set the property of the grid 'verticalAlign' ->"middle" 2. override public function set data(value:Object):void { if(_data != XML(value[field])) { _data = XML(value[field]); init(); } }
天弈isai 2013-11-07
  • 打赏
  • 举报
回复
下面是现象图片

4,328

社区成员

发帖
与我相关
我的任务
社区描述
多媒体/设计 Flex
社区管理员
  • Flex
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧