Paul Stearns
Paul Stearns

Reputation: 906

Using ActionScript to modify label on a flex hslider

I have an HSlider that has two labels, a starting year, and ending year. the ending year increments everytime a year is closed and I would like the the label on the slider to show the latest closed year.

I have tried changing the slider.labels[1] & it changes the value when I look at it in debug, but not on the screen. I tried a bindable variable, again I can see the labels[1] change in debug but the value isn't displayed on the screen.

hsStart.labels[0] = acResult[0].RATE_MIN;
hsStart.labels[1] = acResult[0].UP_RANGE;

or

_aryLabels[0] = acResult[0].RATE_MIN;
_aryLabels[1] = acResult[0].UP_RANGE;
hsStart.invalidateDisplayList();

<mx:HSlider minimum="1981" maximum="2000" snapInterval="1" id="hsStart" tickInterval="4" liveDragging="true" labels="{_aryLabels}" 
    width="527" thumbCount="2" change="updateYear(event);" dataTipFormatFunction="formatSlider" allowThumbOverlap="true" horizontalCenter="190" top="118"
    sliderThumbClass="Classes.Input.BigThumbClass"  fillColors="[0xff0000, 0x00ff00, 0xff0000, 0x00ff00]"/>

This seems so simple, anyone have any ideas?

Paul

Upvotes: 0

Views: 474

Answers (1)

Anton
Anton

Reputation: 4684

You could do it in this way:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
            layout="absolute" minWidth="955" minHeight="600" creationComplete="init()">
<mx:Script>
    <![CDATA[
        [Bindable]private var lastYear:int = 2008;

        private function init():void
        {
            updateLabels();
        }

        protected function onIncYear(event:MouseEvent):void
        {
            lastYear++;
            hsStart.maximum = lastYear;
            updateLabels();
        }

        private function updateLabels():void
        {
            hsStart.labels = [hsStart.minimum, hsStart.maximum];
        }
    ]]>
</mx:Script>

<mx:HSlider 
    id="hsStart"
    minimum="1981" 
    maximum="{lastYear}" 
    snapInterval="1"  
    tickInterval="4" 
    liveDragging="true" 
    width="527" 
    thumbCount="2" 
    allowThumbOverlap="true" 
    horizontalCenter="190" 
    top="118"
    fillColors="[0xff0000, 0x00ff00, 0xff0000, 0x00ff00]"/>

<mx:Button x="698" y="36" label="Increment Year" click="onIncYear(event)"/>

</mx:Application>

Upvotes: 1

Related Questions