系统提供的控件有时候并不能满足我们的需求,因此我们使用自定义控件,下面介绍Button高亮 ,Edittext的高亮,自定义Seekbar,Edittext的风格,并介绍ShapeDrawable!
1.Button点击高亮
当我们点击button按钮时,button按钮的颜色应当发生变化,不然用户不确定自己点击的button是否生效,我们选择两种颜色,一种是正常状态下的红色,一种是点击状态下的深红色,在drawable目录下新建一个xml文件,代码如下:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!--当点击button按钮时,button的颜色--> <item android:state_pressed="true" android:drawable="@color/c1"></item> <!--当未点击button按钮时,button的颜色--> <item android:state_pressed="false" android:drawable="@color/c10"></item> <!--state_press="true|false"是确定按钮是否被点击--> <!--c1和c10是我在color里自定义的两种颜色--> </selector>
需要注意的是android:drawable不可以更换成android:color,否则会报错噢
然后在layout布局中新建一个Button组件并引用上面我们定义的xml文件,代码如下
<Button android:text="高亮BUTTON" android:layout_margin="@dimen/spaceing" android:background="@drawable/button_style" android:layout_width="match_parent" android:layout_height="wrap_content" /> <!--button_style是我们刚才写的xml文件-->
运行代码,点击按钮就可以看见效果
2.自定义SeekBar
Seekbar是拖动条,拖动后颜色或状态会发生变化,这里先准备两张颜色不一样但是形状一样的图片,然后在drawable目录下新建一个XML文件,代码如下
<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <!--定义轨道的背景--> <item android:id="@android:id/background" android:drawable="@drawable/heart_black"/> <!--定义已完成轨道的背景--> <!--heart和heart_black是我放在drawable目录下的两张图片--> <item android:id="@android:id/progress" android:drawable="@drawable/heart"/> </layer-list>
注意:需要指定id!
然后再layout布局中新建一个SeekBar组件,引用我们刚才定义的xml,代码如下
<SeekBar android:layout_margin="@dimen/spaceing" android:max="100" android:progressDrawable="@drawable/my_bar" <!--my_bar是刚才定义xml文件的名称--> android:layout_width="match_parent" android:layout_height="wrap_content" />
然后运行,可以看见效果
3.Edittext高亮显示
过程和一类似,直接贴代码
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <!--state_focused是判断当前文本框是有焦点即是否被选中--> <item android:state_focused="true" android:color="@color/c1"/> <item android:state_focused="false" android:color="@color/c2"/> </selector>
注意这里是android:color!
然后在布局新建一个Edittext然后设置textColor属性的值为我们定义的xml文件即可
运行即可看到效果
4.自定义Edittext背景
首先还是要新建xml文件,然后根目录为shape,根据自己想要的风格去设置以下几个属性的值,如下
<!--定义几何形的四个角度的弧度--> <corners/> ridus的值越大,弧度越大,可以分别对四个角指定弧度,但是没什么必要 <!--定义使用渐变颜色填充--> <gradient/> 渐变颜色主要是起始颜色,终止颜色,以及angle <!--定义几何形状的内边距--> <padding/> 指定上下左右的内边距,比如说edittext则是指定输入字体与整个框上下左的边距 <!--定义几何形状的大小--> <size/> 定义宽度和高度 <!--定义使用单种颜色填充--> <solid/> 设置单种固定颜色的填充 <stroke/> <!--定义为几何形状绘制边框-->
我写了四个Edittext背景的代码,分别如下
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!--设置填充颜色--> <solid android:color="@color/c7"/> <!--设置四周的内边距--> <padding android:left="@dimen/spaceing" android:bottom="@dimen/spaceing" android:right="@dimen/spaceing" android:top="@dimen/spaceing"/> <!--设置边框--> <stroke android:width="3dip" android:color="@color/c9"/> </shape>
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <!--定义填充渐变颜色--> <gradient android:startColor="@color/c1" android:endColor="@color/c3" android:angle="45"/> <!--设置内填充--> <padding android:top="@dimen/spaceing" android:right="@dimen/spaceing" android:bottom="@dimen/spaceing" android:left="@dimen/spaceing"/> <!--设置圆角矩形--> <corners android:radius="20dp"/> </shape>
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <!--定义填充渐变颜色--> <gradient android:startColor="@color/c1" android:endColor="@color/c3" android:angle="45" android:type="linear"/> <!--设置内填充--> <padding android:left="@dimen/spaceing" android:bottom="@dimen/spaceing" android:right="@dimen/spaceing" android:top="@dimen/spaceing"/> <!--设置圆角矩形--> <corners android:radius="8dp"/> </shape>
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <stroke android:width="2dip" android:color="@color/c2" android:dashGap="5dip" android:dashWidth="100dp"/> </shape>
在layout布局中新建四个Edittext,并分别设置四个background为上面自定义的四个xml文件即可 主要记清楚ShapeDrawable几个属性的用法。
总的效果如图所示 
文章来源: https://blog.csdn.net/weixin_43927892/article/details/96991870