Как сделать скин кнопок в flex 3?

Question

Просто из любопытства я прилагаю усилия для оптимизации каждой части нашего гибкого приложения (которое является небольшой частью нашего приложения в целом). В настоящее время я работаю над оптимизацией всех кнопок / скинов. Я связал несколько кнопок, которые я использую, и пример кода, который я использую для их генерации.

Посоветуйте, пожалуйста, как сделать это более эффективным, удобным и просто лучше в целом. Спасибо!

Как видите, наши кнопки могут сильно отличаться, но выглядят и выглядят одинаково. В настоящее время я создаю «скины с состоянием», настраивая что-то вроде этого:

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 ... Получить с программой;) Просто послушайте, что сказал Флориан.