Android Switch控件修改样式

简介: Android Switch控件修改样式

Android中自带的Switch控件在很多时候总觉得和整体系统风格不符,很多时候,自定义Switch是一种方法。

但其实不用这么麻烦,安卓自带的Switch通过修改一些属性,也可以达到和自定义Switch差不多的一个效果。

个人感觉,Switch的属性设置和其他控件还是有挺大区别的。因此,写下此文,方便有需要的同学参考。

先上效果图:

image.png

以上便是修改后效果 与 原生Switch的效果对比。代码在文章底部给出

实现方式:

1.底部滑动条,在开关打开状态为绿色,开关关闭状态为灰色

在 res/drawable 文件夹下面,写两个滑动条的底图 ,通过一个选择器selector进行控制。

gray_track.xml :非打开状态,灰色的底图

   android:shape="rectangle" >

 

 

 

 

   

   

   

 

       android:endColor="#888888"

       android:startColor="#888888" />

 

green_track.xml:打开状态下,绿色的底图。

 

 

 

 

   

   

 

       android:endColor="#33da33"

       android:startColor="#33da33" />

 

选择器 track.xml   用于控制Switch不同状态下,滑动条的底图

 

2. 滑动按钮:底色我用的接近白色的淡灰色,打开时,边上的一圈线条为灰色,关闭时,边上的一圈线条为绿色

实现方式和底部滑动一致

gray_thumb.xml  :关闭状态,按钮边上一圈颜色为深灰色

   android:shape="rectangle" >

 

 

 

 

   

   

   

   

 

       android:endColor="#eeeeee"

       android:startColor="#eeeeee" />

   

 

       android:color="#666666"/>

 

green_thumb.xml : 打开状态,按钮边上一圈的颜色为绿色

   android:shape="rectangle" >

 

 

 

 

   

   

   

   

 

       android:endColor="#eeeeee"

       android:startColor="#eeeeee" />

   

 

       android:color="#33da33"/>

 

选择器 thumb.xml   用于控制Switch不同状态下,按钮的显示状态

   

3. 将以上选择器设置给Switch,就好了

界面  activity_main.xml

   android:layout_width="match_parent"

   android:layout_height="match_parent"

   android:orientation="vertical" >

 

 

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:switchMinWidth="20dp"

       android:textOn="  "

       android:textOff="  "

       android:thumb="@drawable/thumb"

       android:track="@drawable/track" />

   

 

 

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       />

 

4.高度,宽度的设置

细心的同学会发现,修改  android:layout_width  , android:layout_height  这两个属性,并不会实际修改Switch的大小

设置大了,边上会出现空白部分,设置小了,Switch显示不全。

实际设置高度方法:

上面定义滑动条和按钮底图的地方相信大家都注意到,     这行代码,

修改  green_track.xml,gray_track.xml  中的高度,即可修改高度(修改green_thumb.xml  gray_thumb.xml  中的高度貌似无效)。

实际修改宽度的方法:

(1)修改滑动按钮的宽度:滑动按钮的宽度和按钮上的文字有关,

想要按钮变长,在按钮显示的文字上添加几个空字符串即可,想要按钮变短的话,减少按钮上显示的字即可(修改按钮上字体大小也可以试试)

Switch的属性

       android:textOn="  "

       android:textOff="  "

(2)修改按钮  打开,关闭  两种状态之间滑动距离(貌似小到一定程度,再改小就无效了)

Switch的属性

android:switchMinWidth="20dp"


相关文章
|
4月前
|
XML Java Android开发
Android Studio App开发中改造已有的控件实战(包括自定义支付宝月份选择器、给翻页栏添加新属性、不滚动的列表视图 附源码)
Android Studio App开发中改造已有的控件实战(包括自定义支付宝月份选择器、给翻页栏添加新属性、不滚动的列表视图 附源码)
40 1
|
4月前
|
Java Android开发
Android Studio入门之按钮触控的解析及实战(附源码 超详细必看)(包括按钮控件、点击和长按事件、禁用与恢复按钮)
Android Studio入门之按钮触控的解析及实战(附源码 超详细必看)(包括按钮控件、点击和长按事件、禁用与恢复按钮)
161 0
|
11天前
|
XML Java Android开发
Android之UI基础控件
Android之UI基础控件
|
1月前
|
Android开发
[Android]RadioButton控件
[Android]RadioButton控件
12 0
|
3月前
|
Android开发
分享88个Android控件源代码总有一个是你想要的
分享88个Android控件源代码总有一个是你想要的
22 0
|
3月前
|
Android开发
分享89个Android控件源代码总有一个是你想要的
分享89个Android控件源代码总有一个是你想要的
71 0
|
8月前
|
前端开发 Android开发
前端项目实战壹-安卓4.4/6.0无法安装非原生项目无法渲染样式
前端项目实战壹-安卓4.4/6.0无法安装非原生项目无法渲染样式
47 0
|
4月前
|
XML Android开发 数据格式
[Android]开关控件Switch
[Android]开关控件Switch
35 0
|
4月前
|
Android开发 Kotlin
android开发,使用kotlin学习滚动控件RecyclerView
android开发,使用kotlin学习滚动控件RecyclerView
36 0
|
4月前
|
XML Java Android开发
Android Studio App开发中高级控件下拉列表Spinner的讲解及实战(附源码 超详细必看)
Android Studio App开发中高级控件下拉列表Spinner的讲解及实战(附源码 超详细必看)
72 0