Reference for the Mosaic class WidgetSet::HorizontalValueBarConfig

WidgetSet::HorizontalValueBarConfig
CoverBitmap
CoverFrame
CoverStackingPriority
CoverTint
FaceBitmap
FaceFrame
FaceStackingPriority
FaceTint
NeedleBitmap
NeedleFrame
NeedleMarginLeft
NeedleMarginRight
NeedleOffset
NeedleStackingPriority
NeedleTint
OnUpdate
SwingDuration
SwingElastic
TrackLeftBitmap
TrackLeftBorderColor
TrackLeftBorderWidth
TrackLeftColor
TrackLeftCornerRadius
TrackLeftFlattened
TrackLeftFrame
TrackLeftMarginLeft
TrackLeftMarginRight
TrackLeftOffset
TrackLeftStackingPriority
TrackLeftStatic
TrackLeftThickness
TrackLeftTint
TrackLeftWithEdge
TrackRightBitmap
TrackRightBorderColor
TrackRightBorderWidth
TrackRightColor
TrackRightCornerRadius
TrackRightFlattened
TrackRightFrame
TrackRightMarginLeft
TrackRightMarginRight
TrackRightOffset
TrackRightStackingPriority
TrackRightStatic
TrackRightThickness
TrackRightTint
TrackRightWithEdge
WidgetMaxSize
WidgetMinSize
WidgetSet::WidgetConfig

SEE ALSO

Using and customizing the Horizontal Value Bar widget.

This class implements the functionality permitting you to simply customize the look and feel of a 'horizontal value bar' widget (WidgetSet::HorizontalValueBar). In the practice, you will create an instance of this class, configure its properties with bitmaps, colors and other relevant attributes according to your design expectations and assign such prepared configuration object to the property 'Appearance' of every affected horizontal value bar widget. Thereupon the widgets will use the configuration information provided in the object.

Since with the configuration object you determine the appearance of the value bar widget you should know from which views the widget is composed of:

All above mentioned views are arranged one above the other whereby the resulting stacking order can be configured by using the properties FaceStackingPriority, TrackLeftStackingPriority, TrackRightStackingPriority, NeedleStackingPriority and CoverStackingPriority. The view with higher priority will appear in front of other views with lower priority.

The value bar widget can move the needle with a smooth animation. This can be configured in the properties SwingDuration and SwingElastic.

To further enhance the widgets, a slot method can be assigned to the property OnUpdate. Within the slot method new decoration views can be added to the widgets and updated according to the current state of the widget.

With the properties WidgetMinSize and WidgetMaxSize you can configure size constraints for the widget itself. You can, for example, limit the value bar widget to not shrink below a specified width or height.

property Resources::Bitmap CoverBitmap = null;

The property 'CoverBitmap' determines the bitmap to fill horizontally the foreground of the value bar widget. The bitmap is centered vertically.

If the specified bitmap contains more than one frame (multi-frame bitmap), the desired frame number can be selected in the property CoverFrame. If the selected bitmap is intended to be animated, ensure that the property CoverFrame is -1.

If the specified bitmap contains opacity information only (Alpha8 bitmap), you can tint the bitmap by specifying the desired color in the property CoverTint. With the property CoverTint you can also modulate the opacity of a regular bitmap.

property int32 CoverFrame = -1;

The property 'CoverFrame' determines the frame number within the bitmap CoverBitmap. This property is applicable for multi-frame bitmaps only (see also Resources::Bitmap). If the desired frame is not available in the bitmap, no bitmap is shown.

If the property is initialized with the value -1 and the CoverBitmap bitmap is animated, the animation is automatically started. If the bitmap is not animated and the property is -1, the frame with number 0 is displayed.

property int32 CoverStackingPriority = 5;

The property 'CoverStackingPriority' determines the Z-order position of the view destined to display the cover bitmap. Per default the cover view is arranged in front of all other views within the value bar widget. By configuring this property the arrangement of the views within the widget can be changed whereby views with larger priority will be arranged in front of views with lower priority. For example, to bring the cover view in background of the widget, configure the property with a smaller value.

