Skip to content

Input Slider

anidivr edited this page Oct 30, 2022 · 4 revisions

Select value from a range

image

input-slider code

Inputs

Name Type Default Description
value number 0 Current value within range
min number 0 Minimum value in range
max number 10 Maximum value in range
step number 1 Amount value increments when sliding. Default is 10% of max-min
width number 1 Width of slider in meters
height number 0.1 Height of slider in meters
enabled boolean true When true, slider can be moved. When false, interaction is disabled
backgroundmaterial Material Theme button material (color #505050) Background material. Set to override with custom material
disabledmaterial Material Theme disabled material (color #666666) Disabled material. Set to override with custom material
outlinematerial LineBasicMaterial Theme outline material (color white) Outline material. Set to override with custom material
slidermaterial Material Theme slider material (color yellow) Checkbox material. Set to override with custom material
selectable InteractiveObjects undefined Add to list of objects ray caster can test for overlap
geometry BufferGeoemtry Rounded rectangle shape Override to provide your own geometry

Outputs

Name Type Description
change number Triggered when value changed. Event contains new value

Examples

<flat-ui-input-slider [visible]="item._min && item._max" [width]="0.5" [min]="item._min" [max]="item._max"
                      [step]="item._step" [value]="numbervalue" [selectable]="selectable" [enabled]="item.enabled"
                      (change)="numbervalue=$event">
</flat-ui-input-slider>
Clone this wiki locally