1page.title=Switches
2page.tags=switch,checkbox,radiobutton,button
3@jd:body
4
5<p>Switches allow the user to select options. There are three kinds of switches: checkboxes, radio
6buttons, and on/off switches.</p>
7
8
9
10<h2 id="checkboxes">Checkboxes</h2>
11
12<a class="notice-developers" href="{@docRoot}guide/topics/ui/controls/checkbox.html">
13  <div>
14    <h3>Developer Docs</h3>
15    <p>Checkboxes</p>
16  </div>
17</a>
18
19<p itemprop="description">Checkboxes allow the user to select multiple options from a set. Avoid using a single checkbox to
20turn an option off or on. Instead, use an on/off switch.</p>
21
22  <img src="{@docRoot}design/media/switches_checkboxes.png">
23
24
25
26<h2 id="radio-buttons">Radio Buttons</h2>
27
28<a class="notice-developers" href="{@docRoot}guide/topics/ui/controls/radiobutton.html">
29  <div>
30    <h3>Developer Docs</h3>
31    <p>Radio Buttons</p>
32  </div>
33</a>
34
35<p>Radio buttons allow the user to select one option from a set. Use radio buttons for exclusive
36selection if you think that the user needs to see all available options side-by-side. Otherwise,
37consider a spinner, which uses less space.</p>
38
39  <img src="{@docRoot}design/media/switches_radios.png">
40
41
42
43<h2 id="switches">On/off Switches</h2>
44
45<a class="notice-developers" href="{@docRoot}guide/topics/ui/controls/togglebutton.html">
46  <div>
47    <h3>Developer Docs</h3>
48    <p>Toggle Buttons</p>
49  </div>
50</a>
51
52<p>On/off switches toggle the state of a single settings option.</p>
53
54  <img src="{@docRoot}design/media/switches_switches.png">
55
56
57