Flex 处理数据访问 XML 数据

最新推荐文章于 2024-01-07 10:35:02 发布

原创最新推荐文章于 2024-01-07 10:35:02 发布 · 127 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#XML #Flex #数据结构 #ActionScript #Adobe

Flex 专栏收录该内容

17 篇文章

订阅专栏

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="500" height="470"
    creationComplete="myDataGrid.selectedIndex=0;"
>

    <mx:Script>
        <![CDATA[        
            // Model: XML structure describing 
            // some of the books in my collection.    
            [Bindable]

            private var myBooks:XML = 
                <books>
                    <book ISBN="1590595181">

                        <title>Foundation ActionScript Animation: Making Things Move</title>
                        <author>Keith Peters</author>
                        <amazonUrl>http://tinyurl.com/npuxt</amazonUrl>

                    </book>
                    <book ISBN="1582346194">
                        <title>Send in the Idiots: Stories from the Other Side of Autism</title>

                        <author>Kamran Nazeer</author>
                        <amazonUrl>http://tinyurl.com/lo5ts</amazonUrl>
                    </book>

                </books>
        ]]>
    </mx:Script>
    
    <!-- Keep track of the currently selected book -->
    <mx:Number id="selectedBookIndex">{myDataGrid.selectedIndex}</mx:Number>

    
    <!-- User interface -->
    <mx:Panel 
        title="Assigning XML data"
        paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"
    >

        <!-- Master view: Display all books -->
        <mx:DataGrid id="myDataGrid" dataProvider="{myBooks.book}">

            <mx:columns>
                <mx:DataGridColumn dataField="@ISBN" headerText="ISBN" width="85"/>
                <mx:DataGridColumn dataField="title" headerText="Title"/>

                <mx:DataGridColumn dataField="author" headerText="Author"/>
                <mx:DataGridColumn dataField="amazonUrl" headerText="Web site">

                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:LinkButton
                                label="Visit"
                                click="navigateToURL(new URLRequest(data.amazonUrl), 'blank');"
                            />                                    
                        </mx:Component>

                    </mx:itemRenderer>                        
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
        
        <!-- Detail view: Display currently selected book for editing -->

        <mx:Form width="100%" autoLayout="false">
            <mx:FormHeading label="Edit book details"/>

            <mx:FormItem label="ISBN:" width="100%">
                <mx:TextInput 
                    id="isbnInput" 
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].@ISBN}"
                    change="{myBooks.book[selectedBookIndex].@ISBN = isbnInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Title:" width="
    100%">
                <mx:TextInput 
                    id="titleInput" 
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].title}"
                    change="{myBooks.book[selectedBookIndex].title = titleInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Author:" width="100%">
                <mx:TextInput 
                    id="authorInput"
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].author}"
                    change="{myBooks.book[selectedBookIndex].author = authorInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Amazon Url" width="100%">
                <mx:TextInput 
                    id="amazonUrlInput"
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].amazonUrl}"
                    change="{myBooks.book[selectedBookIndex].amazonUrl = amazonUrlInput.text}"
                />

            </mx:FormItem>        
        </mx:Form>
    </mx:Panel>
</mx:Application>

Actionscript 3.0组类基于ECMAScript for XML(E4X)说明(ECMA-357 2第二版)。这些类功能强大，使用简单，对处理XMLdata数据非常有用。相比以前的编程技术使用E4X的开发代码使得XML数据更快。

介绍XML
对XML元素与属性赋值
通过传递数据引用创建XML对象
装配与改变XML对象
查询XML数据

介绍XML
许多服务器端应用程序使用XML数据结构，那么你可以在ActionScript中使用XML类来创建优雅的富互联网应用程序。例如那些链接到Web service的应用。web service是连接应用程序的重要的方法，例如，一个Adobe Flash Player9 应用程序和一个在web服务器上的应用程序通过公共标准，例如Simple Object Access Protocol(SOAP)

在Adobe Flex中，ECMAScript for XML说明书定义了一系列的类和功能来处理XML数据。这些类和函数的集合被称为E4X.两个主要的类是XML和XMLList。

注意：在ActionScript 2.0中有一个XML类。在ActionScript 3.0中，它被重命名为XMLDocument这样就不会与新的，作为E4X一部分的XML类发生冲突了。在ActionScript 3.0中，上一个版本遗留的类——XMLDocument,XMLNode,XMLParser和XMLTag——都被包含在flash.xml包中，主要是为了向下兼容。E4X类是核心类；你需要导入包才能使用他们。本快速说明没有设计对传统的ActionScript 2.0的类逐一细说。想了解他们，查看flash.xml包，在Flex 3 Language Reference中

