ActionScript 2.0 组件语言参考 |
|
|
|
| Accordion 组件 > 自定义 Accordion 组件 > 对 Accordion 组件使用外观 > 使用 ActionScript 绘制 Accordion 标题 | |||
"光晕"主题和"范例"主题中的默认标题针对所有状态均使用同一外观元素,并通过 ActionScript 绘制实际图形。"光晕"实现使用 RectBorder 类的扩展及自定义绘制 API 代码绘制状态。"范例"实现使用相同的外观和相同的 ActionScript 类作为 Button 外观。
为了创建用作外观并提供不同状态的 ActionScript 类,外观可以读取其 borderStyle 样式属性来确定状态。下表显示了为每种外观设置的边框样式:
|
属性 |
边框样式 |
|---|---|
falseUpSkin
|
falseup
|
falseDownSkin
|
falsedown
|
falseOverSkin
|
falserollover
|
falseDisabled
|
falsedisabled
|
trueUpSkin
|
trueup
|
trueDownSkin
|
truedown
|
trueOverSkin
|
truerollover
|
trueDisabledSkin
|
truedisabled
|
创建 ActionScript 自定义 Accordion 标题外观:
import mx.skins.RectBorder;
import mx.core.ext.UIObjectExtensions;
class RedGreenBlueHeader extends RectBorder
{
static var symbolName_str:String = "RedGreenBlueHeader";
static var symbolOwner_obj:Object = RedGreenBlueHeader;
function size():Void
{
var color_num:Number; // 颜色
var borderStyle_str:String = getStyle("borderStyle"); // Accordion 的属性
// 定义每种选项卡状态下 Accordion 中的每个选项卡的颜色。
switch (borderStyle_str) {
case "falseup":
case "falserollover":
case "falsedisabled":
color_num = 0x7777FF;
break;
case "falsedown":
color_num = 0x77FF77;
break;
case "trueup":
case "truedown":
case "truerollover":
case "truedisabled":
color_num = 0xFF7777;
break;
}
// 清除默认样式并绘制自定义样式。
clear();
lineStyle(0, 0, 100);
beginFill(color_num, 100);
drawRect(0, 0, __width, __height);
endFill();
}
// 外观所需内容
static function classConstruct():Boolean
{
UIObjectExtensions.Extensions();
_global.skinRegistry["AccordionHeaderSkin"] = true;
return true;
}
static var classConstructed_bl:Boolean = classConstruct();
static var UIObjectExtensionsDependency_obj:Object = UIObjectExtensions;
}
此类根据边框样式创建方框:为假弹起、滑过及禁用状态创建蓝色框;为正常按下状态创建绿色框;为展开子项创建红色框。
对于本示例,将该文件命名为 RedGreenBlueHeader.as。
标识符将自动填写为 AccordionHeaderSkin。
RedGreenBlueHeader。例如,将 childLabels 设置为 [One,Two,Three] 数组,将 childNames 设置为 [one,two,three] 数组。
|
|
|
|