Owner-drawn trackbar(slider)

• Download source (control source and test project) - 41 Kb
• Download demo project (binary only) - 24 Kb

Introduction

This article presents owner-drawn trackbar control. Component is written entirely from scratch. All painting events are done by code. It’s got cool, modern look. The best thing is, however, the capability of changing slider’s thumb shape. It is done simply by providing appropriate graphics path.

Background (optional)

I always wanted to have cool slider for my audio player application. The best I could find here was Guinness4Strength's article. Unfortunately, I didn’t find it pretty enough, so I decided to write my own trackbar. Hopefully you like it.

Properties

Appearance:

• ThumbSize - Gets or sets the size of the thumb
• ThumbCustomShape - Gets or sets the thumb custom shape. Use ThumbRect property to determine bounding rectangle.
• ThumbRoundRectSize - Gets or sets the size of the thumb round rectangle edges.
• BorderRoundRectSize - Gets or sets the size of the border round rect.

Values:

• Orientation - Gets or sets the orientation of Slider.
• Value - Gets or sets the value of Slider.
• Minimum - Gets or sets the minimum value.
• Maximum - Gets or sets the maximum value.
• SmallChange - Gets or sets trackbar's small change. It affects how to behave when directional keys are pressed
• LargeChange - Gets or sets trackbar's large change. It affects how to behave when PageUp/PageDown keys are pressed

Behavior:

• DrawFocusRectangle - Gets or sets a value indicating whether to draw focus rectangle.
• DrawSemitransparentThumb - Gets or sets a value indicating whether to draw semitransparent thumb.
• MouseEffects - Gets or sets whether mouse entry and exit actions have impact on how control look.
• MouseWheelBarPartitions - Gets or sets the mouse wheel bar partitions.

Colors:

• ThumbOuterColor - Gets or sets the thumb outer color.
• ThumbInnerColor - Gets or sets the inner color of the thumb.
• ThumbPenColor - Gets or sets the color of the thumb pen.
• BarOuterColor - Gets or sets the outer color of the bar.
• BarInnerColor - Gets or sets the inner color of the bar.
• BarPenColor - Gets or sets the color of the bar pen.
• ElapsedOuterColor - Gets or sets the outer color of the elapsed.
• ElapsedInnerColor - Gets or sets the inner color of the elapsed.

Points of Interest

This control will provide design-time support. Next version should contain custom properties editors.

History