如何在flex 3中设置皮肤按钮？

Question

出于好奇，我正在努力优化我们的Flex应用程序的每个部分（这通常是我们应用程序的一小部分）。目前，我正在优化所有按钮/皮肤。我已经链接了一些我使用的按钮，以及一些我用来生成它们的示例代码。

请告知如何使其更高效，更实用，更好整体。谢谢！

正如您所看到的，我们的按钮可能非常不同，但外观和感觉相似。目前，我通过设置这样的东西来创建“有状态的皮肤”：

skin: ClassReference('com.mysite.assets.skins.NavigationButtonSkin');

然后，NavigationButtonSkin看起来像这样：

public class NavigationButtonSkin extends UIComponent {

  // imports, constructor, etc

  protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {

    // initialize fillColors, fillAlphas, roundedCorners, etc

    switch( name ){
      case 'upSkin':
      fillColors = [getStyle('backgroundColor'),getStyle('backgroundColor2')];      
      break;
      // do the same for overSkin, downSkin, disabledSkin, etc
    }

    // use this.graphics to draw background
    // use this.graphics to draw border on top of background

  }

}

我评论了一些直接的部分，但请告诉我这是否是一种糟糕/低效的方式 - 以及如何改进。

谢谢！

Answer 1

就性能而言，你的皮肤继承自ProgrammaticSkin而不是UIComponent会更好。 ProgrammticSkin本身继承自Shape并提供用于蒙皮的实用方法，例如verticalGradientMatrix，drawRoundRect，...

我只能说看你的代码。

好的一点是你使用程序化皮肤而不是基于位图/ swf的皮肤。

Answer 2

好的，我没有到达你所处的位置。你只想知道你做得对吗？我假设您的skin: ClassReference('com.mysite.assets.skins.NavigationButtonSkin');已添加到按钮的CSS中，这很好，但是我不知道为什么您正在做这一切在Actionscript中。似乎效率低下，基本上你失去了所有mxml布局的能力和对Catalyst的支持（如果你将来需要它）。

尝试在Flash Builder中创建外观，它会使用默认的按钮外观创建一个MXML，您可以根据需要进行编辑。使用mxml over actionscript也很容易进行基于状态的设计。您应该从那里进行修改，并为每个按钮类型分别设置一个外观。

编辑：哦废话，没有看到这是Flex 3 ...获取该程序;）听听Florian的说法。