Android Shape 详细使用

一、简介

• 在 Android 开发中，可以使用 shape 定义各种各样的形状，也可以定义一些图片资源，相对于传统图片来说，使用 shape 可以减少资源占用，减少安装包大小，还能够很好地适配不同尺寸的手机。

二、子标签属性

• Shape 子标签属性可以定义控件的一些展示效果，例如 圆角、渐变、填充、描边、大小、边距 …

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android"
  
         android:shape=["rectangle" | "oval" | "line" | "ring"] > // 定义形状
  
      <corners // 圆角属性
  
          android:radius="integer"
  
          android:topLeftRadius="integer"
  
          android:topRightRadius="integer"
  
          android:bottomLeftRadius="integer"
  
          android:bottomRightRadius="integer" />
  
      <gradient // 渐变属性
  
          android:angle="integer"
  
          android:centerX="integer"
  
          android:centerY="integer"
  
          android:centerColor="integer"
  
          android:endColor="color"
  
          android:gradientRadius="integer"
  
          android:startColor="color"
  
          android:type=["linear" | "radial" | "sweep"]
  
          android:useLevel=["true" | "false"] />
  
      <padding // 边距属性
  
          android:left="integer"
  
          android:top="integer"
  
          android:right="integer"
  
          android:bottom="integer" />
  
      <size // 大小属性
  
          android:width="integer"
  
          android:height="integer" />
  
      <solid // 填充属性
  
          android:color="color" />
  
      <stroke // 描边属性
  
          android:width="integer"
  
          android:color="color"
  
          android:dashWidth="integer"
  
          android:dashGap="integer" />
  
  </shape>
  

• corners：用来定义圆角。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  
      <corners // 定义圆角
  
          android:radius="20dp" // 全部的圆角半径
  
          android:topLeftRadius="10dp" // 左上角的圆角半径
  
          android:topRightRadius="10dp" // 右上角的圆角半径
  
          android:bottomLeftRadius="10dp" // 左下角的圆角半径
  
          android:bottomRightRadius="10dp" /> // 右下角的圆角半径
  
  </shape>
  

• solid：用以指定内部填充色。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  
      <solid android:color="#f66"/> // 内部填充色
  
  </shape>
  

• gradient：用以定义渐变色，可以定义 两色渐变、三色渐变 及 渐变样式。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  
      <gradient
  
          android:type=["linear" | "radial" | "sweep"] // 共有3中渐变类型：线性渐变（默认）、放射渐变、扫描式渐变；
  
          android:angle="90" // 渐变角度，必须为45的倍数，0为从左到右，90为从上到下；
  
          android:centerX="0.5" // 渐变中心X的相当位置，范围为0～1；
  
          android:centerY="0.5" // 渐变中心Y的相当位置，范围为0～1；
  
          android:startColor="#24e9f2" // 渐变开始点的颜色；
  
          android:centerColor="#2564ef" // 渐变中间点的颜色，在开始与结束点之间；
  
          android:endColor="#25f1ef" // 渐变结束点的颜色；
  
          android:gradientRadius="5dp" // 渐变的半径，只有当渐变类型为radial时才能使用；
  
          android:useLevel="false" /> // 使用 LevelListDrawable 时就要设置为true。设为 false 时才有渐变效果。
  
  </shape>
  

• stroke：是描边属性，可以定义描边的 宽度、颜色、虚实线 等。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  
      <stroke
  
          android:width="1dp" // 描边的宽度
  
          android:color="#ff0000" // 描边的颜色
  
          // 以下两个属性设置虚线
  
          android:dashWidth="1dp" // 虚线的宽度，值为0时是实线
  
          android:dashGap="1dp" /> // 虚线的间隔
  
  </shape>
  

• padding：用来定义内部边距。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  
      <padding
  
          android:left="10dp" // 左内边距；
  
          android:top="10dp" // 上内边距；
  
          android:right="10dp" // 右内边距；
  
          android:bottom="10dp" /> // 下内边距。
  
  </shape>
  

• size：用来定义图形的大小的。

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

三、特殊属性

• Shape 特殊属性可以定义当前 Shape 的形状，比如 矩形、椭圆形、线形、环形 … 这些都是通过 Shape 标签属性。

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android"
  
         android:shape=["rectangle" | "oval" | "line" | "ring"] // Shape 的形状，默认为矩形，可以设置为矩形(rectangle)、椭圆形(oval)、线性形状(line)、环形(ring)
  
         // 下面的属性只有在 android:shape="ring" 时可用：
  
         android:innerRadius="10dp" // 内环的半径
  
         android:innerRadiusRatio="2" // 浮点型，以环的宽度比率来表示内环的半径
  
         android:thickness="3dp" // 环的厚度
  
         android:thicknessRatio="2" // 浮点型，以环的宽度比率来表示环的厚度
  
         android:useLevel="false"> // boolean 值，如果当做是 LevelListDrawable 使用时值为 true，否则为 false。
  
  </shape>
  

• rectangle：矩形

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

• oval：椭圆

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

• line：线

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android"
  
         android:shape="line">
  
      <stroke
  
          android:width="1dp"
  
          android:color="@color/colorAccent"
  
          android:dashGap="3dp" // 虚线间距
  
          android:dashWidth="4dp" /> // 虚线宽度
  
      <size android:height="3dp" />
  
  </shape>
  

• ring：圆环

  <?xml version="1.0" encoding="utf-8"?>
  
  <shape xmlns:android="http://schemas.android.com/apk/res/android"
  
        android:shape="ring"
  
        android:useLevel="false"
  
        android:innerRadius="20dp" // 内环的半径
  
        android:thickness="10dp"> // 圆环宽度
  
      <!-- useLevel需要设置为 false -->
  
      <solid android:color="@color/colorAccent"/>
  
  </shape>
  

四、使用

• Shape 文件新建在 res/drawable 文件夹下，例如 shape_text.xml

  

  

  

• shape_text.xml

  <?xml version="1.0" encoding="utf-8"?>
  <shape xmlns:android="http://schemas.android.com/apk/res/android">
      <!-- 设置一个边框 -->
      <stroke android:width="5px" android:color="#f11" />
      <!-- 背景渐变-->
      <gradient
          android:angle="90"
          android:endColor="#fcf"
          android:startColor="#cff"/>
      <!-- 给使用容器添加内间距 -->
      <padding
          android:left="20dp"
          android:top="20dp"
          android:right="20dp"
          android:bottom="20dp"/>
  </shape>
  

• 布局中使用

  <?xml version="1.0" encoding="utf-8"?>
  <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      tools:context=".MainActivity">
      <!-- 流水布局 -->
      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:orientation="vertical"
          android:gravity="center">
          <!-- 输入框 -->
          <TextView
              android:id="@+id/dzm"
              android:layout_width="300dp"
              android:layout_height="300dp"
              android:text="@string/app_name"
              android:textSize="50sp"
              android:background="@drawable/shape_text" />
      </LinearLayout>
  
  </androidx.constraintlayout.widget.ConstraintLayout>
  

  

标签：定义,渐变,Shape,shape,描边,详细,Android,属性
来源： https://blog.csdn.net/zz00008888/article/details/120534932