In Android program development, we often use Shape to define various shapes.

First, let's know which labels are under the Shape and what they mean:

solid: fill android:color specifies the color of the fill

Gradient: gradient android:startColor and android:endColor are the start and end colors respectively,

android:angle is the gradient angle, which must be an integer multiple of 45. In addition, the default gradient mode is android:type="linear", that is, linear gradient,

You can specify the gradient as radial gradient, android:type="radial". Radial gradient needs to specify radius android:gradientRadius="50".

The position corresponding to the angle value is shown in the figure:

stroke: stroke android:width="2dp" stroke width, android:color stroke color. We can also make the stroke in the form of dotted line. The setting method is: android:dashWidth="5dp" android:dashGap="3dp" Where android:dashWidth represents the width of such a horizontal line '-', and android:dashGap represents the distance between them

corners: fillets android:radius is the radian of the angle. The larger the value, the rounder the angle. We can also set the four angles to different angles,

If five attributes are set at the same time, the Radius attribute is invalid

android:Radius="20dp" sets the radius of the four corners

android:topLeftRadius="20dp" set the radius of the upper left corner android:topRightRadius="20dp" set the radius of the upper right corner android:bottomLeftRadius="20dp" set the radius of the lower right corner android:bottomRightRadius="20dp" set the radius of the lower left corner

padding: interval You can set the interval in the up, down, left and right directions

Here, let's take a simple example, ShapDemo. First define two xml files under the drawable folder:

button_bg.xml is as follows:

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

<!-- fill -->
<solid android:color="#Ff9d77 "/ > <! -- defines the color value of the fill -- >

<!-- Stroke  -->
<stroke
    android:width="2dp" 
    android:color="#fad3cf" /> <!--  Defines the width of the stroke and the color value of the stroke -- >

<!-- fillet -->
<corners
    android:bottomLeftRadius="5dp"
    android:bottomRightRadius="5dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" /> <!-- Sets the radius of the four corners -->

<!-- interval -->
<padding
    android:bottom="10dp"
    android:left="10dp"
    android:right="10dp"
    android:top="10dp" /> <!-- Set the interval in each direction -->

</shape>

button_pressed_bg.xml is as follows:

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

<!-- Gradual change -->
<gradient
    android:endColor="#FFFFFF"
    android:gradientRadius="50"
    android:startColor="#ff8c00"
    android:type="radial" />

<!-- Stroke  -->
<stroke
    android:dashGap="3dp"
    android:dashWidth="5dp"
    android:width="2dp"
    android:color="#dcdcdc" />

<!-- fillet -->
<corners android:radius="5dp" />

<!-- interval  -->
<padding
    android:bottom="10dp"
    android:left="10dp"
    android:right="10dp"
    android:top="10dp" />

</shape>

Here's an illustration. The dash parameter is set in the stroke, so that the edge of the figure becomes a dotted line.

Add a selector button.xml file under the drawable folder, as follows:

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

<item android:drawable="@drawable/button_pressed_bg" android:state_pressed="true"></item>
<item android:drawable="@drawable/button_bg"></item>

</selector>

The meaning of this file has been mentioned before. Under normal conditions, button is displayed_ BG, button is displayed when pressed_ pressed_ bg.

Let's take another look at the activity under the layout directory_ Contents of main.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" >

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/button"
    android:text="TestShapeButton" />

</RelativeLayout>

Directly specify the background as button.xml under the drawable folder.

The screenshot of program operation is as follows: