Flutter switch 开关组件浅析
Flutter switch 开关组件浅析
- 前言
- Switch 组件的属性
- 总结
前言
在日常开发中，switch 开关组件，也是比较常用的组件的，本篇文章将记录switch 简单使用及属性。
Switch 组件的属性
我们先来看一下 Switch 组件的源码
const Switch({super.key,required this.value,required this.onChanged,this.activeColor,this.activeTrackColor,this.inactiveThumbColor,this.inactiveTrackColor,this.activeThumbImage,this.onActiveThumbImageError,this.inactiveThumbImage,this.onInactiveThumbImageError,this.thumbColor,this.trackColor,this.materialTapTargetSize,this.dragStartBehavior = DragStartBehavior.start,this.mouseCursor,this.focusColor,this.hoverColor,this.overlayColor,this.splashRadius,this.focusNode,this.autofocus = false,})
从上面源码中，我们可以看到 Switch 有非常多的属性，下面来介绍一下常用的属性
- activeColor： Color - 激活时原点的颜色。
- activeThumbImage： ImageProvider - 原点还支持图片，激活时的效果。
- activeTrackColor： Color - 激活时横条的颜色。
- inactiveThumbColor： Color - 非激活时原点的颜色。
- inactiveThumbImage： ImageProvider - 非激活原点的图片效果。
- inactiveTrackColor： Color - 非激活时横条的颜色。
- onChanged： ValueChanged - 改变时触发。
- value： → bool - 切换按钮的值。
需要说明的是，Switch 有一个变体 adaptive，也是我们最常用的一个变体：
Switch.adaptive(value: model.isSwitch, onChanged: (value){print(value);model.isSwitch = value;model.notifyListeners();}),
使用效果：
总结
本篇文章就简单的记录到这里，比较简单，我们主要记住 Switch.adaptive 这个变体，就可以了。
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！