range(start[, stop]; length, stop, step=1)

Given a starting value, construct a range either by length or from start to stop, optionally with a given step (defaults to 1, a UnitRange). One of length or stop is required. If length, stop, and step are all specified, they must agree.

If length and stop are provided and step is not, the step size will be computed automatically such that there are length linearly spaced elements in the range.

If step and stop are provided and length is not, the overall range length will be computed automatically such that the elements are step spaced.

Special care is taken to ensure intermediate values are computed rationally. To avoid this induced overhead, see the LinRange constructor.

stop may be specified as either a positional or keyword argument.

Examples

julia> range(1, length=100)
1:100

julia> range(1, stop=100)
1:100

julia> range(1, step=5, length=100)
1:5:496

julia> range(1, step=5, stop=100)
1:5:96

julia> range(1, 10, length=101)
1.0:0.09:10.0

julia> range(1, 100, step=5)
1:5:96

range(start::T; stop::T, length=100) where T<:Colorant
range(start::T, stop::T; length=100) where T<:Colorant

Generates N (=length) >2 colors in a linearly interpolated ramp from start tostop, inclusive, returning an Array of colors.

range(range::AbstractRange{T} where T <: Real, fieldname::Union{Symbol,Nothing} = nothing, args...; lazy = false, kwargs...)

The range component is a great way to offer the user the selection of a sub-range of values between a minimum and maximum value, with optional steps to select those values. An example use case for the Range component would be to offer a price range selection

Examples

Model

julia> @reactive mutable struct RangeModel <: ReactiveModel
         range_data::R{RangeData{Int}} = RangeData(18:80)
       end

View

julia> range(18:1:90,
          :range_data;
          label=true,
          color="purple",
          labelalways=true,
          labelvalueleft=Symbol("'Min age: ' + range_data.min"),
          labelvalueright=Symbol("'Max age: ' + range_data.max")
       )

Arguments

1. Behaviour
   • name::String - Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL ex. car_id
   • snap::Bool - Snap on valid values, rather than sliding freely; Suggestion: use with 'step' property
   • reverse::Bool - Work in reverse (changes direction)
   • vertical::Bool - Display in vertical direction
   • labelalways::Bool - Always display the label
2. Content
   • label::Bool - Popup a label when user clicks/taps on the slider thumb and moves it
   • markers::Union{Bool, Int} - Display markers on the track, one for each possible value for the model or using a custom step (when specifying a Number) ex. markersmarkers="5"
   • dragrange::Bool - User can drag range instead of just the two thumbs
   • dragonlyrange::Bool - User can drag only the range instead and NOT the two thumbs
3. General
   • tabindex::Union{Int, String} - Tabindex HTML attribute value ex. 0100
4. Labels
   • labelcolorleft::String - Color name for left label background from the Color Palette ex. primaryteal-10
   • labeltextcolorleft::String - Color name for left label text from the Color Palette ex. primaryteal-10
   • labelcolorright::String - Color name for right label background from the Color Palette ex. primaryteal-10
   • labeltextcolorright::String - Color name for right label text from the Color Palette ex. primaryteal-10
   • labelvalueleft::Union{String, Int} - Override default label for min value ex. labelvalueleft="model.min + 'px'"
   • labelvalueright::Union{String, Int} - Override default label for max value ex. labelvalueright="model.max + 'px'"
5. Model
   • range::AbstractRange{T} - The range of values to select from min:step:max
6. State
   • disable::Bool - Put component in disabled mode
   • readonly::Bool - Put component in readonly mode
7. Style
   • color::String - Color name for component from the Color Palette ex. primaryteal-10
   • labelcolor::String - Color name for component from the Color Palette ex. primaryteal-10
   • thumbpath::String - Set custom thumb svg path ex. M5 5 h10 v10 h-10 v-10
   • dark::Bool - Notify the component that the background is a dark color
   • dense::Bool - Dense mode; occupies less space

slider(range::AbstractRange{T} where T <: Real, fieldname::Union{Symbol,Nothing} = nothing, args...; lazy = false, kwargs...)

The slider is a great way for the user to specify a number value between a minimum and maximum value, with optional steps between valid values. The slider also has a focus indicator (highlighted slider button), which allows for keyboard adjustments of the slider.

Examples

View

julia> slider(1:5:100)

Arguments

1. Behaviour
   • name::String - Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL ex. car_id
   • snap::Bool - Snap on valid values, rather than sliding freely; Suggestion: use with 'step' property
   • reverse::Bool - Work in reverse (changes direction)
   • vertical::Bool - Display in vertical direction
   • labelalways::Bool - Always display the label
2. Content
   • label::Bool - Popup a label when user clicks/taps on the slider thumb and moves it
   • markers::Union{Bool, Int} - Display markers on the track, one for each possible value for the model or using a custom step (when specifying a Number) ex. markersmarkers="5"
   • dragrange::Bool - User can drag range instead of just the two thumbs
   • dragonlyrange::Bool - User can drag only the range instead and NOT the two thumbs
3. General
   • tabindex::Union{Int, String} - Tabindex HTML attribute value ex. 0100
4. Labels
   • labelcolorleft::String - Color name for left label background from the Color Palette ex. primaryteal-10
   • labeltextcolorleft::String - Color name for left label text from the Color Palette ex. primaryteal-10
   • labelcolorright::String - Color name for right label background from the Color Palette ex. primaryteal-10
   • labeltextcolorright::String - Color name for right label text from the Color Palette ex. primaryteal-10
   • labelvalueleft::Union{String, Int} - Override default label for min value ex. labelvalueleft="model.min + 'px'"
   • labelvalueright::Union{String, Int} - Override default label for max value ex. labelvalueright="model.max + 'px'"
5. Model
   • range::AbstractRange{T} - The range of values to select from min:step:max
6. State
   • disable::Bool - Put component in disabled mode
   • readonly::Bool - Put component in readonly mode
7. Style
   • color::String - Color name for component from the Color Palette ex. primaryteal-10
   • labelcolor::String - Color name for component from the Color Palette ex. primaryteal-10
   • thumbpath::String - Set custom thumb svg path ex. M5 5 h10 v10 h-10 v-10
   • dark::Bool - Notify the component that the background is a dark color
   • dense::Bool - Dense mode; occupies less space