property color CoverTint = #FFFFFFFF;

The property 'CoverTint' determines the color value to tint or modulate the bitmap specified in the property CoverBitmap. The effect of this color value depends on the type of the bitmap:

property Resources::Bitmap FaceBitmap = null;

The property 'FaceBitmap' determines the bitmap to fill horizontally the background of the value bar widget. The bitmap is centered vertically.

If the specified bitmap contains more than one frame (multi-frame bitmap), the desired frame number can be selected in the property FaceFrame. If the selected bitmap is intended to be animated, ensure that the property FaceFrame is -1.

If the specified bitmap contains opacity information only (Alpha8 bitmap), you can tint the bitmap by specifying the desired color in the property FaceTint. With the property FaceTint you can also modulate the opacity of a regular bitmap.

property int32 FaceFrame = -1;

The property 'FaceFrame' determines the frame number within the bitmap FaceBitmap. This property is applicable for multi-frame bitmaps only (see also Resources::Bitmap). If the desired frame is not available in the bitmap, no bitmap is shown.

If the property is initialized with the value -1 and the FaceBitmap bitmap is animated, the animation is automatically started. If the bitmap is not animated and the property is -1, the frame with number 0 is displayed.

property int32 FaceStackingPriority = 1;

The property 'FaceStackingPriority' determines the Z-order position of the view destined to display the face bitmap. Per default the face view is arranged in the background of the value bar widget behind all other views. By configuring this property the arrangement of the views within the widget can be changed whereby views with larger priority will be arranged in front of views with lower priority. For example, to bring the face view in front of the value bar widget, configure the property with a larger value.

property color FaceTint = #FFFFFFFF;

The property 'FaceTint' determines the color value to tint or modulate the bitmap specified in the property FaceBitmap. The effect of this color value depends on the type of the bitmap:

property Resources::Bitmap NeedleBitmap = null;

The property 'NeedleBitmap' determines the bitmap to be displayed centered at the actual needle position within the value bar widget. The position of the bitmap can additionally be adjusted by configuring the property NeedleOffset.

If the specified bitmap contains more than one frame (multi-frame bitmap), the desired frame number can be selected in the property NeedleFrame. If the selected bitmap is intended to be animated, ensure that the property NeedleFrame is -1.

If the specified bitmap contains opacity information only (Alpha8 bitmap), you can tint the bitmap by specifying the desired color in the property NeedleTint. With the property NeedleTint you can also modulate the opacity of a regular bitmap.

property int32 NeedleFrame = -1;

The property 'NeedleFrame' determines the frame number within the bitmap NeedleBitmap. This property is applicable for multi-frame bitmaps only (see also Resources::Bitmap). If the desired frame is not available in the bitmap, no bitmap is shown.

If the property is initialized with the value -1 and the NeedleBitmap bitmap is animated, the animation is automatically started. If the bitmap is not animated and the property is -1, the frame with number 0 is displayed.

property int32 NeedleMarginLeft = 0;

The property 'NeedleMarginLeft' determines an additional gap in pixel between the left edge of the widget at the leftmost position for the needle. The needle can't be moved beyond this position.

property int32 NeedleMarginRight = 0;

The property 'NeedleMarginRight' determines an additional gap in pixel between the rightmost position for the needle and the right edge of the widget. The needle can't be moved beyond this position.

property point NeedleOffset = <0,0>;

The property 'NeedleOffset' determines an additional displacement in pixel for the needle. The needle, determined by the bitmap NeedleBitmap is displayed vertically centered at the actual needle position. The value specified in the property NeedleOffset is used to move the needle accordingly.

property int32 NeedleStackingPriority = 4;