在下边的例子中，你创建了一个XML文档，命名为myBooks。创建一个XML文档在ActionScript，通过在Actionscript块中书写XML并赋值给一个变量。由于在Flex中，XML是本地数据类型，就像Number或Boolean一样。

myBooks的XML文档包含两个book元素(element)（也被称为node（节点））。第一个book元素拥有4个子元素，名称值title,author,amazonUrl和pageCount。

要通过XML实例访问元素，使用点标示（.）就像存取一个对象的属性一样。那么，举个例子，要获得book节点的引用，你要写成myBooks.book。这就返回了一个XMLList时间，他包含了myBooks的XML中的2个book节点。要存取列表中指定节点，你需要使用数组表示法。例如，要获得第一本数节点的引用，可以写为myBooks.book[0]。如果你使用过ActionScript中的对象和数组，你应该对点操作符和数组语法风格比较熟悉。然而，E4X比这更进一步，可以按指定属性名在XML中搜索节点。

下边的例子中，使用搜索ISBN属性获得第一本书的引用。属性在 E4X中at-sign(@)为前缀描述属性，写为@ISBN。语句myBooks.book.(@ISBN==”159059181”)翻译为“找到一个属性ISBN值等于159059181的book节点”。另一个例子描述更高级的查找技术。

例子

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="440" height="400"    
    initialize="initializeHandler();"
>

    <mx:Script>
        <![CDATA[
        
            [Bindable] public var a:XMLList; 
            [Bindable] public var b:XMLList;
            [Bindable] public var c:XMLList;
            [Bindable] public var d:XMLList;

            // Model: XML structure describing 
            // some of the books in my collection.    
            [Bindable]
            private var myBooks:XML = 
                <books>

                    <book ISBN="1590595181">
                        <title>Foundation ActionScript Animation: Making Things Move</title>
                        <author>Keith Peters</author>

                        <amazonUrl>http://tinyurl.com/npuxt</amazonUrl>
                        <pageCount>470</pageCount>
                    </book>

                    <book ISBN="1582346194">
                        <title>Send in the Idiots: Stories from the Other Side of Autism</title>

                        <author>Kamran Nazeer</author>
                        <amazonUrl>http://tinyurl.com/lo5ts</amazonUrl>
                        <pageCount>500</pageCount>

                    </book>
                </books>
            
            private function initializeHandler():void

            {
                // An XML list that contains both book nodes.                
                a = myBooks.book; 
                
                // Keith Peters         
                b = myBooks.book[0].author;
                
                // 470

                c = myBooks.book.(@ISBN=="1590595181").pageCount;

                // Delete the first book node.
                delete myBooks.book[0];
                
                // Send in the Idiots...
                d = myBooks.book[0].title; 
            }
        ]]>
    </mx:Script>

    
    <!-- User interface -->
    <mx:Panel 
        title="XML lookup results"
        paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10">

        <mx:Text text="{'a: ' + a}" width="300"/>
        <mx:Label text="{'b: ' + b}"/>        
        <mx:Label text="{'c: ' + c}"/>

        <mx:Label text="{'d: ' + d}"/>
    </mx:Panel>

</mx:Application>

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="500" height="470"
    creationComplete="myDataGrid.selectedIndex=0;"
>

    <mx:Script>
        <![CDATA[        
            // Model: XML structure describing 
            // some of the books in my collection.    
            [Bindable]

            private var myBooks:XML = 
                <books>
                    <book ISBN="1590595181">

                        <title>Foundation ActionScript Animation: Making Things Move</title>
                        <author>Keith Peters</author>
                        <amazonUrl>http://tinyurl.com/npuxt</amazonUrl>

                    </book>
                    <book ISBN="1582346194">
                        <title>Send in the Idiots: Stories from the Other Side of Autism</title>

                        <author>Kamran Nazeer</author>
                        <amazonUrl>http://tinyurl.com/lo5ts</amazonUrl>
                    </book>

                </books>
        ]]>
    </mx:Script>
    
    <!-- Keep track of the currently selected book -->
    <mx:Number id="selectedBookIndex">{myDataGrid.selectedIndex}</mx:Number>

    
    <!-- User interface -->
    <mx:Panel 
        title="Assigning XML data"
        paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"
    >

        <!-- Master view: Display all books -->
        <mx:DataGrid id="myDataGrid" dataProvider="{myBooks.book}">

            <mx:columns>
                <mx:DataGridColumn dataField="@ISBN" headerText="ISBN" width="85"/>
                <mx:DataGridColumn dataField="title" headerText="Title"/>

                <mx:DataGridColumn dataField="author" headerText="Author"/>
                <mx:DataGridColumn dataField="amazonUrl" headerText="Web site">

                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:LinkButton
                                label="Visit"
                                click="navigateToURL(new URLRequest(data.amazonUrl), 'blank');"
                            />                                    
                        </mx:Component>

                    </mx:itemRenderer>                        
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
        
        <!-- Detail view: Display currently selected book for editing -->

        <mx:Form width="100%" autoLayout="false">
            <mx:FormHeading label="Edit book details"/>

            <mx:FormItem label="ISBN:" width="100%">
                <mx:TextInput 
                    id="isbnInput" 
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].@ISBN}"
                    change="{myBooks.book[selectedBookIndex].@ISBN = isbnInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Title:" width="
    100%">
                <mx:TextInput 
                    id="titleInput" 
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].title}"
                    change="{myBooks.book[selectedBookIndex].title = titleInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Author:" width="100%">
                <mx:TextInput 
                    id="authorInput"
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].author}"
                    change="{myBooks.book[selectedBookIndex].author = authorInput.text}"
                />

            </mx:FormItem>
            <mx:FormItem label="Amazon Url" width="100%">
                <mx:TextInput 
                    id="amazonUrlInput"
                    width="100%"
                    text="{myBooks.book[selectedBookIndex].amazonUrl}"
                    change="{myBooks.book[selectedBookIndex].amazonUrl = amazonUrlInput.text}"
                />

            </mx:FormItem>        
        </mx:Form>
    </mx:Panel>
