一、概述

在上文《深入浅出Flex Viewer(二)——体系结构》中,笔者详细介绍了到Flex Viewer框架,使得读者能够对该框架源代码的关键目录和文件结构和这些文件中所包含或涉及到的系统的哪些构件;以及这些构件间的逻辑关系和连接这些构件所用的关键技术,如:消息总线(EventBus)、配置项管理(Config Manager)、数据共享机制(DataManager)等内容有一个大概地了解。在本文中将继续介绍Flex Viewer中框架配置技术的设计和实现原理,及其和框架其它组件间的关系。

二、框架配置技术是什么

框架配置是Flex Viewer中的一大特色,它能够通过一些简单的配置就能在无需修改框架源代码或重新编译的情况下对系统的参数进行修改,或对框架功能进行快速地扩展,从而可以保证框架始终都具备一个非常稳定的架构的同时还能够满足一定范围内需求的变化。

Flex Viewer中的框架配置技术主要体现在两个方面,即框架级配置和Widget级配置,其中Widget配置将在《深入浅出Flex Viewer (五)——Widget的原理》中介绍,而本文将集中介绍框架级配置。

Flex Viewer中的框架配置功能的核心是位于框架代码根目录下的congfig.xml文件,使用者可以使用规定的语法在该xml文件中对框架的初始化参数进行配置,例如,应用程序的标题、样式风格、地图、图层、Widget等。


<?xml version="1.0" ?>
<!--
////////////////////////////////////////////////////////////////////////////////
//
// Copyright (c) 2010-2011 ESRI
//
// All rights reserved under the copyright laws of the United States.
// You may freely redistribute and use this software, with or
// without modification, provided you include the original copyright
// and use restrictions. See use restrictions in the file:
// <install location>/License.txt
//
// Read more about ArcGIS Viewer for Flex 2.3 - http://links.esri.com/flexviewer
//
////////////////////////////////////////////////////////////////////////////////
-->
<configuration>
<title>ArcGIS Viewer for Flex</title>
<subtitle>a configurable web mapping application</subtitle>
<logo>assets/images/logo.png</logo>
<style>
<colors>0xFFFFFF,0x333333,0x101010,0x000000,0xFFD700</colors>
<alpha>0.8</alpha>
</style>
<!-- replace the following url with your own geometryservice -->
<geometryservice url="http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer" />
<!-- replace the following key with your own Bing key -->
<bing key="Ahw1due6dkmZg98wUJJYLrVmYlDik4oleCg6hoNqx6l2jFYRToImQH1HfH-asjjH"/> <!-- UI elements -->
<widget left="10" top="50" config="widgets/Navigation/NavigationWidget.xml" url="widgets/Navigation/NavigationWidget.swf"/>
<widget right="-2" bottom="-2" config="widgets/OverviewMap/OverviewMapWidget.xml" url="widgets/OverviewMap/OverviewMapWidget.swf"/>
<widget right="20" top="55" config="widgets/MapSwitcher/MapSwitcherWidget.xml" url="widgets/MapSwitcher/MapSwitcherWidget.swf"/>
<widget left="0" top="0" config="widgets/HeaderController/HeaderControllerWidget.xml" url="widgets/HeaderController/HeaderControllerWidget.swf"/> <map wraparound180="true" initialextent="-14083000 3139000 -10879000 5458000" fullextent="-20000000 -20000000 20000000 20000000" top="40">
<basemaps>
<layer label="Streets" type="tiled" visible="true"
url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
<layer label="Aerial" type="tiled" visible="false"
url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"/>
<layer label="Topo" type="tiled" visible="false"
url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>
</basemaps>
<operationallayers>
<layer label="Demographics" type="tiled" visible="false" alpha="0.5"
url="http://server.arcgisonline.com/ArcGIS/rest/services/Demographics/USA_Median_Household_Income/MapServer">
<sublayer id="1" popupconfig="popups/PopUp_Demographics_BlockGroups.xml"/>
<sublayer id="2" popupconfig="popups/PopUp_Demographics_Tracts.xml"/>
<sublayer id="3" popupconfig="popups/PopUp_Demographics_Counties.xml"/>
<sublayer id="4" popupconfig="popups/PopUp_Demographics_States.xml"/>
</layer>
<layer label="Boundaries and Places" type="tiled" visible="false"
url="http://server.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places_Alternate/MapServer"/>
<layer label="Fires" type="feature" visible="false" alpha="1.0"
popupconfig="popups/PopUp_Fires.xml"
url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Fire/Sheep/FeatureServer/0"/>
</operationallayers>
</map> <!-- widgets organized into widget containers that manage close/open etc -->
<!-- supported layout property options: horizontal(default)|float|vertical|fix-->
<widgetcontainer layout="float">
<widget label="Bookmarks" left="430" top="90"
icon="assets/images/i_bookmark.png"
config="widgets/Bookmark/BookmarkWidget.xml"
url="widgets/Bookmark/BookmarkWidget.swf"/>
<widget label="Find an address" left="100" top="90" preload="open"
icon="assets/images/i_target.png"
config="widgets/Locate/LocateWidget_Bing.xml"
url="widgets/Locate/LocateWidget.swf"/>
<widget label="Louisville Police" left="590" top="280"
icon="assets/images/i_police.png"
config="widgets/Query/QueryWidget_Louisville_PoliceStations.xml"
url="widgets/Query/QueryWidget.swf"/>
<widget label="Search" left="80" top="280"
icon="assets/images/i_search.png"
config="widgets/Search/SearchWidget_Louisville.xml"
url="widgets/Search/SearchWidget.swf"/>
<widget label="Earthquakes (GeoRSS)" left="410" top="280"
icon="assets/images/i_rss.png"
config="widgets/GeoRSS/GeoRSSWidget.xml"
url="widgets/GeoRSS/GeoRSSWidget.swf"/>
<widget label="Draw and Measure" left="60" top="400"
icon="assets/images/i_draw2.png"
config="widgets/Draw/DrawWidget.xml"
url="widgets/Draw/DrawWidget.swf"/>
<widget label="Print" left="390" top="400"
icon="assets/images/i_print.png"
config="widgets/Print/PrintWidget.xml"
url="widgets/Print/PrintWidget.swf"/> <!--
<widget label="My first widget"
icon="assets/images/i_widget.png"
config="widgets/Samples/HelloWorld/HelloWorldWidget.xml"
url="widgets/Samples/HelloWorld/HelloWorldWidget.swf"/>
-->
</widgetcontainer> </configuration>

