ArcGis server api for flex widget的 理解

第一  widget 面板裏面的切換

 

如  Bookmarks裏面的面板切換 如何實現？

 

如果要使用 esri 的模板 那麼 一定要繼承BaseWidget

定義狀態

    <viewer:states>
        <s:State name="first"/>
        <s:State name="second"/>
        <s:State name="third"/>       
    </viewer:states>

我這裏定義了三個 狀態 對應三組面板 。 注意 這裏定義的狀態 是爲了 和後面的 group  綁定 。在 設置不同的狀態 可以 讓 綁定的 group  可見。

 

對每個面板 設置 圖片 標題 ， 以及點擊標題之後的處理事件

設置

wTemplate.addTitlebarButton(ICON_URL + "i_searchgraphical.png", "aaaa", show1);              
               
wTemplate.addTitlebarButton(ICON_URL + "i_searchtext.png", "bbbb", show2);
               
wTemplate.addTitlebarButton(ICON_URL + "i_table.png", "cccc", show3);

 

show1 事件 目的 是讓當前狀態激活狀態 設置成 firt 。

public function show1():void
            {
                Alert.show("aaa");
            this.currentState="first";
            }
            public function show2():void
            {
                Alert.show("bbb");
                this.currentState="second";
            }
            public function show3():void
            {
                Alert.show("ccc");
                this.currentState="third";
            }

 

 

 

 

<viewer:WidgetTemplate id="wTemplate"
                           width="300" height="300"
                          >
       
        <s:Group  id="first" width="100%" height="100%"  includeIn="first">
            <s:Label text="first" visible="false">
               
            </s:Label>
        </s:Group>
        <s:Group  id="second" width="100%" height="100%" includeIn="second">
            <s:layout>
                <s:VerticalLayout horizontalAlign="center" verticalAlign="middle">
                   
                </s:VerticalLayout>
            </s:layout>
           
            <s:Scroller width="100%" height="100%">   
            </s:Scroller>
           
            <!--<HelloWorld:PersonItemRenderer mytext="abc" click="personitemrenderer1_clickHandler(event)"/>    -->
            <HelloWorld:PersonDataGroup id= "datarroup" dataProvider="{persons}" >     
                <HelloWorld:layout>
                    <s:VerticalLayout gap="2"
                                      horizontalAlign="justify"
                                      useVirtualLayout="true"/>
                </HelloWorld:layout>
                </HelloWorld:PersonDataGroup>
       
            <s:Label text="second">
               
            </s:Label>
        </s:Group>
        <s:Group  id="third" width="100%" height="100%"  includeIn="third">
            <s:layout>
                <s:VerticalLayout horizontalAlign="center" verticalAlign="middle">
                   
                </s:VerticalLayout>
            </s:layout>
            <s:Label text="third">
               
            </s:Label>
        </s:Group>       
        </viewer:WidgetTemplate>

 

使用 esri 的模板 WidgetTemplate 這裏 定義了<viewer:WidgetTemplate id="wTemplate"> 注意 這裏的id 屬性 wTemplate

在定義標籤時使用過

wTemplate.addTitlebarButton(ICON_URL + "i_searchgraphical.png", "aaaa", show1);  

 

下面看看這裏的group  是怎麼回事

這裏 要設置 成三組 ，group  是一個容器 ，你可以使用其他的容器 不一定非要使用group

 

includeIn="first" 目的 是讓 group  和狀態 first 綁定

 

visible="false" 的目的是爲了實現 業務邏輯，只要某些條件滿足時才讓他們顯示 。