Flex ColorPicker从xml加载颜色

时间:2010-02-02 23:13:16

标签: flex actionscript-3

我有一个颜色选择器,我希望从外部xml加载颜色,我的xml看起来像这样

<colors>
        <color label="Aqua" colorHex="0xFFFFCC"/>
        <color label="Forest Green" colorHex="0xCCFF00"/>
        <color label="Kelly Green" colorHex="0xCCFF00"/>
        <color label="Royal Blue" colorHex="0xCCFF00"/>
        <color label="Columbia Blue" colorHex="0xCCFF00"/>
        <color label="Navy Blue" colorHex="0xCCFF00"/>
        <color label="Purple" colorHex="0xCCFF00"/>
        <color label="Maroon" colorHex="0xCCFF00"/>
        <color label="Cardinal" colorHex="0xCCFF00"/>
        <color label="Garnet" colorHex="0xCCFF00"/>
        <color label="Red" colorHex="0xCCFF00"/>
        <color label="Orange" colorHex="0xCCFF00"/>
        <color label="Texas Orange" colorHex="0xCCFF00"/>
        <color label="Light Gold" colorHex="0xCCFF00"/>
        <color label="Vega Gold" colorHex="0xCCFF00"/>
        <color label="Brown" colorHex="0xCCFF00"/>
        <color label="Black" colorHex="0xCCFF00"/>
        <color label="Silver" colorHex="0xCCFF00"/>
        <color label="White" colorHex="0xCCFF00"/>
        <color label="Pink" colorHex="0xCCFF00"/>
    </colors>

所以我加载了xml,添加到xml类型的可绑定变量中,并添加到colorpicker的dateprovider中,如下所示

[Bindable] private var colorsDp:XML;

colorsDP = XML(loader.data);// the loader is an object that has the xml loaded

<mx:ColorPicker id="cp" dataProvider="{colorsDp}" labelField="label" colorField="colorHex" editable="false"/>

文档说我可以将dataprovider用作xml,array,arrayCollection,xmlListColletion等,因为dataprovider将数据转换为ICollectionView,但不起作用,为什么??

1 个答案:

答案 0 :(得分:0)

我能够通过将ColorPicker的dataProvider绑定到一个对象数组来实现它。

MXML和ActionScript代码:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
                initialize="init(event)" 
                layout="absolute" >

    <mx:Script>
            <![CDATA[
                import mx.collections.ArrayCollection;
                import mx.collections.XMLListCollection;
                import mx.controls.Alert;
                import mx.rpc.events.FaultEvent;
                import mx.rpc.events.ResultEvent;

                private var colors:XMLListCollection;
                [Bindable] private var colorsArray:Array;

                private function init(evt:Event):void
                {
                    XMLService.send();
                }

                private function xmlService_result(evt:ResultEvent):void
                {
                    colors = new XMLListCollection(evt.result.color);
                    colorsArray = new Array(colors.toArray());
                    var numOfColors:int = colors.length;
                    for (var i:uint = 0; i < numOfColors; ++i) 
                    { 
                        var colorXML:XML = colors.getItemAt(i) as XML;
                        var colorObject:Object = new Object();
                        colorObject.name = colorXML.attribute('label');
                        colorObject.value = colorXML.attribute('colorHex');
                        colorsArray.push(colorObject);
                    }

                }

                private function xmlService_fault(evt:FaultEvent):void
                {
                    Alert.show('Failed to load external XML data:\n'+evt.fault.faultString);
                }

            ]]>
    </mx:Script>

    <mx:HTTPService id="XMLService" 
                    url="colors.xml" 
                    result="xmlService_result(event)"
                    resultFormat="e4x" 
                    fault="xmlService_fault(event)" />

    <mx:ColorPicker id="colorPicker" 
                    colorField="value" 
                    labelField="name" editable="false"
                    dataProvider="{colorsArray}"/>

</mx:Application>

为了使其工作,您必须在与应用程序的主MXML文件相同的目录中有一个名为colors.xml的XML文件。我的colors.xml的标记如下:

<?xml version="1.0" encoding="utf-8"?>
<colors>
    <color label="Aqua" colorHex="0xFFFFCC"/>
    <color label="Forest Green" colorHex="0x228B22"/>
    <color label="Kelly Green" colorHex="0x00A000"/>
    <color label="Royal Blue" colorHex="0x4169E1"/>
    <color label="Columbia Blue" colorHex="0x75B2DD"/>
    <color label="Navy Blue" colorHex="0x23238E"/>
    <color label="Purple" colorHex="0x800080"/>
    <color label="Maroon" colorHex="0x800000"/>
    <color label="Cardinal" colorHex="0xC41E3A"/>
    <color label="Garnet" colorHex="0xb3005b"/>
    <color label="Red" colorHex="0xFF0000"/>
    <color label="Orange" colorHex="0xFFA500"/>
    <color label="Texas Orange" colorHex="0xffa500"/>
    <color label="Light Gold" colorHex="0xFD9202"/>
    <color label="Vega Gold" colorHex="0xD9D919"/>
    <color label="Brown" colorHex="0xA52A2A"/>
    <color label="Black" colorHex="0x000000"/>
    <color label="Silver" colorHex="0xC0C0C0"/>
    <color label="White" colorHex="0xFFFFFF"/>
    <color label="Pink" colorHex="0xFFC0CB"/>
</colors>