A summary of shape usage in Android

In the development of Android programs, we often use shape to define a variety of shapes, first of all we understand what the shape of the label below, it means:

Solid: Fill
ANDROID:COLOR Specifies the color of the fill

Gradient: Gradient
Android:startcolor and Android:endcolor are the starting and ending colors, respectively,

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

You can specify a gradient as a radial gradient, android:type= "radial", and a radial gradient that requires a radius of android:gradientradius= "50".

Angle value corresponding to the location

Stroke: Stroke
Android:width= the width of the "2DP" stroke, android:color the color of the stroke.
We can also make the stroke into a dashed form, set in the following way:
Android:dashwidth= "5DP"
android:dashgap= "3DP"
Where android:dashwidth represents the width of a horizontal line such as '-', android:dashgap represents the distance separated by

Corners: Rounded Corners
The Android:radius is the radian of the angle, and the larger the value the greater the rounded.
We can also set the four corners to different angles,

The RADIUS attribute is not valid if you set five properties at the same time

android:radius= "20DP" sets the radius of Four Corners

android:topleftradius= "20DP" sets the radius of the upper-left corner
Android:toprightradius= "20DP" set the radius of the upper-right corner
android:bottomleftradius= "20DP" setting 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 between the top and left four directions

Here we look at a simple small example, Shapdemo, define two XML files under the Drawable folder first:

The contents of Button_bg.xml are as follows:

[HTML]View Plaincopy

2. <? XML version= "1.0" encoding="Utf-8"?>
4. <shape xmlns:android="http://schemas.android.com/apk/res/android" >
8. <!---filled
10. <solid android:color="#ff9d77" /> <!--defines the color value of the fill-
14. <!--strokes --
16. <stroke
18. android:width="2DP"
20. android:color="#fad3cf" /> <!--defines the width of the stroke and the color value of the stroke-
24. <!--rounded corners --
26. <Corners
28. android:bottomleftradius="5DP"
30. android:bottomrightradius="5DP"
32. android:topleftradius="5DP"
34. android:toprightradius="5DP" /> <!--set the radius of Four Corners--
38. <!--interval --
40. <padding
42. android:bottom="10DP"
44. android:left="10DP"
46. android:right="10DP"
48. android:top="10DP" /> <!--set the intervals in each direction--
52. </shape>

The contents of Button_pressed_bg.xml are as follows:

[HTML]View Plaincopy

2. <? XML version= "1.0" encoding="Utf-8"?>
4. <shape xmlns:android="http://schemas.android.com/apk/res/android" >
8. <!--gradients --
10. <gradient
12. android:endcolor="#FFFFFF"
14. android:gradientradius="
16. android:startcolor="#ff8c00"
18. android:type="radial" />
22. <!--strokes --
24. <stroke
26. android:dashgap="3DP"
28. android:dashwidth="5DP"
30. android:width="2DP"
32. android:color="#dcdcdc" />
36. <!--rounded corners --
38. <corners android:radius="5DP" />
42. <!--interval --
44. <padding
46. android:bottom="10DP"
48. android:left="10DP"
50. android:right="10DP"
52. android:top="10DP" />
56. </shape>

Here is a point where the dash parameter is set in the stroke, making the edges of the graphic a dashed line

Under the Drawable folder, add a Button.xml file that reads as follows:

[HTML]View Plaincopy

2. <? XML version= "1.0" encoding="Utf-8"?>
4. <selector xmlns:android="http://schemas.android.com/apk/res/android">
8. <item android:drawable= "@drawable/button_pressed_bg" android:state_pressed="true" ></Item>
10. <item android:drawable="@drawable/button_bg"></Item>
14. </selector>

The meaning of this file has been mentioned before, normal (normal) case shows BUTTON_BG, by press (pressed) the case is displayed BUTTON_PRESSED_BG.

Let's take a look at the contents of the Activity_main.xml in the layout directory:

[HTML]View Plaincopy

2. <relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
4. xmlns:tools="Http://schemas.android.com/tools"
6. android:layout_width="match_parent"
8. android:layout_height="match_parent" >
12. <Button
14. android:layout_width="wrap_content"
16. android:layout_height="wrap_content"
18. android:background="@drawable/button"
20. android:text="Testshapebutton" />
24. </relativelayout>

Specify background directly as Button.xml under the Drawable folder.

The program runs as follows:

A summary of shape usage in Android