`
he91_com
  • 浏览: 400962 次
文章分类
社区版块
存档分类
最新评论

设置ToggleButton、Switch、CheckBox和RadioButton的显示效果

 
阅读更多
ToggleButton、Switch、CheckBox和RadioButton都是继承自android.widget.CompoundButton,意思是可选择的,因此它们的用法都很类似。CompoundButton有两个状态,分别是checked和not checked。Switch是android4.0后出现的控件。但是这几个组件的默认图标都不太好看,怎样设置自己的图标风格呢?以下就是我的一种解决方案。

先看一下效果图,如下:



按钮图片贡献如下:


实现过程:

1.建立/res/drawable/setting_checkbox_button.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/on_button" android:state_checked="true"/>
    <item android:drawable="@drawable/off_button" android:state_checked="false"/>
</selector>

2、在values/styles.xml中添加如下代码:

 <style name="MyToggleButton" parent="@android:style/Widget.CompoundButton">
        <item name="android:button">@drawable/setting_checkbox_button</item>
    </style>

3.layout布局文件/res/layout/togglebutton_switch2.xml如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:id="@+id/layout1"
    android:gravity="center_horizontal">

    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:gravity="center"
        android:text="toggle is checked..." />

    <ToggleButton
        android:id="@+id/togglebutton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/text1"
        android:background="#00000000"
        style="@style/MyToggleButton"
        android:checked="true"
        android:textOff="关闭"
        android:textOn="打开" />

     <Switch
        android:id="@+id/witch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:layout_below="@id/togglebutton"
        android:layout_alignLeft="@id/togglebutton"
        android:checked="true"
        android:textOff="关闭"
        android:textOn="打开"
        android:thumb="@drawable/tb_thumb"
        android:track="@drawable/tb_track" />
    
    
    <CheckBox
        android:id="@+id/check"
        style="@style/MyToggleButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/witch"
        android:checked="true"
        android:textOff="关闭"
        android:textOn="打开" />

    <RadioButton
        android:id="@+id/redio"
        style="@style/MyToggleButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/check"
        android:checked="false"
        android:textOff="关闭"
        android:textOn="打开" />

    <ToggleButton
        android:id="@+id/togglebutton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:button="@drawable/compound_button"
        android:layout_below="@id/redio"
        android:layout_alignLeft="@id/redio"
        android:visibility="gone"/>
    
    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/redio"
        android:layout_gravity="center" 
        android:layout_alignLeft="@id/redio">

        <Switch
            android:id="@+id/witch"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:checked="true"
            android:textOff="关闭"
            android:textOn="打开"/>
    </FrameLayout>

</RelativeLayout>

以上写的还有一问题,就是最后控件RadioButton点不了;还有就是把android:layout_width="wrap_content"改成android:layout_width="match_parent"布局会出错。可能这个方法还不太好,我也是在学习中,欢迎大家一起讨论,有更好的实现方式请一定告诉我哦!微笑


有一个网友写的可以整个项目控制ToggleButton的风格,我看了一下,第2步设置Style & Theme的地方看不太懂,写/res/drawable/themes.xml这个文件时在我这里会报错。大家可以参考一下:http://blog.csdn.net/billpig/article/details/6634481


分享到:
评论

相关推荐

    Android 2.2下能用的SwitchButton

    3. **使用ToggleButton代替**:在没有Switch的旧版本中,可以使用ToggleButton模拟开关效果,通过设置不同的背景图和文字来区分开/关状态。 4. **自定义主题和样式**:通过设置自定义的主题和样式,改变Toggle...

    自定义安卓中的Switch控件

    Switch控件是Android提供的一个ToggleButton的升级版,它结合了CheckBox和RadioButton的功能,用户可以通过滑动来改变开关状态。自定义Switch控件主要是为了扩展其默认样式和交互效果,例如改变滑块颜色、文字颜色...

    Android按钮组件

    Android - 按钮 Button 9patch RadioButton CheckBox ToggleButton Switch 组件详解 代码, 讲解博客地址 : http://blog.csdn.net/shulianghan/article/details/18265819

    Android课件(常用控件).zip

    13. Switch(开关):与ToggleButton类似,但外观和交互更符合用户习惯,常用于设置开关状态。 14. AlertDialog和ProgressDialog:对话框用于显示弹窗信息,AlertDialog用于交互式对话,ProgressDialog则用于展示...

    android常用控件

    Switch是另一种切换控件,它提供了更友好的视觉效果,常用于设置的开关选项。 通过学习和熟练掌握这些控件的使用,开发者可以创建出丰富的用户界面,提供良好的用户体验。同时,理解如何绑定事件监听器和处理用户...

    Android 多种android控件的Demo.rar

    在布局文件中,我们可以通过`&lt;Button&gt;`标签定义按钮,并通过设置`text`属性来显示文字内容。 2. TextView(文本视图): TextView用于显示单行或多行文本,可以设置文字、字体、颜色等属性。通过`&lt;TextView&gt;`标签...

    android.widget合集(上)(20篇)

    10. **CheckBox** 和 **RadioButton** 的 Compound Button 形式:可以通过设置android:checkMark属性添加自定义图标,使选择项更具视觉吸引力。 11. **ListView** 和 **GridView**:这两个是布局管理器,用于展示...

    Android 组件

    autocompletetextview自动完成文本框 spinner switch状态切换 ToggleButton功能切换 单选按钮(RadioButton)和复选框(CheckBox) 时钟(AnalogClock和DigitalClock)的功能和功法

    安卓常用控件例子集合

    5. **RadioButton** 和 **CheckBox**:选择项控件,用于单选和多选。它们常用于设置选项或切换状态,示例会展示如何管理它们的选中状态。 6. **Spinner**:下拉选择框,用于提供多个选项供用户选择。示例可能包括...

    安卓开发-一个Demo搞定30个控件.zip

    17. Switch(开关):与ToggleButton相似,但视觉效果更像iOS的开关。 18. CheckboxGroup(复选框组):管理一组CheckBox,方便处理多选逻辑。 19. RadioGroup(单选按钮组):管理一组RadioButton,确保只选中一个...

    Android控件操作-二十四章经 - v1.01

    第五章“开关按钮ToggleButton和Switch”介绍了两种常见的开关控件,讲解了它们的状态切换和事件监听,为用户提供直观的开/关选项。 第六章“切换类TextSwitcher和ImageSwitcher”则介绍了用于动态切换文本和图像的...

    android开发技术文档中文版来之不易(农民伯伯版)

    6. **Compound Button**:如Switch和ToggleButton,组合按钮的使用和交互设计。 7. **通知栏Widgets**:如何创建和管理App Widgets,使应用能在主屏幕提供快捷操作。 这两份文档很可能是对Android Widget系统全面而...

    android控件大全

    此外,还有许多其他控件,如ImageButton(结合了图像和按钮功能)、CheckBox(多选)、ToggleButton(开关)和AutoCompleteTextView(自动完成输入)等。 在使用这些控件时,可以通过XML布局文件进行声明和配置,...

    一个Demo搞定30个控件

    15. **Switch**:开关控件,与ToggleButton类似,但外观更像iOS的开关。 16. **RadioButton** 和 **RadioButton** 组合使用:实现单选功能,用户只能选择其中一个。 17. **CheckBox** 和 **CheckBox** 组合使用:...

    android开发范例大全第四章-超豪华的手机控件

    3. TextView(文本视图):用于显示静态文本,可以进行格式化和样式设置。 4. ImageView(图像视图):用于展示图片,支持多种格式,如JPEG、PNG等。 5. RadioButton(单选按钮):在一组选项中只能选择一个,常...

    Android控件及布局的使用

    - **TextView**:用于显示文本信息,可以通过设置属性来改变字体大小、颜色等。 ##### 4.3.2 Button - **Button**:用户点击触发事件的按钮。 ##### 4.3.3 ImageButton - **ImageButton**:图像按钮,点击时执行...

    Android编程之Button控件用法实例分析

    间接子类有:CheckBox,RadioButton,Switch,ToggleButton. Button类表示一个“按钮”控件。“按钮”控件可以被用户按下或者点击,来触发另一个操作。 二、Button的用法 一种典型的用法: public class MyActivity ...

    Android 一个Demo搞定30个控件源码.zip

    16. Switch:与ToggleButton类似,但设计风格更现代。 17. TabLayout:标签页布局,用于切换不同的内容区域。 18. Toolbar:可定制的顶部导航栏。 19. FloatingActionButton:浮出操作按钮,常用于添加或编辑操作。 ...

    Android应用源码之一个Demo搞定30个控件.zip

    5. RadioButton(单选按钮)和RadioGroup:在一组选项中只能选择一个,常用于设置偏好或简单选择。 6. CheckBox(复选框):允许用户选择多个选项,常用于列表项的选择。 7. Spinner(下拉列表):提供一个可折叠...

Global site tag (gtag.js) - Google Analytics