Добавляємо дітей саме туди куди ми хочемо…

Нещодавно отримав від друга з Москви запитання, яке виникає то тут то там в мережі доволі часто. А саме: “…як написати свій компонент для Flex так, щоб можна було добавляти у нього візуальних дітей та ще й заданий контейнер?“. Якщо я занадто кучеряво висловлююсь, то код би мав трохи прояснити суть запитання:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns:noubase="com.noubase.*"  
    layout="absolute" >
   
    <noubase:MyControl
        x="50" y="50" borderStyle="solid" paddingLeft="10" paddingTop="10">
       
        <mx:Button label="click" />
       
    </noubase:MyControl>
   
</mx:Application>

Як бачимо ми маємо рукописний компонент MyControl і пробуємо додати до його дітей звичайну флексову кнопочку.
Саме час розглянути код нашого компонента

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
package com.noubase
{
    import flash.display.DisplayObject;
   
    import mx.containers.Canvas;
    import mx.containers.HBox;

    public class MyControl extends HBox
    {
        public function MyControl()
        {
            super();
        }
       
        private var targetCanvas:Canvas = new Canvas();
       
        override protected function childrenCreated():void
        {
            super.childrenCreated();
            super.addChild(targetCanvas);
        }
       
        override public function addChild(child:DisplayObject):DisplayObject
        {
            return targetCanvas.addChild(child);   
        }
       
    }
}

Як бачимо все доволі просто. Тепер ми можемо самі керувати усіма дітьми, які евентуально можуть бути додані в наш компонент.
І на останок: override – рулить :)

About this entry

You’re currently reading “Добавляємо дітей саме туди куди ми хочемо…,” an entry on Nouba's laboratory

Published:
04.08.09 / 6pm
Category:
flex, tips'n'tricks