Flex HSlider 工具提示数组填充

Question

我希望能够通过 Web 服务为 HSlider 填充工具提示数组。

下面是我的代码，我在这里所做的只是从 arrayValues 数组的 init() 函数中填充 anotherArray 只是为了测试那么多。

但是，当我启动应用程序时，anotherArray 仅包含“null”，而不包含其余数据。

有什么想法吗？

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:containers="com.dougmccune.containers.*" 
    backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#353535, #353535]" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.containers.Canvas;
            import mx.containers.Panel;
            import mx.controls.TextArea;
            import generated.webservices.*;

            import com.polecat.ui.customUIComponent.slider.SliderTrack;
            import com.polecat.ui.customUIComponent.slider.CSpSliderThumb;

            public var articlePanel:Panel;
            public var articleCanvas:Canvas;
            public var articleTextArea:TextArea;

            // create web service
            public var service:ICarouselService = new CarouselService();

            [Bindable]
            public var numResults:int = 0;

            // array to test slider


            var arrayValues:Array = ["null","January '08", "February '08", "March '08", "April '08", "May '08", "June '08", "July '08", "August '08",
                                        "September '08", "October '08", "November '08", "December '08"];

            [Bindable]
            public var anotherArray:Array = new Array();


            [Bindable]
            var gobbitArray:Array = ["null"];

            private function init() : void
            {
                service.addregisterSearchSetEventListener(registerSearchSetListener);
                service.addgetArticleSetEventListener(getArticleSetListener);

                // library_id
                //service.registerSearchSet(1);
                // need to wait here before calling next method
                // searchKey, startRecord, endRecord
                service.getArticleSet(1, 1, 2);
                for each(var s:String in arrayValues)
                {
                    anotherArray.push(s);
                }
            }

            // -- Our Event Handlers --

            private function registerSearchSetListener(event:RegisterSearchSetResultEvent):void
            {
                var searchData:SearchMetaData = event.result;
                numResults = searchData.noOfResults;
            }

            private function getArticleSetListener(event:GetArticleSetResultEvent):void
            {
                var searchData:Array = event.result;

                for each (var article:VisualisationArticle in searchData)
                {
                    // add the gobbit to the array
                    //var numGobbits:int = gobbitArray.push(article.gobbit);
                    //trace(numGobbits);

                    // CoverFlow stuff
                    articlePanel = new Panel();
                    articleTextArea = new TextArea();
                    articlePanel.addChild(articleTextArea);
                    articlePanel.title = article.title;
                    articleTextArea.text = article.sourceName + "\n" + article.url + "\n" + article.gobbit + "\n" + "Number of coverflow children: " + coverflow.numChildren + "\n" + "Size of searchData: " + searchData.length;
                    articlePanel.width = 200;
                    articlePanel.height = 200;

                    coverflow.addChild(articlePanel);

                }
            }       
        ]]>
    </mx:Script>
    <mx:Style>
        Panel {
           borderColor: #99CDEE;
           borderAlpha: 1;
           borderThickness: 1;
           borderThicknessLeft: 1;
           borderThicknessTop: 0;
           borderThicknessBottom: 1;
           borderThicknessRight: 1;
           roundedBottomCorners: false;
           cornerRadius: 5;
           headerColors: #b5e6f3, #81b3e6;
           dropShadowEnabled: false;
           titleStyleName: "mypanelTitle";
           vertical-align:middle;
           horizontal-align:center;
        }

        .mypanelTitle {
           letterSpacing: 1;
           color: #333333;
           fontSize: 12;
           fontWeight: bold;
        }
</mx:Style>
    <mx:VBox id="box" verticalGap="0" height="247" width="100%" maxWidth="600" maxHeight="300" >
            <containers:CoverFlowContainer id="coverflow" width="100%" height="244" 
                horizontalGap="40" borderStyle="inset" backgroundColor="0x000000"
                reflectionEnabled="true"/>


    </mx:VBox>
    <mx:Canvas width="599" height="146">
        <mx:HSlider id="s" 
            showDataTip="false" 
            values="{anotherArray}"
            creationComplete="{s.value=1}"
            snapInterval="1"
            minimum="1"
            maximum="{anotherArray.length-1}"
            liveDragging="true"
            trackSkin="{SliderTrack}"
            sliderThumbClass="{CSpSliderThumb}"
            width="502" x="48.5" y="10">
        </mx:HSlider>

            </mx:Canvas>


</mx:Application>

Answer 1

[Bindable]
public var numResults:int = 0;

// array to test slider

[Bindable] // you miss this line
var arrayValues:Array = ["null","January '08", "February '08", "March '08",
            "April '08", "May '08", "June '08", "July '08", 
            "August '08", "September '08", "October '08", 
            "November '08", "December '08"];

[Bindable]
public var anotherArray:Array = new Array();

Answer 2

Flex 对 Array 类型的数据绑定的支持是有限的。当您调用 Array.push() 时，HSlider 不会收到更改事件。我真的建议在几乎所有情况下都使用 ArrayCollection 而不是 Array。与应用程序中所有 UIComponents 的复杂性相比，开销确实可以忽略不计。