J brother --------- Android shape attributes are detailed, androidshape attributes

J brother --------- Android shape attributes are detailed, androidshape attributes

Sometimes, to meet some requirements, we need to use shape to define some background. The shape is used in the same way as the image. You can set android: background = "@ drawable/shape" for the View ", place the defined shape file in the res/shape directory.

Generally, we can use shape as the background selector of the button, or the underline at the bottom of the tab.

Let's first look at what we can do with shape.

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <gradient        android:type="linear"        android:angle="0"        android:endColor="#F028A2"        android:startColor="#2A99F3" /></shape>

What images can be made by shape?

First, let's see what shapes can do.

There are six subnodes under the shape, and only four are commonly used. padding and size are generally not used.
Corners ---- rounded corner
Gradient ---- gradient
Padding ---- content distance from the boundary
Size ---- size
Solid ---- fill color
Stroke ---- stroke

<? Xml version = "1.0" encoding = "UTF-8"?> <Shape xmlns: android = "http://schemas.android.com/apk/res/android"> <! -- Rounded corner --> <corners android: radius = "9dp" android: topLeftRadius = "2dp" android: topRightRadius = "2dp" android: bottomLeftRadius = "2dp" android: bottomRightRadius = "2dp"/> <! -- Set the radius of the rounded corner --> <! -- Gradient --> <gradient android: startColor = "@ android: color/white" android: centerColor = "@ android: color/black" android: endColor = "@ android: color/black "android: useLevel =" true "android: angle =" 45 "android: type =" radial "android: centerX =" 0 "android: centerY = "0" android: gradientRadius = "90"/> <! -- Interval --> <padding android: left = "2dp" android: top = "2dp" android: right = "2dp" android: bottom = "2dp"/> <! -- Interval in each direction --> <! -- Size --> <size android: width = "50dp" android: height = "50dp"/> <! -- Width and height --> <! -- Fill --> <solid android: color = "@ android: color/white"/> <! -- Fill color --> <! -- Stroke --> <stroke android: width = "2dp" android: color = "@ android: color/black" android: dashWidth = "1dp" android: dashGap = "2dp"/> </shape>

Shape as dotted line

Use shape as the dotted line, shape as line, and stroke as the stroke attribute,
The two attributes of dashGap dashWidth exist together to take effect.

DashGap: the gap width between two segments,
DashWidth: the width of a line.

<shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="line" >    <stroke        android:dashGap="3dp"        android:dashWidth="8dp"        android:width="1dp"        android:color="#009999" /></shape>

Shape for gradient solid line

Use shape as a gradient solid line

Gradient indicates gradient
Angle gradient angle, a multiple of 45.
StartColor endColor the color starting from centerColor

<shape xmlns:android="http://schemas.android.com/apk/res/android" >    <gradient        android:type="linear"        android:angle="0"        android:endColor="#F028A2"        android:startColor="#2A99F3" /></shape>

Shape as the view background Selector

Shape as the view background Selector

Note that the state_pressed = true of item is the select state, press, and the other is normal if it is not set.
Solid: fill color
Corners: Set the radians of the four corners

<? Xml version = "1.0" encoding = "UTF-8"?> <Selector xmlns: android = "http://schemas.android.com/apk/res/android"> <item android: state_pressed = "true"> <shape xmlns: android = "http://schemas.android.com/apk/res/android" android: shape = "rectangle"> <! -- Fill color --> <solid android: color = "# ffffff"/> <! -- Stroke --> <! -- DashGap:-interval between-and-dashWidth: width of the solid line: color: --> <! -- <Stroke android: dashGap = "10dp" android: dashWidth = "5dp" android: width = "1dip" android: color = "# d3d3d3"/> --> <! -- Rounded corner --> <corners android: topRightRadius = "10dp" android: bottomLeftRadius = "10dp" android: topLeftRadius = "10dp" android: bottomRightRadius = "10dp"/> </shape> </item> <! -- Shape: oval rectangle: Square line: Linear --> <shape xmlns: android = "http://schemas.android.com/apk/res/android" android: shape = "rectangle"> <gradient android: startColor = "# 55B4FE" android: endColor = "# 3d8FFB" android: type = "linear"/> <! -- Stroke --> <! -- <Stroke android: dashGap = "10dp" android: dashWidth = "5dp" android: width = "1dip" android: color = "# d3d3d3"/> --> <! -- Radians of the left and right sides of the rounded corner --> <corners android: topRightRadius = "10dp" android: bottomLeftRadius = "10dp" android: topLeftRadius = "10dp" android: bottomRightRadius = "10dp"/> </shape> </item> </selector>

Shape as a rectangle

Shape as a rectangle

Android: shape = "rectangle" is selected as a rectangle.

<? Xml version = "1.0" encoding = "UTF-8"?> <Shape xmlns: android = "http://schemas.android.com/apk/res/android" android: shape = "rectangle"> <! -- Gradient --> <gradient android: type = "linear" android: startColor = "@ android: color/holo_blue_bright" android: centerColor = "@ android: color/holo_green_dark" android: endColor = "@ android: color/holo_red_light" android: useLevel = "true" android: angle = "45"/> <! -- Fill --> <! -- <Solid android: color = "@ android: color/white"/> fill color --> <! -- Stroke --> <stroke android: width = "2dp" android: color = "@ android: color/black"/> </shape>

Shape as stroke rectangle and ellipse

Shape as stroke rectangle and ellipse
Note shape here
Android: shape = "oval" oval

<? Xml version = "1.0" encoding = "UTF-8"?> <Shape xmlns: android = "http://schemas.android.com/apk/res/android" android: shape = "rectangle"> <! -- Fill --> <solid android: color = "@ android: color/holo_blue_bright"/> <! -- Fill color --> <! -- Stroke --> <stroke android: width = "2dp" android: color = "@ android: color/black" android: dashWidth = "1dp" android: dashGap = "2dp"/> <corners android: topLeftRadius = "20dp" android: topRightRadius = "20dp" android: bottomLeftRadius = "20dp" android: bottomRightRadius = "20dp" android: radius = "50dp"/> </shape>

<? Xml version = "1.0" encoding = "UTF-8"?> <Shape xmlns: android = "http://schemas.android.com/apk/res/android" android: shape = "oval"> <! -- Fill --> <solid android: color = "@ android: color/holo_orange_light"/> <! -- Fill color --> <! -- Stroke --> <stroke android: width = "2dp" android: color = "@ android: color/black"/> </shape>

ShapeDemo code: http://download.csdn.net/detail/u011733020/8880615

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.