Flutter教学目录持续更新中
Github源代码持续更新中
1.Switch/SwitchListTile介绍
2.Switch属性
- value：true：开 false：关
- onChanged：变化时回调
- activeColor：打开状态下颜色
- activeTrackColor：打开状态下track颜色
- inactiveThumbColor：关闭状态thumb颜色
- inactiveTrackColor：关闭状态track颜色
- activeThumbImage：打开状态下thumb图片
- onActiveThumbImageError：打开状态下thumb图片错误回调
- inactiveThumbImage：关闭状态thumb图片
- onInactiveThumbImageError：关闭状态thumb图片错误回调
- autofocus = false：
3.SwitchListTile属性
- value：true：开 false：关
- onChanged：变化时回调
- activeColor：打开状态下颜色
- activeTrackColor：打开状态下track颜色
- inactiveThumbColor：关闭状态thumb颜色
- inactiveTrackColor：关闭状态track颜色
- activeThumbImage：打开状态下thumb图片
- inactiveThumbImage：关闭状态thumb图片
- title：主标题
- subtitle：副标题
- dense：是否是listView子节点
- contentPadding：内边距
- secondary：图标
- selected = false：是否选中
- autofocus = false：
- controlAffinity = ListTileControlAffinity.platform： 排列顺序
4.Switch
track：轨道
thumb：圆球
Image属性会替代对应的Color属性，只有在设置Image属性的情况下才可以设置ImageError属性
1601262958501.jpg
1601262971258.jpg
1601262999653.jpg
1601263013332.jpg
var _onOff = true;
_mySwitch() {
return Switch(
value: _onOff,
activeColor: Colors.red,
activeTrackColor: Colors.green,
inactiveThumbColor: Colors.deepPurple,
inactiveTrackColor: Colors.amber,
// activeThumbImage: AssetImage('images/scan.png'),
// inactiveThumbImage: NetworkImage(widget._imageUrl),
// onActiveThumbImageError: (e, s) {
// ToastUtil.showToast('onActiveThumbImageError');
// },
// onInactiveThumbImageError: (e, s) {
// ToastUtil.showToast('onActiveThumbImageError');
// },
onChanged: (value) {
setState(() {
_onOff = value;
});
},
);
}
5.SwitchListTile
1601263088483.jpg
1601263103164.jpg
_mySwitchListTile() {
return SwitchListTile(
value: _onOff,
activeColor: Colors.red,
activeTrackColor: Colors.green,
inactiveThumbColor: Colors.deepPurple,
inactiveTrackColor: Colors.amber,
// activeThumbImage: AssetImage('images/scan.png'),
// inactiveThumbImage: NetworkImage(widget._imageUrl),
title: Text('开启灯光'),
subtitle: Text('卧室灯'),
dense: true,
// contentPadding: EdgeInsets.all(10),
selected: _onOff,
secondary: Icon(Icons.people),
controlAffinity: ListTileControlAffinity.platform,
onChanged: (value) {
setState(() {
_onOff = value;
});
});
}
下一节：Material组件之Slider
