Slider

The slider is horizontal and has a single handle that can be dragged with the help of mouse. Sliders enable users to interactively revise some adjustable value in an app. Sliders allow users to set minimum and maximum values and make smooth and continuous adjustments to the same.


Configure.IT brings you this easy to use control with explicit features, wherein you can also set the Image for minimum and maximum values. You can have images for respective features, even the Slider thumb image.

    Keywords:
  • slider transition
  • slider track
  • slidetoggle

Properties

  • CIT Custom Properties
    PARAMETER
    DESCRIPTION
    Step Value
    This property is for setting step increment or decrement value between consecutive values of slider.
    Enable Scaling
    This property is for enabling scaling(step values) for slider.
    MinimumTrackImage

    This property is for setting minimum track image.

    MaximumTrackImage
    This property is for setting maximum track image.
    Slider Thumb Image
    This property is for setting image for slider thumb.
    Slider Thumb Highlighted Image
    This property is for setting image of slider thumb for highlighted state.
    Show PopOver With Slider Value While Sliding

    This property is for showing popover with slider value over slider when it value is changed.

    Slider PopOver Background Color

    This property is for setting background color for popover, shown if "Show PopOver With Slider Value While Sliding" property is enabled.

    Slider PopOver Label Text Color

    This property is for setting text color of text inside popover, shown if "Show PopOver With Slider Value While Sliding" property is enabled.

  • Display
    PARAMETER
    DESCRIPTION
    Minimum Value Image

    Contains the image that is drawn on the side of the slider representing the minimum value.

    Maximum Value Image

    Contains the image that is drawn on the side of the slider representing the maximum value.

    Minimum Track Tint Color

    The color used to tint the standard minimum track images.

    Maximum Track Tint Color

    The color used to tint the standard maximum track images.

    Thumb Tint Color

    The color used to tint the standard thumb images.

    Enabled

    A Boolean property that indicates whether the gesture recognizer is enabled.

    User Interaction Enabled

    Enables the Interaction with user, i.e. control responds when user taps on it.

    Alpha

    Used to set the transparency to the Slider which ranges from 0 to 1.

    Background Color

    Used to set the background color to the Slider.

  • Custom Border
    PARAMETER
    DESCRIPTION
    Border Width

    Sets border width for a Slider.

    Border Corner Radius

    Sets radius with which control's rounded corners should be drawn. Setting this property will enable control appear with rounded corners.

    Border Color

    Sets the border color for a control. Works only if "Border Width" property is set to a value more than 0. Default would be black color.

    Dash Width For Dashed Border

    Sets width of each dash in dashed border pattern for a control.

    Space Between Dashes For Dashed Border

    Helps set the spacing between Dashes for Dashed Border.

    Transform Angle

    Sets angle in degrees to which control in its normal state has to be rotated. Possible values for this property are -360 to 360.

  • Object
    PARAMETER
    DESCRIPTION
    Xpos

    Sets the X position of the Slider.

    YPos

    Sets the Y position of the Slider.

    Width

    Sets the width of the Slider.

    Height

    Sets the height of the Slider.

    Object ID

    Sets unique identifier for the control. Control can be referenced with the name, set in this property for configuration.

    Object Parent ID

    Set "Object ID" of View which contains this control or can serve as parent.

    Key Name To Data

    Sets the local JSON file name from which Slider's data has to be loaded.

    Key To Minimum Value

    Sets the web service key having minimum value.

    Key To Maximum Value
    Set the web service key having maximum value
    Minimum Value

    Sets the minimum Value to the Slider.

    Maximum Value

    Sets the maximum Value to the Slider.

    Value

    Sets the value to the Slider.

  • Horizontal
    PARAMETER
    DESCRIPTION
    Horizontal Group

    Group of horizontal android default properties.

    Reference Type

    Reference type is the the default property to set selected view with respect to other view.

    Reference Value

    Reference object that is used for positioning selected object.

    Offset Type

    marginLeft : Specifies extra space on the left side of this view. This space is outside this view's bounds.
    marginRight : Specifies extra space on the right side of this view. This space is outside this view's bounds.

    Offset Value

    Offset Value defines the extra space value in the pixel.

    Center Horizontal

    This property centers the child horizontally with respect to the bounds of its parent view.

    Apply Horizontal Custom Properties

    If any of the horizontal layout setting parameter(s) are selected then this value is selected to indicate user applied horizontal custom layout setting parameter(s).

  • Vertical
    PARAMETER
    DESCRIPTION
    Vertical Group

    Group of vertical android default properties.

    Reference Type

    These are the android default properties to set selected view with respect of other view.

    Reference Value

    Reference object that is used for positioning selected object

    Offset Type

    marginTop : Specifies extra space on the top side of this view. This space is outside this view's bounds.
    marginBottom : Specifies extra space on the bottom side of this view. This space is outside this view's bounds.

    Offset Value

    Value define the extra space value in pixel.

    Center Vertical

    This property centers the child vertically with respect to the bounds of its parent view.

    Apply Vertical Custom Properties

    If any of the vertical layout setting parameter(s) are selected then this value is selected to indicate user applied vertical custom layout setting parameter(s)

  • Advanced
    PARAMETER
    DESCRIPTION
    Continuous

    Contains a Boolean value indicating whether changes in the Slider’s value generate continuous update events.

  • Layout Setting
    PARAMETER
    DESCRIPTION
    Left

    The padding is expressed in pixels for the left, top, right and bottom parts of the view. Padding can be used to offset the content of the view by a specific amount of pixels.


    For instance, a Left value of 2 will push the view's content by 2 pixels to the right of the left edge.

    Right

    For instance, a Right value of 2 will push the view's content by 2 pixels to the left of the right edge.

    Top

    For instance, a Top value of 2 will push the view's content by 2 pixels to the bottom of the top edge.

    Bottom

    For instance, a Bottom value of 2 will push the view's content by 2 pixels to the top of the bottom edge.

    Apply Custom Properties

    If any of the layout setting parameter(s) are selected then this value is selected to indicate user applied custom layout setting parameter(s).

    Layout Width

    Sets the width of the view
    match_parent/fill_parent : Takes the width as its parent view
    wrap_content : Takes the width as its content’s width

    Center In Parent

    This property centers the child vertically with respect to the bounds of its parent view.

    Horizontal

    Group of horizontal android default properties.

    Vertical

    Group of vertical android default properties.

    Layout Height

    Sets the height of the view
    match_parent/fill_parent : Takes the height as its parent view
    wrap_content : Takes the height as its content’s height

    Default Min Height

    The height of the view cannot be less than the given value.
    If user select “Default Min Height” then android default value is taken otherwise it takes 0dp.

    Default Min Width

    The width of the view cannot be less than the given value.
    If user select “Default Min Width” then android default value is taken otherwise it takes 0dp.

  • Display/AdvanceText
    PARAMETER
    DESCRIPTION
    Hide

    Hiding an element can be done by checking ‘Hide’. This property lets you hide the control.


    Advance - Sets auto resizing with respect to superview, for Slider.

Actions

  • Value Changed

    The changed event is sent to an element when its value changes.

Remarks

  • Slider PopOver

    Configure.IT provides you with a feature of showing popOver above slider with slider value, which moves as user slides to change value. You can enable this using ‘Show PopOver With Slider Value While Sliding’ property. You can customise PopOver using ‘Slider PopOver Background Color’ and ‘Slider PopOver Label Text Color’ properties.

  • Scaling

    You can configure slider to allow choosing from fixed set of numbers within a range. i.e, Each slider position should be equidistant and the slider should snap to each position, rather than smoothly slide between them. (This is the behavior of the slider that can be seen in iPhone Settings > General > Text Size, which was introduced in iOS 7.) For enabling this feature you need to enable ‘Enable Scaling’ property and set ‘Step Value’ property, which is the distance between each slider position, that user can select.

  • Image and color for minimum and maximum track

    You can set image for minimum and maximum track using ‘Minimum TrackImage’ and ‘Maximum TrackImage’ properties respectively. You can set color for minimum and maximum track using ‘Minimum Track Tint Color’ and ‘Maximum Track Tint Color’ properties respectively.