Your SlideShare is downloading. ×
0
Архитектура минимальных UI компонент<br />Виталий Хить (well)<br />
Зачем это нужно?<br />Виджеты<br />Примеры кода<br />Собственное обучение<br />
Готовые компоненты<br />Flex<br />Flash<br />Minimal Components (bit-101.com)<br />
Flex<br />
Flash<br />
Minimal components<br />
Minimal Components<br />
Структура компонента<br />Менеджер<br />Менеджер<br />
Менеджер клавиатуры<br />
Менеджер отображения (СТИЛИ)<br />
Структура Класса компонента <br />
UIComponent extends Sprite / MovieClip<br />
UIComponentсвойства<br />Координаты<br />Размеры<br />Состояния<br />Visible<br />Enabled<br />Мышка (up, over, down)<br /...
Uicomponent cтруктура менеджера свойств<br />
МЕНЕДЖЕР СВОЙСТВ<br />static public const ISIZE :uint = 0x01;<br />static public const ISTYLE :uint = 0x02;<br />…….<br />...
UICOMPONENT Ограничивающий прямоугольник<br />x, y -&gt; _x, _y, move()<br />width, height -&gt; _width, _height, setSize(...
UIComponentСтиликласса<br />static private const defaultStyles:Object= { <br />color :0xffffff, <br />defaultLabel : “Labe...
UIComponentменеджер стилей<br />protected varinstanceStyles:Object;<br />protected function getStyleValue(name:String):Obj...
МЕНЕДЖЕР Стилей<br />private static var _instances :Dictionary = new Dictionary(true);<br />private static var _styles :Di...
МЕНЕДЖЕР Стилей<br />public static function registerInstance(instance :UIComponent) :void <br />{<br />varclassDef :Class ...
СКИНЫ<br />
[Embed…<br />public class fl.controls.Button extends UIComponent {<br />[Embed (source=&apos;../skin/skin.swf&apos;, symbo...
Чистка Flash компонентов<br />Удалить acsessibilityсоставляющую<br />Удалить FocusManagerи сопутствующие классы<br />Упрос...
Upcoming SlideShare
Loading in...5
×

Архитектура минимальных Ui компонент

1,204

Published on

Докладчик - Виталий Хить

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,204
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
8
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Архитектура минимальных Ui компонент"

  1. 1. Архитектура минимальных UI компонент<br />Виталий Хить (well)<br />
  2. 2. Зачем это нужно?<br />Виджеты<br />Примеры кода<br />Собственное обучение<br />
  3. 3. Готовые компоненты<br />Flex<br />Flash<br />Minimal Components (bit-101.com)<br />
  4. 4. Flex<br />
  5. 5. Flash<br />
  6. 6. Minimal components<br />
  7. 7. Minimal Components<br />
  8. 8. Структура компонента<br />Менеджер<br />Менеджер<br />
  9. 9. Менеджер клавиатуры<br />
  10. 10. Менеджер отображения (СТИЛИ)<br />
  11. 11. Структура Класса компонента <br />
  12. 12. UIComponent extends Sprite / MovieClip<br />
  13. 13. UIComponentсвойства<br />Координаты<br />Размеры<br />Состояния<br />Visible<br />Enabled<br />Мышка (up, over, down)<br />Значения<br />Стили<br />Стили экземпляра компонента<br />Глобальные стили (класс, глобальные)<br />
  14. 14. Uicomponent cтруктура менеджера свойств<br />
  15. 15. МЕНЕДЖЕР СВОЙСТВ<br />static public const ISIZE :uint = 0x01;<br />static public const ISTYLE :uint = 0x02;<br />…….<br /> protected varinvalidHash :uint;<br />……. <br />public function invalidate(property: uint = InvalidationType.ALL, callLater :Boolean = true):void {<br />invalidHash |= property;<br /> if (!_inCallLater) {<br />addEventListener(Event.ENTER_FRAME, callLaterDispatcher,false,0,true); <br /> _inCallLater = true;<br />}<br />}<br /> protected function validate():void {<br />invalidHash = 0;<br /> _inCallLater = false;<br />}<br /> private function callLaterDispatcher(event:Event):void {<br />removeEventListener(Event.ENTER_FRAME,callLaterDispatcher);<br /> draw(); <br />}<br />protected function draw() :void {<br /> if (isValid(ISTYLE | ISIZE)) { ... }<br /> validate();<br />}<br />
  16. 16. UICOMPONENT Ограничивающий прямоугольник<br />x, y -&gt; _x, _y, move()<br />width, height -&gt; _width, _height, setSize()<br />scaleX, scaleY<br />
  17. 17. UIComponentСтиликласса<br />static private const defaultStyles:Object= { <br />color :0xffffff, <br />defaultLabel : “Label”, <br />disabledSkin : “Label_DisabledSkin”<br />};<br />public static function getStyleDefinition():Object { <br /> return defaultStyles;<br />}<br />
  18. 18. UIComponentменеджер стилей<br />protected varinstanceStyles:Object;<br />protected function getStyleValue(name:String):Object {<br /> return (instanceStyles[name] == null) ? StyleManager.getStyleValue(name, _classDef) : instanceStyles[name];<br />}<br /> protected function getDisplayObjectInstance(skin:Object):DisplayObject {<br />varclassDef:Object = null;<br /> if (skin is Class) { <br /> return (new skin()) as DisplayObject; <br /> } else if (skin is DisplayObject) {<br /> (skin as DisplayObject).x = 0;<br /> (skin as DisplayObject).y = 0;<br /> return skin as DisplayObject;<br /> }<br /> try {<br />classDef = getDefinitionByName(skin.toString());<br /> } catch(e:Error) {<br /> try {<br />classDef = loaderInfo.applicationDomain.getDefinition(skin.toString()) as Object;<br /> } catch (e:Error) {<br /> // Nothing<br /> }<br /> }<br /> if (classDef == null) {<br /> return null;<br /> }<br /> return (new classDef()) as DisplayObject;<br />}<br />
  19. 19. МЕНЕДЖЕР Стилей<br />private static var _instances :Dictionary = new Dictionary(true);<br />private static var _styles :Dictionary = new Dictionary(true);<br />public static function getStyleValue(name :String, classDef :Class = null) :Object<br />{<br />var style :Object = _styles[classDef];<br /> return (style && style[name]) ? style[name] : _styles[null][name]; <br />}<br />public static function setStyle(name :String, value :Object, classDef :Class = null) :void<br />{<br /> if (!_styles[classDef]) _styles[classDef] = {};<br /> _styles[classDef][name] = value;<br /> if (classDef) invalidateStyle(classDef);<br /> else for (varobj :* in _instances) invalidateStyle(obj == &apos;null&apos; ? null : obj); <br />} <br />
  20. 20. МЕНЕДЖЕР Стилей<br />public static function registerInstance(instance :UIComponent) :void <br />{<br />varclassDef :Class = getClassDef(instance); <br /> if (!classDef) return;<br />if (!_instances[classDef]) _instances[classDef] = new Dictionary(true);<br /> _instances[classDef][instance] = true;<br />if (_styles[classDef]) return;<br />var target :Class = classDef;<br />vardefaultStyles :Object = null;<br /> while (!defaultStyles) {<br /> if (target[&quot;getStyleDefinition&quot;]) { defaultStyles = target[&quot;getStyleDefinition&quot;](); break; }<br /> try { target = instance.loaderInfo.applicationDomain.getDefinition(getQualifiedSuperclassName(target)) as Class; } <br /> catch(err :Error) {<br /> try { target = getDefinitionByName(getQualifiedSuperclassName(target)) as Class; } <br /> catch (e:Error) { defaultStyles = UIComponent.getStyleDefinition(); break; }<br /> }<br /> }<br /> _styles[classDef] = defaultStyles;<br />if (!_styles[null]) _styles[null] = UIComponent.getStyleDefinition();<br />}<br />
  21. 21. СКИНЫ<br />
  22. 22. [Embed…<br />public class fl.controls.Button extends UIComponent {<br />[Embed (source=&apos;../skin/skin.swf&apos;, symbol=&apos;Button_disabledSkin&apos;)]<br />static private vardisabledSkin :Class;<br />public class fl.controls.Button_disabledSkin extends SpriteAsset<br />private static vardefaultStyles:Object = {<br />disabledSkin:&quot;fl.controls::Button_disabledSkin&quot;,<br />
  23. 23. Чистка Flash компонентов<br />Удалить acsessibilityсоставляющую<br />Удалить FocusManagerи сопутствующие классы<br />Упростить Style Manager<br />Удалить из UIComponent<br />Связь с фокус менеджером<br />Связь со средой разработки Flash<br />(?) Изменение scale составляющей<br />Исправить ошибки в дочерних классах<br />Изменить названия скинов (если используется flex)<br />
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×