The film Bowen lacks technical content, is a brief look at use CupertinoSwitch components. Let's look at the specific operating results:
a single run from the effects of view we can know:
1, CupertinoSwitch can be independently set to open state colors, such as green and blue image above
2, the switch can be controlled if you can use
Let's look at specific settings, CupertinoSwitch has three attributes:
value: Boolean value, true means open the switch, the switch means closed to false
activeColor: Color type, set to open when the color, such as blue and green on FIG. Detailed description of Flutter Color, refer to this blog bloggers, wherein activitColor default is green, a desired color can be set according to their needs
onChanged: function type, for controlling the closing and opening of the switch, when onChanged pass a null value when the function is prohibited to change the opening and closing state CupertinoSwitch.
So its use is very simple:
= _switchValue to false BOOL;
@override
the Widget Build (BuildContext context) {
return CupertinoSwitch (
value: _switchValue,
the onChanged: (BOOL value) {/// click switch the state of
the setState (() {
_switchValue = value;
});
} / End onChanged //
);
}
. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
. 9
10
. 11
12 is
13 is
if you want CupertinoSwitch unchangeable state, then put the above onChanged set to null, namely:
@override
the Widget Build (BuildContext context) {
return CupertinoSwitch (
value: to true, the default open and prohibit off ///
activeColor: Colors.blue, /// blue custom colors
the onChanged: null
);
}
. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
additional item used in this assembly is also very simple in ListView strength code is as follows:
ListTile (/// ListTile the item is Flutter ListView assembly
title: Text ( 'ListView item embedded CupertinoSwitch'),
trailing: CupertinoSwitch (
value: _switchValue,
the onChanged: (BOOL value) {
the setState (() {value = _switchValue;} );
},
),
onTap in: () {/// click item, while switching the switching state CupertinoSwitch
the setState (() = {_switchValue _switchValue;!});
},
);
. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
. 9
10
. 11
12 is
of course also provided a Flutter Switch component, this component is provided in addition to providing the above CupertinoSwitch same function, but also provides a richer fine control, such as further provided activeTrackColor, inactiveThumbColor, inactiveTrackColor, activeThumbImage, inactiveThumbImage attributes .
For example, if you do use an item in the ListView, you can use the following code as follows:
ListTile (/// ListTile the item is Flutter ListView assembly
title: Text ( 'can be opened and closed'),
onTap in: () {
the setState (() {
switchValue = switchValue;!
});
},
/// use Switch. Adaptive
trailing: Switch.adaptive (
value: switchValue,
the onChanged: (BOOL value) {
the setState (() {
switchValue = value;
});
}
),
),
. 1
2
. 3
. 4
. 5
. 6
. 7
. 8
. 9
10
. 11
12 is
13 is
14
15
16
17
of course, more comprehensive Fullter consideration, provides us with a SwitchListTile ListView to use, simple operation effect can be intuitively understood by drawing:
Incidentally, accompanied by the source code on the map:
import 'package:flutter/material.dart';
class SwitchDemo extends StatefulWidget {
@override
_SwitchState createState() => _SwitchState();
}
bool switchValue = false;
State _SwitchState the extends class <SwitchDemo> {
@override
the Widget Build (BuildContext context) {
return the Scaffold (
appbar: the AppBar (
title: Center (Child: the Text ( "Switch using a simple series")),
Elevation: 0.0,
),
body: the ListView (
Children: <the Widget> [
ListTile (
/// ListTile the item is Flutter ListView assembly
title: Text ( 'by default, and prohibit off'),
trailing: Switch.adaptive (
value: to true, activeColor: Colors.red, the onChanged: null),
),
ListTile (
/// ListTile the item is Flutter ListView assembly
title: Text ( 'off by default, and the opening prohibiting'),
trailing: Switch.adaptive (value: to false, the onChanged: null),
),
ListTile (
/// ListTile the item is Flutter ListView assembly
title: Text ( 'can be opened and closed (open set to red)'),
onTap in: () {
the setState (() {
! = SwitchValue switchValue;
});
},
///使用Switch.adaptive
trailing: Switch.adaptive(
value: switchValue,
activeColor: Colors.red,
onChanged: (bool value) {
setState(() {
switchValue = value;
});
}),
),
SwitchListTile(
title: Text('SwitchListTile的简单使用（默认打开蓝色）'),
value: switchValue,
onChanged: (bool value) {
setState((http://www.my516.com) {
switchValue = value;
});
})
],
));
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61 is
62 is
63 is
64
this post this end, the two components is also very simple to use, do not in the description.
---------------------