The property 'NeedleStackingPriority' determines the Z-order position of the view destined to display the needle bitmap. Per default the needle is arranged in front of the views belonging to the left and right tracks. By configuring this property the arrangement of the views within the widget can be changed whereby views with larger priority will be arranged in front of views with lower priority. For example, to place the needle in background of the value bar widget, configure the property with a smaller value.

property color NeedleTint = #FFFFFFFF;

The property 'NeedleTint' determines the color value to tint or modulate the bitmap specified in the property NeedleBitmap. The effect of this color value depends on the type of the bitmap:

property slot OnUpdate = null;

The property 'OnUpdate' can refer to a slot method, which should be invoked by widgets connected to this configuration object when the widget's state changes. This method is intended to add and update custom widget decorations.

The usage of this property is equal to the homonymous property explained in WidgetSet::HorizontalValueBar. See its description for more details.

Please note, when the slot method is invoked, the method's parameter 'sender' refers the widget instance causing the invocation. In this manner, by using 'sender' the implementation of the slot method can access the widget to add and manipulate decoration views.

property int32 SwingDuration = 500;

The property 'SwingDuration' determines the time in milliseconds the value bar widget should take when repositioning the needle between the leftmost and rightmost positions. At the runtime, when the needle is moved, the operation is performed with a smooth animation.

Initializing this property with the value 0 (zero) deactivates the animation effect so that the position of the needle is adapted immediately when the corresponding value in the value bar widget changes.

If enabled, the animation is performed with the FastIn_EasyOut or BackOut timing (see Effects::Timing) depending on the configuration of the property SwingElastic.

property bool SwingElastic = true;

The property 'SwingElastic' controls the timing of the animation effect used to smoothly move the needle when the value in the widget changes. This animation is enabled when the property SwingDuration is greater than 0 (zero).

Initializing the property 'SwingElastic' with the value 'false' causes the animation to be performed with the FastIn_EaseOut timing. If the property is 'true', the animation is performed with the BackOut timing resulting in the animation to be more elastic. See also Effects::Timing.

property Resources::Bitmap TrackLeftBitmap = null;

The property 'TrackLeftBitmap' determines the bitmap to fill the area on the left of the value bar needle.

If the specified bitmap contains more than one frame (multi-frame bitmap), the desired frame number can be selected in the property TrackLeftFrame. If the selected bitmap is intended to be animated, ensure that the property TrackLeftFrame is -1.

If the specified bitmap contains opacity information only (Alpha8 bitmap), you can tint the bitmap by specifying the desired color in the property TrackLeftTint. With the property TrackLeftTint you can also modulate the opacity of a regular bitmap.

The bitmap is arranged vertically centered without being resized in the height. In the width the bitmap fills completely the area between the left edge of the widget and the actual needle position. With the property TrackLeftWithEdge you can control, whether the bitmap at its right end (at the actual needle position) should appear truncated or complete.

property color TrackLeftBorderColor = #00000000;

The property 'TrackLeftBorderColor' determines the color of the border surrounding the left track. To determine the thickness of the border use the property TrackLeftBorderWidth.

Please note, in order to be visible, a valid height for the track has to be configured in the property TrackLeftThickness. With the property TrackLeftCornerRadius the rounding at the corners of the border can be specified.

property int32 TrackLeftBorderWidth = 0;

The property 'TrackLeftBorderWidth' determines the thickness of the border surrounding the left track. The value is expressed in pixel. To determine the color of the border use the property TrackLeftBorderColor.

Please note, in order to be visible, a valid height for the track has to be configured in the property TrackLeftThickness. With the property TrackLeftCornerRadius the rounding at the corners of the border can be specified.

property color TrackLeftColor = #00000000;

The property 'TrackLeftColor' determines the color to fill the background of the left track. In order to be visible, a valid height for the track has to be configured in the property TrackLeftThickness. With the property TrackLeftCornerRadius the rounding at the corners of the filled area can be specified.

property int32 TrackLeftCornerRadius = 0;

