跳到主要内容

滑块

滑块提供了可调整内容的视觉指示，以及当前设置在总内容范围内的位置。

当您想让用户设置定义的值（例如音量或亮度），或当用户从设置更改中获得即时反馈时，请使用滑块。

示例​

Live 示例

基本滑块​

import flet as ft

def main(page):
    page.add(
        ft.Text("默认滑块："),
        ft.Slider(),
        ft.Text("默认禁用滑块："),
        ft.Slider(disabled=True))

ft.app(target=main)

带值的滑块​

import flet as ft

def main(page):
    page.add(
        ft.Text("带值的滑块："),
        ft.Slider(value=0.3),
        ft.Text("带有自定义范围和标签的滑块："),
        ft.Slider(min=0, max=100, divisions=10, label="{value}%"))

ft.app(target=main)

带 on_change 事件的滑块​

import flet as ft

def main(page):

    def slider_changed(e):
        t.value = f"滑块改变到 {e.control.value}"
        page.update()

    t = ft.Text()
    page.add(
        ft.Text("带 'on_change' 事件的滑块："),
        ft.Slider(min=0, max=100, divisions=10, label="{value}%", on_change=slider_changed), t)

ft.app(target=main)

属性​

active_color​

滑块轨道的活动部分颜色。

滑块的"活动"侧是指thumb和最小值之间的部分。

adaptive​

如果值为 True，则根据目标平台是否为 iOS 或 macOS 创建自适应滑块。

在 iOS 和 macOS 上，这将创建一个 CupertinoSlider，其功能和外观与 Slider 相匹配，并且是 iOS 上的图形期望。在其他平台上，这将创建一个 Material 滑块。

默认值为 False。

autofocus​

如果控件将被选为初始焦点，则为 True。如果页面上有多个控件具有 autofocus 设置，则第一个添加到页面的控件将获得焦点。

divisions​

离散分区的数量。

通常与 label 结合使用，以显示当前离散值。

如果不设置，则滑块是连续的。

inactive_color​

滑块轨道的非活动部分颜色。

滑块的"非活动"侧是指thumb和最大值之间的部分。

interaction​

用户与滑块交互的允许方式。值为 SliderInteraction .

label​

格式为 {value}。

当滑块活动时，在滑块上方显示的标签。label 的值可能包含 {value}，将被替换为当前滑块值。

用于显示离散滑块的值，并作为值指示器形状的一部分显示。

如果不设置，则值指示器将不被显示。

max​

用户可以选择的最大值。

默认为 1.0。必须大于或等于 min。

如果 max 等于 min，则滑块被禁用。

min​

用户可以选择的最小值。

默认为 0.0。必须小于或等于 max。

如果 max 等于 min，则滑块被禁用。

mouse_cursor​

当鼠标指针进入或悬停在控件上时要显示的光标。 值为 MouseCursor 。

overlay_color​

通常用于指示范围滑块thumb处于 HOVERED 或 DRAGGED ControlState 状态的高亮颜色。

round​

在包含 value 的标签上显示的十进制数。默认为 0（显示值四舍五入到最近的整数）。

secondary_active_color​

滑块轨道的次要活动部分颜色。

secondary_track_value​

滑块的次要轨道值。

如果不为空，则使用 secondary_active_color 在thumb和该值之间绘制次要轨道，覆盖非活动轨道。如果小于 value，则不显示次要轨道。

这对于媒体场景非常理想，例如显示缓冲进度，同时 value 显示播放进度。

thumb_color​

thumb 的颜色。

value​

滑块当前选择的值。

滑块的thumb将被绘制在对应于该值的位置。

默认值为“min”属性的值。

事件​

on_blur​

控件失去焦点时触发。

on_change​

滑块状态改变时触发。

on_change_end​

用户完成选择新值时触发。

on_change_start​

用户开始选择新值时触发。

on_focus​

控件获得焦点时触发。