User Interface Programming

The Range Slider is a con­t­rol that lets you input two values, typically an upper and a lower bound. Normal sliders just lets you input one value.

The Range Slider was the subject of a User Interface Programming column. Due to space con­straints, the con­t­rol described in the column was fairly simple. The con­t­rol documented here has more fea­tures.

You will find that a lot of the code is half-baked. Development of the Range Slider continues, so watch this page for future developments. I’ll appre­cia­te any feedback and suggestions you might have.

(The documentation is on the thin side as well; I will extend it when I get the time. In the meantime, don’t hesitate to ask.)

Note that the demo dia­log is resizable and that the range slider is well-behaved, resizingwise.

Using the Range Slider

Mouse

• Use left mouse but­ton to drag the whole thing left or right. If the layout is vertical, you drag the whole thing up or down instead.
• Drag the arrows at the end to change the size of the range.
• If the minimum range is zero, the slider allows you to move the range when dragging the arrows.
• Click to the right or left of the current range to move the range one “page.”
• Double-click the current range to fill the available range (maximize). If the range is already maximized, double-clicking restores the previous range.
• The Cancel but­ton cancels any drag op­er­ation in progress.

Keyboard

• Horizontal slider: Left/right arrows move the slider left and right.
• Vertical slider: Up/down arrows move the slider up and down.
• Press the Con­t­rol key to change the size of the range.
• The PageUp/PageDown keys moves the slider by the “page.”
• The Home and End keys move the slider to the start and end of the range, respectively.

Programming the Range Slider

The Range Slider is of class wdmRangeSlider. Call initRangeSlider() to register this class.

The key structure for communicating with the range slider is RS_INFO:

typedef struct _RS_INFO {
    LONG _lower;        // Lower end of range
    LONG _upper;        // Upper end of range
    LONG _start;        // Current starting position (≥ _lower)
    LONG _end;          // Current ending position (≤ _upper)
    LONG _minRange;     // Minimum size of slider (may be zero)
    LONG _granularity;  // Steps when moving or changing size
} RS_INFO;

To initialize the range slider, initialize an RS_INFO structure and send its address as the wParam of an RSN_SETINFO mes­sage. Although you can do this at any time and as many times as you like, the usual approach is to do this once, when initializing the con­t­rol.

When the user interacts with the con­t­rol to change its status in any way, the con­t­rol sends a WM_NOTIFY mes­sage to its parent win­dow. The parameter is a pointer to an NMRANGESLIDER structure:

typedef struct _NMRANGESLIDER {
    NMHDR   hdr;
    RS_INFO rsInfo;
} NMRANGESLIDER;

Only the _start and _end members of RS_INFO are relevant; the user has no way of changing the other members.

Utility Functions

setSliderRange();
setDlgItemSliderRange();

Sample Code

The ac­com­pa­ny­ing code contains a complete example of how to use the range slider.

Todo

• Customizing the visuals.

See Also

• InvalidateCursor
• Subclassing

---

(Start bottom menu)

Top • Home • Articles • Book • Resources
Win­dows De­vel­oper Maga­zine • R&D Books • CMP Books
Amazon.com • Amazon.co.uk • Contact Petter Hesselberg

(End bottom menu)