</mx:Application>

通过传递数据引用创建XML对象

前边介绍XML的例子展示了使用XML文档初始化XML对象的方法。当创建一个XML文档时，你也可以通过引用（来自其他变量的引用）传递数到XML对象中，通过大括号扩起来的变量值引用。

如果你创建的XML结构不是有效的XML，你会看到类型错误的运行时错误。

下边的例子动态的创建了一个XML对象。它基于用户提供的变量来创建属性名，属性值，标签名和标签内容。例子检查了TypeError的情况，通过使用try…catch块环绕XML初始化代码。

例子

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="500" height="400"    
    initialize="createXML();"
>
    <mx:Script>
        <![CDATA[
            [Bindable]
            public var xml:XML
                        
            private function createXML():void

            {
                try 
                {
                    // Create the XML object using the values provided
                    // by the user for the tag name, attribute name,
                    // attribute value and the tag's contents. 
                    xml = 
                        <{tagName.text} 
                            {attributeName.text}={attributeValue.text}

                        >
                            {content.text}
                        </{tagName.text}>;
                }
                catch (e:TypeError)

                {
                    // Type error encountered while trying to create the
                    // XML object. The form must not be valid. Inform 
                    // the user.
                    xml = <note>Fill the form to see the tag here.</note>;
                }

            }
        ]]>
    </mx:Script>
    
    <!-- User interface -->
    <mx:Panel 
        title="Passing XML data by reference"
        layout="horizontal"
    >

        <mx:Form>
            <mx:FormItem label="Tag name:">
                <mx:TextInput id="tagName" change="createXML();"/>                
            </mx:FormItem>

            <mx:FormItem label="Attribute name:">
                <mx:TextInput id="attributeName" change="createXML();"/>

            </mx:FormItem>
            <mx:FormItem label="Attribute value:">
                <mx:TextInput id="attributeValue" change="createXML();"/>                
            </mx:FormItem>

            <mx:FormItem label="Tag content:">
                <mx:TextInput id="content" change="createXML();"/>                
            </mx:FormItem>

            
            <mx:HRule width="100%"/>
            
            <!-- Display the resulting XML -->
            <mx:TextArea 
                editable="false" 
                width="300" height="50"
                text="{xml.toXMLString()}" 
            />

        </mx:Form>
    </mx:Panel>
</mx:Application>

对XML元素与属性赋值

使用@和点( . )操作符不只可以从XML结构中读取数据的值，也可以为其赋值。

在下边的例子中，创建一个XML结构master-detail视图。master视图包含一个DataGrid 组件，用来显示书的列表。detail视图包含控件，用来编辑master视图中当前选中的图书。

master 和detail视图使用数据绑定和E4X来读取和更新XML中的数据。

下边的例子通过一下方法使用E4X：

myBooks.book引用book元素的XMLList对象。
myBook.book[selectedBookIndex]引用当前被选中的book元素。
myBook.book[selectedBookIndex].title引用当前被选中book元素的子元素title

要使用当前被选中图书的title更新TestInput控件tiltleInput，需要绑定TestInput控件tiltleInput的text属性到myBooks.book[selectedBookIndex].title。类似地，要使用用户最终输入更新XML，当TestInput控件tiltleInput的text属性改变时，将TestInput控件tiltleInput的text属性的值赋值给myBooks.book[selectedBookIndex].title。

detail视图中的另一个组件使用同样的方法正确的工作。

例子