六、表单元素(04):开关

开关组件用于表示功能的启用与关闭状态。用户可通过点击滑块控制其状态变更,常用于系统设置、权限控制、通知开关等场景。开关具有简洁、直观的交互方式,可灵活配置外观尺寸和颜色,适配各种界面风格。

应用场景

  1. 功能启用/禁用

用于控制某项功能是否生效,例如"自动播放"、"开启定位服务"等。

  1. 用户设置项

用于在设置页面中启用或关闭个人偏好,例如"夜间模式"、"推送提醒"等。

  1. 状态指示控制

作为状态开关的视觉反馈,例如"是否在线"、"是否公开"等布尔状态展示。

常用属性及说明

属性名称 作用 默认值
开关初始值 控制开关默认是开启还是关闭 关闭
控制开关组件整体宽度 55
控制开关组件整体高度 26
活跃轨道颜色 开关开启状态下轨道的背景颜色 #FF8BC34A
非活跃轨道颜色 开关关闭状态下轨道的背景颜色 #FF9E9E9E
活跃凸轮颜色 开关开启状态下滑块(凸轮)的颜色 #FFFFFFFF
非活跃凸轮颜色 开关关闭状态下滑块颜色 #FFFFFFFF
轨道边框高度 控制轨道边框的宽度 0
凸轮边框高度 控制滑块(凸轮)的边框线宽 0
活跃轨道边框颜色 开启状态下轨道边框颜色 #FF40C4FF
非活跃轨道边框颜色 关闭状态下轨道边框颜色 #1F000000
活跃凸轮边框颜色 开启状态下滑块边框颜色 #FFFFFFFF
非活跃凸轮边框颜色 关闭状态下滑块边框颜色 #1F000000
相关推荐
九狼2 小时前
Flutter URL Scheme 跨平台跳转
人工智能·flutter·github
_squirrel4 小时前
记录一次 Flutter 升级遇到的问题
flutter
Haha_bj5 小时前
Flutter——状态管理 Provider 详解
flutter·app
MakeZero8 小时前
Flutter那些事-展示型组件篇
flutter
赤心Online8 小时前
从零开始掌握 Shorebird:Flutter 热更新实战指南
flutter
wangruofeng9 小时前
AI 助力 Flutter 3.27 升级到 3.38 完整指南:两周踩坑与实战复盘
flutter·ios·ai编程
Zsnoin能1 天前
Flutter仿ios液态玻璃效果
flutter
傅里叶1 天前
iOS相机权限获取
flutter·ios
Haha_bj1 天前
Flutter—— 本地存储(shared_preferences)
flutter
心之语歌1 天前
Flutter 存储权限:适配主流系统
flutter