Flex Slider: How to differentiate between programmatic versus user change

Question

I am using HSlider to implement a one-thumb slider control. The thumb position is updated by a timer. However, the user can also update the thumb position by either clicking on a position in the slider track, or by dragging the thumb.

Judging by the Flex documentation, I figured all I needed to do was write a handler for the change event. The docs say:

change Event Event Object Type: mx.events.SliderEvent property SliderEvent.type = mx.events.SliderEvent.CHANGE

Dispatched when the slider changes value due to mouse or keyboard interaction.

I wrote my code as follows:

<mx:HSlider thumbPress="handleThumbPress(event)" change="handleUserChange(event)"
    showTrackHighlight="true" buttonMode="true" useHandCursor="true" minimum="0" 
    maximum="{_max}" snapInterval="1" enabled="true" width="100%" id="mySlider"
    liveDragging="false" showDataTip="true" verticalCenter="0" horizontalCenter="0" 
    trackSkin="{SliderTrack}" trackHighlightSkin="{TrackHighlightConfigurable}"
    sliderThumbClass="{MySliderThumb}" thumbSkin="@Embed('../imgempty.png')"
    dataTipFormatFunction="dataToolTipFormat"/>

What I observe is that my change handler, which is only supposed to be invoked in response to user interaction keeps getting invoked whenever my timer sets the value of the slider. The timer code sets the values quite simply as:

private function updateValue( newValue : Number ) : void
{
    mySlider.value = newValue;
}

Am I making an obvious mistake? Is there a better way to distinguish between user versus programmatic change of Flex Slider?

Thanks.

-Raj

Answer 1

You could just put a boolean wrapping when you set the value programmatically:

private var inputByUser:Boolean = false;
private function updateValue( newValue : Number ) : void
{
    if (!inputByUser)
        mySlider.value = newValue;
}

I don't know your exact code so I couldn't solve it explicitly, but something along those lines is what I'd do. You'd set that inputByUser in your change handler, like so:

private function changeHandler() : void
{
    inputByUser = true;
    updateValue(mySlider.value + 10); // however you're doing it
    inputByUser = false;
}

Hope that helps, Lance