为多个 UI 组件换肤

Question

假设您的应用程序中有大量 (N) 个火花按钮。我们还假设您的按钮都具有非常相似的外观（大小、各种效果等） - 唯一的区别是它们用作 BitmapImage 的特定 png。 您最终会得到 N 个皮肤文件，每个文件都相差 1 行吗？或者是否有一种更智能的方法可以做到这一点，同时在 MXML 中创建按钮时无需添加大量代码（事实上，理想情况下没有）。

Answer 1

使用输入为 BitmapImage 的图标 SkinPart 创建自定义按钮将允许您对所有按钮使用相同的外观：

<YourCustomButton icon="@Embed('yourIconFile.png') />

CustomButton.as

public class CustomButton extends Button
    {
        [SkinPart(required="false")]
        public var iconContainer:BitmapImage;

        private var _icon:Object;

        public function CustomButton()
        {
            super();
        }

        override protected function partAdded(partName:String, instance:Object):void
        {
            super.partAdded(partName, instance);

            if (instance == iconContainer && _icon)
                iconContainer.source = _icon;
        }

        public function get icon():Object
        {
            return _icon;
        }
        public function set icon(value:Object):void
        {
            if (iconContainer)
                iconContainer.source = value;

            _icon = value;
        }
    }