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

Flex TileList自定义间距和theme样式

2009-06-16 22:57:10 作者：

使用过TileList的朋友可能知道，该组件没有Item与Item之间的间距设置。而且theme也没有办法象linkbar那样设置样式corner-radius改变形状。

唯一的解决办法就是重写TileList组件中drawSelectionIndicator 和drawHighlightIndicator 。

/** 
* Author Dante 
* Email:rubbish86630@yahoo.com.cn 
* CreatedTime:2009.04.13 
* Description: 
* 该组件实现选中和划过theme样式，并且添加间距 
* **/ 
package myLib { 

import flash.display.Graphics; 
import flash.display.Sprite; 

import mx.controls.TileList; 
import mx.controls.listClasses.IListItemRenderer; 
public class MyTileList extends TileList { 

[Bindable] 
private var _verticalGap:Number = 0; 

[Bindable] 
private var _horizontalGap:Number = 0; 

public function MyTileList() { 
super(); 
} 
/** 
* 重写鼠标划过高亮 
* @indicator:Sprite 
* @x:Number 
* @y:Number 
* @width:Number 
* @height:Number 
* @color:uint 
* @itemRenderer:IListItemRenderer 
* return void 
* **/ 
override protected function drawHighlightIndicator(indicator:Sprite, x:Number, y:Number, width:Number, height:Number, color:uint, itemRenderer:IListItemRenderer):void { 
//绘图 
var g:Graphics = indicator.graphics; 

g.clear(); 
g.beginFill(color); 
//画椭圆 
g.drawEllipse(0, 0, width - _horizontalGap, height - _verticalGap); 
g.endFill(); 

indicator.x = x; 
indicator.y = y; 
} 

/** 
* 重写选中高亮 
* @indicator:Sprite 
* @x:Number 
* @y:Number 
* @width:Number 
* @height:Number 
* @color:uint 
* @itemRenderer:IListItemRenderer 
* return void 
* **/ 
override protected function drawSelectionIndicator(indicator:Sprite, x:Number, y:Number, width:Number, height:Number, color:uint, itemRenderer:IListItemRenderer):void { 
//绘图 
var g:Graphics = indicator.graphics; 

g.clear(); 
g.beginFill(color); 
//画椭圆 
g.drawEllipse(0, 0, width - _horizontalGap, height - _verticalGap); 
g.endFill(); 

indicator.x = x; 
indicator.y = y; 
} 

//============================= 
// set and get 
//============================= 
public function set verticalGap(value:Number):void { 
_verticalGap = value; 
} 

public function get verticalGap():Number { 
return _verticalGap; 
} 

public function set horizontalGap(value:Number):void { 
_horizontalGap = value; 
} 

public function get horizontalGap():Number { 
return _horizontalGap; 
} 
} 
} 