代码1. config.xml

三、框架配置的实现原理

在框架中主要有六大组件,即ViewerContainer、ConfigManager、DataManager、MapManager、UIManager、WidgetManager(见《深入浅出Flex Viewer(二)——体系结构》)。在进行框架配置初始化的整个过程中,这些组件均有参与。从参与程度来看,ConfigManager是配置文件解析的核心类,ViewerContainer类的实例管理了其它组件实例,另外四个组件主要是使用ConfigManager中得到的configData(记录了xml文件中所有的相关参数)。那么,下面将深入剖析源代码来呈现配置文件初始化的整个过程。

在flex应用程序的入口文件index.mxml中,代码如下:


    <viewer:ViewerContainer>
<viewer:configManager>
<managers:ConfigManager/>
</viewer:configManager>
<viewer:dataManager>
<managers:DataManager/>
</viewer:dataManager>
<viewer:mapManager>
<managers:MapManager/>
</viewer:mapManager>
<viewer:uiManager>
<managers:UIManager/>
</viewer:uiManager>
<viewer:widgetManager>
<managers:WidgetManager/>
</viewer:widgetManager>
</viewer:ViewerContainer>

代码2.index.mxml

在以上代码中,ViewerContainer的实例管理了其它的组件,在各类实例的初始化时,其初始化的顺序如下(由于DataManager、MapManager、UIManager、WidgetManager等四类在框架配置过程中的地位相同,均是配置参数的使用方,所以在下表中仅列DataManager):

顺序号

ViewerContainer

ConfigManager

DataManager

1

创建实例 
xml配置文件地址的来源: 
A、直接硬编码 
B、从url参数中解析出配置文件地址
   

2

 

创建实例

监听事件:

ViewerContainer.CONTAINER_INITIALIZED

 

3

   

创建实例:

监听:

AppEvent.CONFIG_LOADED

AppEvent.DATA_FETCH_ALL

AppEvent.DATA_PUBLISH

AppEvent.DATA_FETCH

4

Init

监听:

AppEvent.APP_ERROR

AppEvent.CONFIG_LOADED

   

5

事件发布:

ViewerContainer.CONTAINER_INITIALIZED

   

6

 

处理事件:

ViewerContainer.CONTAINER_INITIALIZED

Init:

config:加载并解析ViewerContainer中设置的配置文件 ,最后填入configData变量

 

7

 

事件发布:

AppEvent.CONFIG_LOADED (configData)

 

8

   

接收并处理事件:

AppEvent.CONFIG_LOADED

当ConfigManager中发布事件AppEvent.CONFIG_LOADED的同时将从配置文件中解析出来的配置参数变量configData作为事件参数发布到消息总线上,然后凡是订阅了该消息的组件均会在其相应的事件处理函数中接收到configData变量,从而对其自身进行初始化。

这便是框架配置初始化的全部过程。

本文原创发表于 博客园,作者为 乐水鱼,博客 http://www.cnblogs.com/wowMVP

