Android之shape标签

Android之shape标签

前言

shape算是我们常用的一个标签,他可以生成线条,矩形, 圆形, 圆环,像我们圆角的按钮就可以通过shape来实现,最终Android会把这个带有shape标签的图片解析成一个Drawable对象,这个Drawable对象本质是GradientDrawable.

1.使用shape标签的好处

1. 如果我们需要更改某个shape的相关参数直接找到这个xml文件就可以了
2. android方面对shape做过相关的优化,所以比直接使用png图片或者其他图片文件更加的节省内存
3. 可以节省apk的体积

总体来说

1. 能使用shape代替图片的就是用shape,毕竟更省内存
   2.渐变图层使用shape

2.shape所能绘制的图形

android:shape	用来决定shape是什么图形
line	线
rectangle	矩形, shape默认就是矩形
oval	椭圆 圆形
ring	圆环

3.使用shape图形的例子

提前说明,这里仅仅举例常用的使用方法,我认为一口气学完shape的一切是没有意义的只需要学会常用的方式即可,其他的方式用到学到即可.

3.1 圆角按钮

标签	功能
solid	shape背景的颜色
stroke	shape边框的宽度和颜色
radius	圆角的大小

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    
   <solid android:color="#396531"/>

    <stroke
        android:width="6dp"
        android:color="#000000" />

    <corners android:radius="35dp"/>
</shape>

将这个shape的资源文件作为按钮的背景就可以实现圆角按钮了

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/button"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:text="按钮"
        android:background="@drawable/test"/>

</LinearLayout>

运行结果

3.2 圆形或者椭圆

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <size android:width="10dp"
        android:height="10dp"/>

    <solid android:color="#000"
</shape>

结果

如果想要一个椭圆
只要上述的shape的配置文件中的width="" height=""的值不一样就行

3.3 实线与虚线

实线

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
    <stroke
        android:color="#FF0000"
        android:width="5dp"/>
</shape>

虚线

标签	功能
android:dashGap	每段虚线的间距
android:dashWidth	每段虚线的长度

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
    <stroke
        android:color="#FF0000"
        android:width="5dp"
        android:dashGap="3dp"
        android:dashWidth="10dp"/>
</shape>

3.4 渐变图层

标签	功能
android:angle	渐变的方向, 0 代表从左到右, 45代表从左下到右上, 90代表从下到上 …以此类推
android:startColor	渐变的开始颜色
android:endColor	渐变的结束颜色

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

    <gradient
        android:angle="0"
        android:endColor="#123456"
        android:startColor="#654321" />
</shape>

为了更好的理解渐变方向是什么意思请看下图

4.动态使用shape

动态使用shape我认为有2种形式

1. 第一种是直接创建一个GradientDrawable
2. 得到view的background,并对他进行修改.

4.1直接创建一个GradientDrawbale

 Button button = findViewById(R.id.button);
        //创建对象
        GradientDrawable gd = new GradientDrawable();
        //设置图像类型,比如矩形,圆形
        gd.setGradientType(GradientDrawable.LINEAR_GRADIENT);
        //设置背景颜色
        gd.setColor(Color.GREEN);
        //设置边框的宽度和颜色
        gd.setStroke(15, Color.RED);
        //设置圆角的角度
        gd.setCornerRadius(20.6f);
        //将这个背景作为一个按钮的背景
        button.setBackground(gd);

4.2 得到view的background,并对其进行修改

 Button button = findViewById(R.id.button);
        //创建对象,有下面两种方式
        GradientDrawable gd = (GradientDrawable)button.getBackground();
        GradientDrawable gd1 = (GradientDrawable)getResources().getDrawable(R.drawable.test);
        //设置图像类型,比如矩形,圆形
        gd.setGradientType(GradientDrawable.LINEAR_GRADIENT);
        //设置背景颜色
        gd.setColor(Color.GREEN);
        //设置边框的宽度和颜色
        gd.setStroke(15, Color.RED);
        //设置圆角的角度
        gd.setCornerRadius(20.6f);
        //将这个背景作为一个按钮的背景
        button.setBackground(gd);

在这里补充一下动态生成渐变色
下面的GradientDrawable.Orientation是一个枚举,可以选择你想要的渐变方向

// 创建渐变的shape drawable
int colors[] = { 0xff255779 , 0xff3e7492, 0xffa6c0cd };//分别为开始颜色，中间夜色，结束颜色
GradientDrawable gradientDrawable = new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM, colors);