kvision-material/io.kvision.material.slider/MdRangeSlider

MdRangeSlider

open class MdRangeSlider(disabled: Boolean = false, min: Number = 0, max: Number = 100, valueStart: Number? = null, valueEnd: Number? = null, step: Number = 1, ticks: Boolean = false, labeled: Boolean = false, valueLabelStart: String? = null, valueLabelEnd: String? = null, ariaLabelStart: String? = null, ariaValueTextStart: String? = null, ariaLabelEnd: String? = null, ariaValueTextEnd: String? = null, name: String? = null, nameStart: String? = null, nameEnd: String? = null, className: String? = null, init: MdRangeSlider.() -> Unit? = null) : MdBaseSlider<Nothing?> (source)

Range Sliders expand upon MdRangeSlider using the same concepts but allow the user to select 2 values.

The two values are still bounded by the value range but they also cannot cross each other.

See https://material-web.dev/components/slider/

Author

Maanrifa Bacar Ali

Constructors

MdRangeSlider

constructor(disabled: Boolean = false, min: Number = 0, max: Number = 100, valueStart: Number? = null, valueEnd: Number? = null, step: Number = 1, ticks: Boolean = false, labeled: Boolean = false, valueLabelStart: String? = null, valueLabelEnd: String? = null, ariaLabelStart: String? = null, ariaValueTextStart: String? = null, ariaLabelEnd: String? = null, ariaValueTextEnd: String? = null, name: String? = null, nameStart: String? = null, nameEnd: String? = null, className: String? = null, init: MdRangeSlider.() -> Unit? = null)

Properties

alignContent

open var alignContent: AlignContent?

alignItems

open var alignItems: AlignItems?

alignSelf

open var alignSelf: AlignItems?

ariaLabelEnd

var ariaLabelEnd: String?

Aria label for the range slider's end handle.

ariaLabelStart

var ariaLabelStart: String?

Aria label for the range slider's start handle.

ariaValueTextEnd

var ariaValueTextEnd: String?

Aria value text for the range slider's end value.

ariaValueTextStart

var ariaValueTextStart: String?

Aria value text for the range slider's start value.

background

open var background: Background?

border

open var border: Border?

borderBottom

open var borderBottom: Border?

borderLeft

open var borderLeft: Border?

borderRadius

open var borderRadius: CssSize?

borderRadiusList

open var borderRadiusList: List<CssSize>?

borderRight

open var borderRight: Border?

borderTop

open var borderTop: Border?

bottom

open var bottom: CssSize?

boxShadow

open var boxShadow: BoxShadow?

boxShadowList

open var boxShadowList: List<BoxShadow>?

clear

open var clear: Clear?

color

open var color: Color?

colorHex

open var colorHex: Int?

colorName

open var colorName: Col?

cursor

open var cursor: Cursor?

disabled

var disabled: Boolean

Whether or not the widget is disabled.

display

open var display: Display?

draggable

var draggable: Boolean?

eventTarget

var eventTarget: Widget?

flexBasis

open var flexBasis: CssSize?

flexDirection

open var flexDirection: FlexDirection?

flexGrow

open var flexGrow: Int?

flexShrink

open var flexShrink: Int?

flexWrap

open var flexWrap: FlexWrap?

float

open var float: PosFloat?

fontFamily

open var fontFamily: String?

fontSize

open var fontSize: CssSize?

fontStyle

open var fontStyle: FontStyle?

fontVariant

open var fontVariant: FontVariant?

fontWeight

open var fontWeight: FontWeight?

form

val form: HTMLFormElement?

The associated form element with which this element's value will submit.

gridArea

open var gridArea: String?

gridAutoColumns

open var gridAutoColumns: String?

gridAutoFlow

open var gridAutoFlow: GridAutoFlow?

gridAutoRows

open var gridAutoRows: String?

gridColumnEnd

open var gridColumnEnd: String?

gridColumnGap

open var gridColumnGap: Int?

gridColumnStart

open var gridColumnStart: Int?

gridRowEnd

open var gridRowEnd: String?

gridRowGap

open var gridRowGap: Int?

gridRowStart

open var gridRowStart: Int?

gridTemplateAreas

open var gridTemplateAreas: List<String>?

gridTemplateColumns

open var gridTemplateColumns: String?

gridTemplateRows

open var gridTemplateRows: String?

height

open var height: CssSize?

var id: String?

justifyContent

open var justifyContent: JustifyContent?

justifyItems

open var justifyItems: JustifyItems?

justifySelf

open var justifySelf: JustifyItems?

kvscope

var kvscope: dynamic

labeled

var labeled: Boolean

Whether or not to show a value label when activated.

labels

val labels: NodeList?

The labels this element is associated with.

left

open var left: CssSize?

letterSpacing

open var letterSpacing: CssSize?

lineBreak

open var lineBreak: LineBreak?

lineHeight

open var lineHeight: CssSize?

listStyle

open var listStyle: ListStyle?

margin

open var margin: CssSize?

marginBottom

open var marginBottom: CssSize?

marginLeft

open var marginLeft: CssSize?

marginRight

open var marginRight: CssSize?

marginTop

open var marginTop: CssSize?

max

var max: Number

The slider maximum value

maxHeight

open var maxHeight: CssSize?

maxWidth

open var maxWidth: CssSize?

min

var min: Number

The slider minimum value

minHeight

open var minHeight: CssSize?

minWidth

open var minWidth: CssSize?

name

var name: String?

The name to use in form submission.

nameEnd

var nameEnd: String?

The HTML name to use in form submission for a range slider's ending value. Use name instead if both the start and end values should use the same name.

nameStart

var nameStart: String?

The HTML name to use in form submission for a range slider's starting value. Use name instead if both the start and end values should use the same name.

opacity

open var opacity: Double?

order

open var order: Int?

outline

open var outline: Outline?

overflow

open var overflow: Overflow?

overflowWrap

open var overflowWrap: OverflowWrap?

overflowX

open var overflowX: Overflow?