ActionScript 2.0 组件语言参考 |
|
|
|
| Button 组件 > 自定义 Button 组件 > 对 Button 组件使用外观 > 使用 ActionScript 绘制 Button 外观 | |||
"光晕"主题和"范例"主题中的默认外观针对所有状态均使用同一外观元素,并通过 ActionScript 绘制实际图形。"光晕"实现使用 RectBorder 类的扩展以及某些自定义绘图代码来绘制状态。"范例"实现使用与"光晕"主题相同的外观和 ActionScript 类,并使用 ActionScript 代码设置不同的属性来更改 Button 的外观。
要创建用作外观并提供不同状态的 ActionScript 类,外观可以读取外观的 borderStyle 样式属性和父级的 emphasized 属性以确定状态。下表显示了为每种外观设置的边框样式:
|
属性 |
边框样式 |
|---|---|
falseUpSkin
|
|
falseDownSkin
|
|
falseOverSkin
|
|
falseDisabled
|
|
trueUpSkin
|
|
trueDownSkin
|
|
trueOverSkin
|
|
trueDisabledSkin
|
|
创建 ActionScript 自定义的 Button 外观:
import mx.skins.RectBorder;
import mx.core.ext.UIObjectExtensions;
class RedGreenBlueSkin extends RectBorder
{
static var symbolName:String = "RedGreenBlueSkin";
static var symbolOwner:Object = RedGreenBlueSkin;
function size():Void
{
var c:Number; // 颜色
var borderStyle:String = getStyle("borderStyle");
switch (borderStyle) {
case "falseup":
case "falserollover":
case "falsedisabled":
c = 0x7777FF;
break;
case "falsedown":
c = 0x77FF77;
break;
case "trueup":
case "truedown":
case "truerollover":
case "truedisabled":
c = 0xFF7777;
break;
}
clear();
var thickness = _parent.emphasized ? 2 : 0;
lineStyle(thickness, 0, 100);
beginFill(c, 100);
drawRect(0, 0, __width, __height);
endFill();
}
// 外观所需内容。
static function classConstruct():Boolean
{
UIObjectExtensions.Extensions();
_global.skinRegistry["ButtonSkin"] = true;
return true;
}
static var classConstructed:Boolean = classConstruct();
static var UIObjectExtensionsDependency = UIObjectExtensions;
}
此类根据边框样式创建方框:为假弹起、滑过及禁用状态创建蓝色框;为正常按下状态创建绿色框;为展开子项创建红色框。正常情况下将绘制极细边框;若是强调按钮,则绘制粗边框。
对于本示例,将文件命名为 RedGreenBlueSkin.as。
ButtonSkin。标识符将自动填写为 ButtonSkin。
RedGreenBlueSkin。
|
|
|
|