The property 'TrackLeftCornerRadius' determines the rounding at corners of a filled rectangle and border belonging to the left track. Normally, the left track has the shape of a rectangle with sharp corners. Specifying a value greater than 0 in this property rounds the corners. The larger the value, the bigger the rounding effect. The value is expressed as radius in pixel.

Please note, that the corner radius is automatically limited to half the height of the track according to the value specified in the property TrackLeftThickness. Furthermore, with the property TrackLeftFlattened the track edge at the current needle position can be flattened.

property bool TrackLeftFlattened = false;

The property 'TrackLeftFlattened' controls the appearance of the left track at its edge corresponding to the actual needle position. Per default the corners at the edge are rounded according to the value specified in the property TrackLeftCornerRadius. By configuring the property TrackLeftFlattened with the value 'true', the corner rounding occurs only when the track has assumed its rightmost position. As long as the track is smaller, the edge at the actual needle position is clipped (it appears flattened). The rightmost position for the track is configured by the property TrackLeftMarginRight.

property int32 TrackLeftFrame = -1;

The property 'TrackLeftFrame' determines the frame number within the bitmap TrackLeftBitmap. This property is applicable for multi-frame bitmaps only (see also Resources::Bitmap). If the desired frame is not available in the bitmap, no bitmap is shown.

If the property is initialized with the value -1 and the TrackLeftBitmap bitmap is animated, the animation is automatically started. If the bitmap is not animated and the property is -1, the frame with number 0 is displayed.

property int32 TrackLeftMarginLeft = 0;

The property 'TrackLeftMarginLeft' determines an additional gap in pixel between the left edge of the value bar widget and the area destined to display views belonging to the left track (filled rectangle, border and image). If this property is 0 (zero), the left track is directly aligned at the left edge of the widget. To adjust the vertical position of the left track use the property TrackLeftOffset.

property int32 TrackLeftMarginRight = 0;

The property 'TrackLeftMarginRight' determines an additional gap in pixel between the right edge of the value bar widget and the right end of the area destined to display views belonging to the left track (filled rectangle, border and image).

The right end of the track area corresponds to the actual needle position. When the needle is moved, the size of the track is adjusted accordingly. By using this property, the rightmost position can be limited to not exceed the predetermined margin. To adjust the leftmost position of the track, use the property TrackLeftMarginLeft. To adjust the vertical position of the left track use the property TrackLeftOffset.

property int32 TrackLeftOffset = 0;

The property 'TrackLeftOffset' determines an additional vertical displacement in pixel for the area destined to display views belonging to the left track (filled rectangle, border and image). Per default, the left track is vertically centered within the value bar widget. By configuring this property, the vertical position of the track can be adjusted. To adjust the horizontal position of the left track use the property TrackLeftMarginLeft.

property int32 TrackLeftStackingPriority = 3;

The property 'TrackLeftStackingPriority' determines the Z-order position of the views destined to display the left track (rectangle, border and image). Per default all left track views are arranged in front of the face and right track views. By configuring this property the arrangement of the views within the widget can be changed whereby views with larger priority will be arranged in front of views with lower priority. For example, to place the left track views behind the right track, configure the property with a smaller value.

property bool TrackLeftStatic = false;

The property 'TrackLeftStatic' controls the size calculation of the area destined to display views belonging to the left track (filled rectangle, border and image). If this property is 'false', the left track fills automatically the area between the left edge of the value bar widget and the actual position of the needle. When the needle is moved, the size of the track is adjusted accordingly.

By initializing this property with the value 'true', the track assumes its maximum possible size filling the entire area between the left and right edges of the value bar widget. Now, the size of the track does not correspond anymore to the position of the needle. The track has a static size.

Please note, that the area destined for the left track can additionally be limited by the properties TrackLeftMarginLeft and TrackLeftMarginRight.

property int32 TrackLeftThickness = 0;