Flex Viewer(三)——Config的原理的更多相关文章

  1. Flex Viewer (二)——体系结构

    一.概述 在上一篇文章<深入浅出Flex Viewer (一)——概述>中,笔者对Flex Viewer用于构建以地图为中心的富客户端(RIA)应用的原型的功能和价值做了简要地介绍.在本文 ...

  2. Flex Viewer(二) 体系结构

    一.概述 在上一篇文章<深入浅出Flex Viewer (一)——概述>中,笔者对Flex Viewer用于构建以地图为中心的富客户端(RIA)应用的原型的功能和价值做了简要地介绍.在本文 ...

  3. Flex Viewer

    一.Flex Viewer简介 Flex Viewer是ESRI公司推出的可以高效开发基于WEB的地理信息应用系统的一种完全免费的应用程序框架.业务人员使用该框架可以无需任何额外的编程就能够通过简单配 ...

  4. Spring Boot干货系列:(三)启动原理解析

    Spring Boot干货系列:(三)启动原理解析 2017-03-13 嘟嘟MD 嘟爷java超神学堂 前言 前面几章我们见识了SpringBoot为我们做的自动配置,确实方便快捷,但是对于新手来说 ...

  5. TCP三次握手原理详解

    TCP/IP协议不是TCP和IP这两个协议的合称,而是指因特网整个TCP/IP协议族. 从协议分层模型方面来讲,TCP/IP由四个层次组成:网络接口层.网络层.传输层.应用层. TCP协议:即传输控制 ...

  6. 【Unity Shader】(三) ------ 光照模型原理及漫反射和高光反射的实现

    [Unity Shader](三) ---------------- 光照模型原理及漫反射和高光反射的实现 [Unity Shader](四) ------ 纹理之法线纹理.单张纹理及遮罩纹理的实现 ...

  7. 深入理解NIO(三)—— NIO原理及部分源码的解析

    深入理解NIO(三)—— NIO原理及部分源码的解析 欢迎回到淦™的源码看爆系列 在看完前面两个系列之后,相信大家对NIO也有了一定的理解,接下来我们就来深入源码去解读它,我这里的是OpenJDK-8 ...

  8. TCP三次握手原理

    本文主要讲述的是 1.TCP协议三次握手原理,以及为什么要三次握手,两次握手带来的不利后果. 2.TCP协议四次挥手原理,为什么要四次挥手. TCP协议三次握手原理: 首先,给张图片,建立TCP三次握 ...

  9. 【转】Spring Boot干货系列:(三)启动原理解析

    前言 前面几章我们见识了SpringBoot为我们做的自动配置,确实方便快捷,但是对于新手来说,如果不大懂SpringBoot内部启动原理,以后难免会吃亏.所以这次博主就跟你们一起一步步揭开Sprin ...

随机推荐

  1. PHP的学习--Traits新特性

    在阅读yii2源码的时候接触到了trait,就学习了一下,写下博客记录一下. 自 PHP 5.4.0 起,PHP 实现了代码复用的一个方法,称为 traits. Traits 是一种为类似 PHP 的 ...

  2. Django快速开发之投票系统

    https://docs.djangoproject.com/en/1.8/intro/tutorial01/ 参考官网文档,创建投票系统. ================ Windows  7/1 ...

  3. Arctext.js - 基于 CSS3 & jQuery 的文本弯曲效果

    Arctext.js 是基于 Lettering.js 的文本旋转插件,根据设置的旋转半径准确计算每个字母的旋转弧度并均匀分布.虽然 CSS3 也能够实现字符旋转效果,但是要让安排每个字母都沿着弯曲路 ...

  4. Java判断回文数算法简单实现

    好久没写java的代码了, 今天闲来无事写段java的代码,算是为新的一年磨磨刀,开个头,算法是Java判断回文数算法简单实现,基本思想是利用字符串对应位置比较,如果所有可能位置都满足要求,则输入的是 ...

  5. Windows Azure Active Directory (3) China Azure AD增加新用户

    <Windows Azure Platform 系列文章目录> 本文介绍的是国内由世纪互联运维的China Azure. 本文是对笔者之前的文档:Windows Azure Active ...

  6. [Azure附录]1.在Windows Server 2012中安装Active Directory域服务

    <Windows Azure Platform 系列文章目录> 1.登陆Windows Server 2012,打开服务器管理器,选择"添加角色和功能" 2.在&quo ...

  7. JavaScript之旅(三)

    JavaScript之旅(三) 三.函数 在JavaScript中,定义函数的方式如下: function abs(x) { ... return ...; } 如果没有return,返回结果为und ...

  8. HTML5的WebGL实现的3D和2D拓扑树

    在HT for Web中2D和3D应用都支持树状结构数据的展示,展现效果各异,2D上的树状结构在展现层级关系明显,但是如果数据量大的话,看起来就没那么直观,找到指定的节点比较困难,而3D上的树状结构在 ...

  9. RabbitMQ入门教程——发布/订阅

    什么是发布订阅 发布订阅是一种设计模式定义了一对多的依赖关系,让多个订阅者对象同时监听某一个主题对象.这个主题对象在自身状态变化时,会通知所有的订阅者对象,使他们能够自动更新自己的状态. 为了描述这种 ...

  10. C#的变迁史 - C# 4.0篇

    C# 4.0 (.NET 4.0, VS2010) 第四代C#借鉴了动态语言的特性,搞出了动态语言运行时,真的是全面向“高大上”靠齐啊. 1. DLR动态语言运行时 C#作为静态语言,它需要编译以后运 ...