Flex Viewer 開發教程（2）Widget配置檔案

gispace發表於2011-05-12
FlexView

在Flex Viewer的設計中，每個Widget都可以有一個配置檔案，來配置Widget所需要的各種資源，提倡的做法是配置檔名與Widget名稱保持一致，並且位於同一目錄下。當然，Widget的配置檔案不是必須的，當不需要配置資訊時，配置檔案可省略。在《Flex Viewer解析》中，我們以HelloWorldWidget為例，說明如何在Flash Builder中實現自定義Widget。下面我們同樣以HelloWorldWidget為例，來說明Widget如何從其配置檔案獲取資源資訊。

先來看一下HelloWorldWidget.xml，也就是配置檔案的內容：

<?xml version="1.0" ?>

<configuration>

    <hellocontent>Hello, Flex Viewer!</hellocontent>

</configuration>

再來看一下HelloWorldWidget的實現程式碼，如下：

<?xml version="1.0" encoding="utf-8"?>

<viewer:BaseWidget xmlns:fx="http://ns.adobe.com/mxml/2009"

                 xmlns:s="library://ns.adobe.com/flex/spark"

                 xmlns:mx="library://ns.adobe.com/flex/mx"

                 xmlns:viewer="com.esri.viewer.*"

                 layout="absolute" width="400" height="300"

                 widgetConfigLoaded="init()">①

    <fx:Script>

       <![CDATA[

           [Bindable]

           private var helloContent:String;

 

           private function init():void{②

              if (configXML){③

                  helloContent=String(configXML.hellocontent);④

              }

           }

       ]]>

    </fx:Script>

    <viewer:WidgetTemplate>

       <s:HGroup width="100%"

                height="100%"

                horizontalAlign="center"

                verticalAlign="middle">

           <s:Label text="{helloContent}"/>⑤

       </s:HGroup>

    </viewer:WidgetTemplate>

</viewer:BaseWidget>

①    widgetConfigLoaded事件

widgetConfigLoaded事件是BaseWidget中設計的一個事件，用來說明Widget對應的配置檔案已經成功讀取。通常在這個事件的響應方法中解析XML資料，獲取所需的資源資訊。如果自定義Widget需要配置檔案中的資訊，如①所示，設定widgetConfigLoaded事件的響應方法即可。

②   響應方法

widgetConfigLoaded事件的響應方法，在該方法中對XML配置資訊進行解析。

③   configXML物件

Widget配置檔案是一個XML文件，configXML是在BaseWidget中定義的XML物件，用來表示配置檔案的XML資料。通常，widgetConfigLoaded事件的響應方法中，直接訪問configXML即可。

④   解析配置資訊

從configXML中獲取所需資源資訊，此處是ActionScript中對於XML資料的操作，可參考相關教程。

⑤   使用配置資訊

配置資訊可以有多種使用方式，此處只是簡單的把字串資訊顯示出來。除此之外，配置資訊可以是各種資源的url、對Timer設定的時間間隔等等。

 
在具體系統的開發過程中，應儘可能多的將Widget用到的資源放到配置檔案中，這樣的話，即便在系統交付之後，使用者可以通過修改配置檔案達到特定需求，而不需要更改原始碼。下圖是HelloWorldWidget開啟時的畫面：

 

相關文章