The property 'TrackLeftThickness' determines the height in pixel of a filled rectangle and border belonging to the left track. The color of the rectangle has to be configured by property TrackLeftColor. The thickness and the color of the border are configured by the properties TrackLeftBorderWidth and TrackLeftBorderColor.

Please note, this property does not affect how bitmap specified in the property TrackLeftBitmap is displayed. The height of the bitmap is determined exclusively by the bitmap itself.

property color TrackLeftTint = #FFFFFFFF;

The property 'TrackLeftTint' determines the color value to tint or modulate the bitmap specified in the property TrackLeftBitmap. The effect of this color value depends on the type of the bitmap:

property bool TrackLeftWithEdge = false;

The property 'TrackLeftWithEdge' controls the appearance of the track bitmap (TrackLeftBitmap). If this property is 'true', the widget displays the bitmap completely with all its edges. If this property is 'false', the right edge of the bitmap is truncated.

property Resources::Bitmap TrackRightBitmap = null;

The property 'TrackRightBitmap' determines the bitmap to fill the area on the right of the value bar needle.

If the specified bitmap contains more than one frame (multi-frame bitmap), the desired frame number can be selected in the property TrackRightFrame. If the selected bitmap is intended to be animated, ensure that the property TrackRightFrame is -1.

If the specified bitmap contains opacity information only (Alpha8 bitmap), you can tint the bitmap by specifying the desired color in the property TrackRightTint. With the property TrackRightTint you can also modulate the opacity of a regular bitmap.

The bitmap is arranged vertically centered without being resized in the height. In the width the bitmap fills completely the area between the actual needle position and the right edge of the widget. With the property TrackRightWithEdge you can control, whether the bitmap at its left end (at the actual needle position) should appear truncated or complete.

property color TrackRightBorderColor = #00000000;

The property 'TrackRightBorderColor' determines the color of the border surrounding the right track. To determine the thickness of the border use the property TrackRightBorderWidth.

Please note, in order to be visible, a valid height for the track has to be configured in the property TrackRightThickness. With the property TrackRightCornerRadius the rounding at the corners of the border can be specified.

property int32 TrackRightBorderWidth = 0;

The property 'TrackRightBorderWidth' determines the thickness of the border surrounding the right track. The value is expressed in pixel. To determine the color of the border use the property TrackRightBorderColor.

Please note, in order to be visible, a valid height for the track has to be configured in the property TrackRightThickness. With the property TrackRightCornerRadius the rounding at the corners of the border can be specified.

property color TrackRightColor = #00000000;

The property 'TrackRightColor' determines the color to fill the background of the right track. In order to be visible, a valid height for the track has to be configured in the property TrackRightThickness. With the property TrackRightCornerRadius the rounding at the corners of the filled area can be specified.

property int32 TrackRightCornerRadius = 0;

The property 'TrackRightCornerRadius' determines the rounding at corners of a filled rectangle and border belonging to the right track. Normally, the right track has the shape of a rectangle with sharp corners. Specifying a value greater than 0 in this property rounds the corners. The larger the value, the bigger the rounding effect. The value is expressed as radius in pixel.

Please note, that the corner radius is automatically limited to half the height of the track according to the value specified in the property TrackRightThickness. Furthermore, with the property TrackRightFlattened the track edge at the current needle position can be flattened.

property bool TrackRightFlattened = false;

The property 'TrackRightFlattened' controls the appearance of the right track at its edge corresponding to the actual needle position. Per default the corners at the edge are rounded according to the value specified in the property TrackRightCornerRadius. By configuring the property TrackRightFlattened with the value 'true', the corner rounding occurs only when the track has assumed its leftmost position. As long as the track is smaller, the edge at the actual needle position is clipped (it appears flattened). The leftmost position for the track is configured by the property TrackRightMarginLeft.

property int32 TrackRightFrame = -1;

The property 'TrackRightFrame' determines the frame number within the bitmap TrackRightBitmap. This property is applicable for multi-frame bitmaps only (see also Resources::Bitmap). If the desired frame is not available in the bitmap, no bitmap is shown.

