Bitbybit Docs
    Preparing search index...

    Class BabylonGuiSlider

    通过水平或垂直拖动滑块拇指在最小值和最大值之间选择数值的滑块。订阅值更改事件以响应用户;范围、步长、值、颜色和滑块拇指可以在创建后更改。

    Index

    Constructors

    create

    • 创建一个滑块,以 step 的倍数从 minimummaximum 选取数值,起始于 value

      除非给出 width,否则水平滑块采用父级的宽度;垂直滑块采用其高度。滑块的拇指为白色,直到 changeSliderThumb 更改它。

      Parameters

      • inputs: CreateSliderDto

        名称、范围、值、步长、方向、颜色、可选的尺寸和滑块拇指标志

      Returns Slider

      滑块

      const slider = bitbybit.babylon.gui.slider.createSlider({ name: "radius", minimum: 1, maximum: 20, value: 5, step: 0.5, isVertical: false, color: "#f0cebb", background: "black", width: "300px", height: "40px", displayThumb: true });
      panel.addControl(slider);
      slider.onValueChangedObservable.add((value) => { console.log(value); });

    get

    • 读取滑块轨道周围线条的颜色。

      Parameters

      Returns string

      边框颜色

    • 读取滑块轨道未填充部分的颜色。

      Parameters

      Returns string

      背景颜色

    • 读取滑块可以达到的最大值。

      Parameters

      Returns number

      最大值

    • 读取滑块可以达到的最小值。

      Parameters

      Returns number

      最小值

    • 读取滑块移动的增量,0 表示平滑移动。

      Parameters

      Returns number

      步长

    • 读取滑块的当前值,介于其最小值和最大值之间。

      Parameters

      Returns number

    • 以 CSS 颜色字符串读取滑块拇指的颜色。

      Parameters

      Returns string

      滑块拇指颜色

    • 读取滑块拇指的宽度,以像素字符串或分数表示。

      Parameters

      Returns string | number

      滑块拇指宽度

    • 读取滑块是从下到上而不是从左到右。

      Parameters

      Returns boolean

      当滑块为垂直方向时为 true

    • 读取滑块是显示其拇指还是只显示轨道。

      Parameters

      Returns boolean

      当显示滑块拇指时为 true

    • 读取滑块的拇指是圆形而不是方形。

      Parameters

      Returns boolean

      当滑块拇指为圆形时为 true

    • 读取滑块的拇指在两端是否保持在轨道内而不是伸出。

      Parameters

      Returns boolean

      当滑块拇指被限制在范围内时为 true

    set

    • 重新设置滑块拇指的样式:圆形或方形、其颜色和宽度、是否保持在轨道内以及是否显示。

      Parameters

      • inputs: SliderThumbDto

        滑块、滑块拇指的形状、颜色和宽度、限制标志和显示标志

      Returns Slider

      同一个滑块

      bitbybit.babylon.gui.slider.changeSliderThumb({ slider, isThumbCircle: true, thumbColor: "white", thumbWidth: "20px", isThumbClamped: true, displayThumb: true });
      
    • 以 CSS 颜色设置滑块轨道周围线条的颜色。

      Parameters

      Returns Slider

      同一个滑块

    • 以 CSS 颜色设置滑块轨道未填充部分的颜色。

      Parameters

      Returns Slider

      同一个滑块

    • 设置滑块可以达到的最大值,即其右端或顶端的值。

      Parameters

      Returns Slider

      同一个滑块

    • 设置滑块可以达到的最小值,即其左端或底端的值。

      Parameters

      Returns Slider

      同一个滑块

    • 设置滑块移动的增量,因此 1 只给出整数,0 使其平滑移动。

      Parameters

      Returns Slider

      同一个滑块

    • 将滑块移动到某个值,这会像用户拖动一样触发其值更改事件。

      Parameters

      Returns Slider

      同一个滑块

      bitbybit.babylon.gui.slider.setValue({ slider, value: 7.5 });