Flutter Switch 开关控制

参数详解

属性	说明
value	当前开关状态 布尔值
onChanged	监听（开关状态改变时调用）
activeColor	打开 状态 轨道 和 按钮颜色
activeTrackColor	打开 状态轨道颜色
inactiveThumbColor	关闭 状态按钮颜色
inactiveTrackColor	关闭 状态轨道颜色
activeThumbImage	打开 状态下按钮图片
inactiveThumbImage	关闭 状态下按钮图片
materialTapTargetSize	配置tap目标的最小大小
dragStartBehavior	确定处理拖动启动行为的方式。（没看出有什么变化）

Flutter 还提供了仿苹果的Switch组件CupertinoSwitch。下面来介绍一下：

属性	说明
value	当前开关状态 布尔值
onChanged	监听（开关状态改变时调用）
activeColor	打开 状态 轨道 和 按钮颜色

代码示例

Switch代码示例

Switch(
  activeColor:Colors.red,
  activeTrackColor:Colors.yellow,
  inactiveThumbColor:Colors.pink[200],
  inactiveTrackColor:Colors.black,
  activeThumbImage:AssetImage('images/aa.jpg'),
  inactiveThumbImage:AssetImage('images/ba.jpg'),
  dragStartBehavior:DragStartBehavior.start,
  
  value: this.valuea,
  onChanged: (bool v) {
    setState(() {
      this.valuea = v; 
    });
  }, 
),

CupertinoSwitch 代码示例 

CupertinoSwitch(
  value: this.valueb,
  onChanged: (bool value) { 
    setState(() { 
      this.valueb = value; 
    }); 
  },
),

效果图

完整代码

查看完整代码