08
Oct
07

Changing the indeterminate move interval of a Flex ProgressBar control

The following example shows how you can change the move interval of an indeterminate progress bar in Flex by setting the indeterminateMoveInterval style.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/10/08/changing-the-indeterminate-move-interval-of-a-flex-progressbar-control/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:ApplicationControlBar dock="true">
        <mx:Label text="indeterminateMoveInterval:" />
        <mx:HSlider id="slider"
                minimum="20"
                maximum="200"
                value="50"
                liveDragging="true"
                snapInterval="1"
                tickInterval="10"
                dataTipPrecision="0" />
    </mx:ApplicationControlBar>

    <mx:ProgressBar id="progressBar"
            label="indeterminateMoveInterval = {slider.value}"
            labelPlacement="center"
            indeterminate="true"
            indeterminateMoveInterval="{slider.value}"
            trackHeight="64" />

</mx:Application>

View source is enabled in the following example.


5 Responses to “Changing the indeterminate move interval of a Flex ProgressBar control”


  1. 1 Kyle Hayes Oct 8th, 2007 at 9:29 pm

    Is this only for Flex 3?

  2. 2 peterd Oct 8th, 2007 at 10:35 pm

    Kyle Hayes,

    Yeah, I’m pretty sure this was added in Flex 3.

    Peter

  3. 3 devincolumbus Oct 11th, 2007 at 2:45 pm

    Hey Peter,

    If you’ve ever played on Xbox Live and sent a voice message you’ll
    notice that it’s a 10 second countdown indicated by a progress bar… I
    want to accomplish the same thing.

    I am recording Video to the FMS (VideoDisplay) and need to show the progress of the
    record time (say max record time is 30 seconds) and when the progress
    bar reaches it’s max (30 second duration), the video stops recording (just
    like XBox live).

    Secondly, when being played back, I need it to show the same progress…
    from the beginning of the video to the end duration.

    Would you happen to know how to use the ProgressBar in this way?

  4. 4 Javier Julio Aug 1st, 2008 at 4:00 pm

    Peter, is their a property that speeds up the animation? I’m using the indeterminate animation for any process and sometimes they don’t take to long but the animation plays to slow to notice it.

  5. 5 peterd Aug 1st, 2008 at 5:34 pm

    Javier Julio,

    I don’t see a property/style that easily allows that. The easiest way may be to set the indeterminateMoveInterval to something small like 20, or create a custom indeterminate skin for the Flex ProgressBar control which gives you the effect you want.

    Peter

Leave a Reply

This blog is terrible at eating HTML tags. If you plan on posting code/XML, please escape your "<" characters as "&lt;" and your ">" characters as "&gt;".