1 page.title=Switches 2 page.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 6 buttons, 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>Checkboxes allow the user to select multiple options from a set. Avoid using a single checkbox to 20 turn 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 36 selection if you think that the user needs to see all available options side-by-side. Otherwise, 37 consider 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