Архитектура минимальных Ui компонент
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

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

on

  • 1,865 views

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

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

Statistics

Views

Total Views
1,865
Views on SlideShare
1,683
Embed Views
182

Actions

Likes
0
Downloads
7
Comments
0

5 Embeds 182

http://fpug.org.ua 127
http://flash-ripper.com 46
http://www.fpug.org.ua 4
http://www.slideshare.net 4
http://webcache.googleusercontent.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

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

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