Adobe Flex

Выходные прошли в знакомстве с технологией флеш. Такого восторга я не испытывал со времен, когда первый раз увидел изнутри OpenGL.

Это очень, товарищи! Жалею теперь, что откладывал это знакомство, думал, успеется. Надо было давно это заюзать. Перед вами будущее распределённых корпоративных приложений, а для всяких eBay, Nasdaq и прочих монстров — уже настоящее.

Так, впечатлений много — подробнее напишу позже. Вот какой этюдик для пробы набросал, посмотрев за ночь курс Flex in a week. Получение данных в XML, отображение в гриде, анимация при переходе от одного viewstate к другому.

Исходники:

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"   layout="absolute" fontSize="14" fontFamily="Arial"
    borderColor="#000000" themeColor="#547FD6" color="#000000" backgroundGradientAlphas="[1.0, 1.0]"
    backgroundGradientColors="[#FFFFFF, #FFFFFF]" width="100%" height="100%" initialize="init()" currentState="Base">
   
    <mx:states>
        <mx:State name="Base"/>
        <mx:State name="DocView">
            <mx:RemoveChild target="{panel}"/>
            <mx:SetProperty target="{panel}" name="y" value="60"/>
        </mx:State>
    </mx:states>   
    <mx:transitions>   
        <mx:Transition fromState="*" toState="DocView">
            <mx:Sequence>
                <mx:Parallel>
                    <mx:Dissolve target="{panel}" alphaFrom="1" alphaTo="0" targetArea="{tArea}"/> 
                    <mx:Move target="{panel}"/>
                </mx:Parallel>
                <mx:RemoveChildAction target="{panel}" />
            </mx:Sequence>
        </mx:Transition>       
        <mx:Transition fromState="DocView" toState="*">
            <mx:Sequence>
                <mx:Parallel>
                    <mx:Dissolve target="{panel}" alphaFrom="0" alphaTo="1" targetArea="{tArea}"/> 
                    <mx:Move target="{panel}"/>
                </mx:Parallel>
                <mx:RemoveChildAction target="{panel}" />
            </mx:Sequence>
        </mx:Transition>       
    </mx:transitions>
   
    <mx:Script>
        <![CDATA[

            import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;
            import mx.graphics.*;
           
            [Bindable]
            private var docData:ArrayCollection;           
            [Bindable]
            public var tArea:RoundedRectangle; 
       
            private function resultHandler(event:ResultEvent): void
            {
                docData = event.result.packet.data.r;
            }
           
            private function init(): void
            {
                myDataSrc.send()
            }  
                   
            private function toggleGrid(): void
            {
                tArea = new RoundedRectangle(-1,-1, panel.width+2, panel.height+10, 5);
           
                if (this.currentState != "DocView")
                {
                    this.currentState = "DocView";
                    toggleButton.label = "Показать таблицу";
                }
                else
                {
                    this.currentState="";
                    toggleButton.label = "Скрыть таблицу";
                }
            }      

        ]]>
    </mx:Script>
   
    <mx:HTTPService id="myDataSrc"
        url="utfdata.xml"
        result="resultHandler(event)"/>
       
    <mx:Panel id="panel"
            top="20" bottom="244" left="250" right="141"
            autoLayout="true"
            borderStyle="inset"
            title="Основные документы">
       
        <mx:DataGrid id="mainGrid" width="100%" height="100%"
            dataProvider="{docData}"
            change="toggleGrid()">
            <mx:columns>
                <mx:DataGridColumn
                    dataField="NUM_DOC"
                    headerText="№ документа"/>
                <mx:DataGridColumn
                    dataField="UPD_DATE"
                    headerText="Обновлено"/>
                <mx:DataGridColumn
                    dataField="FILE_NAME"
                    headerText="Имя файла"/>                   
            </mx:columns>          
        </mx:DataGrid> 
    </mx:Panel>
   
    <mx:Button id="toggleButton"
        click="toggleGrid()"
        x="26" y="20" label="Скрыть таблицу"/>


</mx:Application>
→

Ваш комментарий:

 

 


Только просмотр (без публикации)