If the property is initialized with the value -1 and the TrackRightBitmap bitmap is animated, the animation is automatically started. If the bitmap is not animated and the property is -1, the frame with number 0 is displayed.

property int32 TrackRightMarginLeft = 0;

The property 'TrackRightMarginLeft' determines an additional gap in pixel between the left edge of the value bar widget and the left end of the area destined to display views belonging to the right track (filled rectangle, border and image).

The left end of the track area corresponds to the actual needle position. When the needle is moved, the size and position of the track are adjusted accordingly. By using this property, the leftmost position can be limited to not exceed the predetermined margin. To adjust the rightmost position of the track, use the property TrackRightMarginRight. To adjust the vertical position of the right track use the property TrackRightOffset.

property int32 TrackRightMarginRight = 0;

The property 'TrackRightMarginRight' determines an additional gap in pixel between the right edge of the value bar widget and the area destined to display views belonging to the right track (filled rectangle, border and image). If this property is 0 (zero), the right track is directly aligned at the right edge of the widget. To adjust the vertical position of the right track use the property TrackRightOffset.

property int32 TrackRightOffset = 0;

The property 'TrackRightOffset' determines an additional vertical displacement in pixel for the area destined to display views belonging to the right track (filled rectangle, border and image). Per default, the right track is vertically centered within the value bar widget. By configuring this property, the vertical position of the track can be adjusted. To adjust the horizontal position of the right track use the property TrackRightMarginRight.

property int32 TrackRightStackingPriority = 2;

The property 'TrackRightStackingPriority' determines the Z-order position of the views destined to display the right track (rectangle, border and image). Per default all right track views are arranged in front of the face view just behind the left track. By configuring this property the arrangement of the views within the widget can be changed whereby views with larger priority will be arranged in front of views with lower priority. For example, to place the right track views in front of the left track, configure the property with a larger value.

property bool TrackRightStatic = false;

The property 'TrackRightStatic' controls the size calculation of the area destined to display views belonging to the right track (filled rectangle, border and image). If this property is 'false', the right track fills automatically the area between the actual position of the needle and the right edge of the value bar widget. When the needle is moved, the position and the size of the track are adjusted accordingly.

By initializing this property with the value 'true', the track assumes its maximum possible size filling the entire area between the left and right edges of the value bar widget. Now, the size of the track does not correspond anymore to the position of the needle. The track has a static size.

Please note, that the area destined for the right track can additionally be limited by the properties TrackRightMarginLeft and TrackRightMarginRight.

property int32 TrackRightThickness = 0;

The property 'TrackRightThickness' determines the height in pixel of a filled rectangle and border belonging to the right track. The color of the rectangle has to be configured by property TrackRightColor. The thickness and the color of the border are configured by the properties TrackRightBorderWidth and TrackRightBorderColor.

Please note, this property does not affect how bitmap specified in the property TrackRightBitmap is displayed. The height of the bitmap is determined exclusively by the bitmap itself.

property color TrackRightTint = #FFFFFFFF;

The property 'TrackRightTint' determines the color value to tint or modulate the bitmap specified in the property TrackRightBitmap. The effect of this color value depends on the type of the bitmap:

property bool TrackRightWithEdge = false;

The property 'TrackRightWithEdge' controls the appearance of the track bitmap (TrackRightBitmap). If this property is 'true', the widget displays the bitmap completely with all its edges. If this property is 'false', the left edge of the bitmap is truncated.

property point WidgetMaxSize = <0,0>;

The property 'WidgetMaxSize' determines the maximum allowed size of the widget. Accordingly, the value bar widget can't become bigger than the value specified in this property. By using this property you can configure the size constraints for the widget.

property point WidgetMinSize = <0,0>;

The property 'WidgetMinSize' determines the minimal allowed size of the widget. Accordingly, the value bar widget can't become smaller than the value specified in this property. By using this property you can configure the size constraints for the widget.