【Android程序开发】shape属性的简介和使用

目录

• 1.shape简介

• 2.shape属性详解

• 3.shape简单使用

具体操作

一、shape简介

设置shape属性的路径：

drawable->new->Drawable resource file

image.png
设置File name->点击ok
image.png

shape的形状，默认为矩形，可以设置为:
矩形（rectangle）、椭圆形(oval)、线性形状(line)、环形(ring)

二、shape属性详解

1.属性基本语法实例

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    <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>

2.shape基本属性介绍

• corner 定义圆角的大小

corners(定义圆角）	作用域
android:radius="10dp"	全部的圆角半径
android:topRightRadius="5dp"	右上角的圆角半径
android:topLeftRadius="5dp"	左上角的圆角半径
android:bottomLeftRadius="5dp"	左下角的圆角半径
android:bottomRightRadius="5dp"	右下角的圆角半径

• solid 填充颜色

solid（填充颜色)	作用域
android:color="#ffff00"	内部填充颜色

• gradient 渐变

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时才有渐变效果

• padding 定义内部边距

padding (内部边距)	作用域
android:left="10dp"	左内边距
android:top="10dp"	上内边距
android:right="10dp"	右内边距
android:bottom="10dp"	下内边距

• stroke 描边

stroke（描边）	作用域
android:width="1dp"	描边的宽度
android:color="#ff0000"	描边的颜色
-------以下两个属性设置虚线 -------
android:dashWidth="1dp"	虚线的宽度，值为0时是实线
android:dashGap="1dp"	虚线的间隔

• size 定义图形大小

size（图形大小）	作用域
android:width="50dp"	宽度
android:height="50dp"	高度

三、shape简单使用

• 案例一
  新建shape_rectangle.xml文件

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners  
        android:radius="5dp"
        android:topLeftRadius="15dp"
        android:topRightRadius="15dp"
        android:bottomLeftRadius="15dp"
        android:bottomRightRadius="15dp" />
     
    <gradient
        android:startColor="#ff0000"
        android:endColor="#00ff00"
        android:angle="90"/> 
        
    <padding 
         android:left="10dp"
         android:top="10dp"
         android:right="10dp"
         android:bottom="10dp"/>
     
    <size
        android:width="200dp"
        android:height="200dp"/>
    
    <solid 
        android:color="@color/colorAccent"/>
    
    <stroke 
        android:width="2dp"
        android:color="@color/colorAccent"/> 
</shape>

在布局中引用shape_rectangle.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/shape_rectangle"/>
</LinearLayout>

• 案例二-（shape的嵌套）
  新建btn_shape_color.xml文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--无效状态 深灰色-->
    <item android:state_enabled="false">
        <shape android:shape="oval">
            <solid android:color="#2E3031"/>
            <corners android:radius="30dp"/>
        </shape>

    </item>
    <!--默认状态 圆角 矩形-->
  <item>
      <shape android:shape="rectangle">
          <corners android:radius="10dp"/>
          <solid android:color="#3889ED"/>
      </shape>
  </item>
</selector>

在布局中引用btn_shape_color.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">
     <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/btn_shape_color"/>
</LinearLayout>