Android: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>
元素屬性:
android:shape
Defines the type of shape. Valid values are:(定義這個型別的形狀,變數值是:)
Value Desciption "rectangle"
A rectangle (長方形)that fills the containing View. This is the default shape.(這個是預設的形狀) "oval"
An oval (橢圓形)shape that fits the dimensions of the containing View. "line"
A horizontalline that spans the width of the containing View. This shape requires the <stroke>
element to define the width of the line."ring"
A ring shape.(環形) 1.rectangle屬性
可用於製作按鈕等控制元件背景,如:常用圓角背景框、漸變色背景、透明背景層......;
如上圖所示,只需設定solid屬性顏色值為#60000000,即可為TextView設定半透明背景層了。
如果在TextView或者父容器中使用alpha=0.5,將會導致文字內容也呈現半透明效果,顯然不是設計所需!
如果使用RelativeLayout佈局,多使用一個半透明背景層View也能實現上圖效果,但操作繁瑣,不太理想!
2.line屬性
可用於製作分隔線(漸變色分隔線)
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line" > <stroke android:width="4dp" android:color="@android:color/black" /> </shape>3.ring屬性
The following attributes are used only when
android:shape="ring"
:
android:innerRadius
- Dimension. The radius for the inner part of the ring (the hole in the middle), as a dimension value or dimension resource.
android:innerRadiusRatio
- Float. The radius for the inner part of the ring, expressed as a ratio of the ring's width. For instance, if
android:innerRadiusRatio="5"
, then the inner radius equals the ring's width divided by 5. This value is overridden byandroid:innerRadius
. Default value is 9.android:thickness
- Dimension. The thickness of the ring, as a dimension value or dimension resource.
android:thicknessRatio
- Float. The thickness of the ring, expressed as a ratio of the ring's width. For instance, if
android:thicknessRatio="2"
, then the thickness equals the ring's width divided by 2. This value is overridden byandroid:innerRadius
. Default value is 3.android:useLevel
- Boolean. "true" if this is used as a . This should normally be "false" or your shape may not appear.
<corners>
Creates rounded corners for the shape. Applies only when the shape is a rectangle.建立圓角的形狀。僅適用於當其形狀是一個長方形。attributes:
android:radius
- Dimension. The radius for all corners, as a dimension value or dimension resource. This is overridden for each corner by the following attributes.
android:topLeftRadius
- Dimension. The radius for the top-left corner, as a dimension value or dimension resource.
android:topRightRadius
- Dimension. The radius for the top-right corner, as a dimension value or dimension resource.
android:bottomLeftRadius
- Dimension. The radius for the bottom-left corner, as a dimension value or dimension resource.
android:bottomRightRadius
- Dimension. The radius for the bottom-right corner, as a dimension value or dimension resource.
Note: Every corner must (initially) be provided a corner radius greater than 1, or else no corners are rounded. If you want specific corners to notbe rounded, a work-around is to use
android:radius
to set a default corner radius greater than 1, but then override each and every corner with the values you really want, providing zero ("0dp") where you don't want rounded corners.<gradient>
Specifies a gradient color for the shape.指定一個漸變顏色的形狀。attributes:
android:angle
- Integer. The angle for the gradient, in degrees. 0 is left to right, 90 is bottom to top. It must be a multiple of 45. Default is 0.
android:centerX
- Float. The relative X-position for the center of the gradient (0 - 1.0).
android:centerY
- Float. The relative Y-position for the center of the gradient (0 - 1.0).
android:centerColor
- Color. Optional color that comes between the start and end colors, as a hexadecimal value or color resource.
android:endColor
- Color. The ending color, as a hexadecimal value or color resource.
android:gradientRadius
- Float. The radius for the gradient. Only applied when
android:type="radial"
.android:startColor
- Color. The starting color, as a hexadecimal value or color resource.
android:type
- Keyword. The type of gradient pattern to apply. Valid values are:
Value Description "linear"
A linear gradient. This is the default. "radial"
A radial gradient. The start color is the center color. "sweep"
A sweeping line gradient. android:useLevel
- Boolean. "true" if this is used as a .
<padding>
Padding to apply to the containing View element (this pads the position of the View content, not the shape).適用於包含填充檢視元素(這墊的位置,而不是觀點內容的形狀)attributes:
android:left
- Dimension. Left padding, as a dimension value or dimension resource.
android:top
- Dimension. Top padding, as a dimension value or dimension resource.
android:right
- Dimension. Right padding, as a dimension value or dimension resource.
android:bottom
- Dimension. Bottom padding, as a dimension value or dimension resource.
<size>
The size of the shape.attributes:
android:height
- Dimension. The height of the shape, as a dimension value or dimension resource.
android:width
- Dimension. The width of the shape, as a dimension value or dimension resource.
Note: The shape scales to the size of the container View proportionate to the dimensions defined here, by default. When you use the shape in an , you can restrict scaling by setting the
android:scaleType
to"center"
.<solid>
A solid color to fill the shape.attributes:
android:color
- Color. The color to apply to the shape, as a hexadecimal value or color resource.
<stroke>
A stroke line for the shape.attributes:
android:width
- Dimension. The thickness of the line, as a dimension value or dimension resource.
android:color
- Color. The color of the line, as a hexadecimal value or color resource.
android:dashGap
- Dimension. The distance between line dashes, as a dimension value or dimension resource. Only valid if
android:dashWidth
is set.android:dashWidth
- Dimension. The size of each dash line, as a dimension value or dimension resource. Only valid if
android:dashGap
is set.gradient -- 對應顏色漸變。 startcolor、endcolor就不多說了。 android:angle 是指從哪個角度開始變。
gradient:漸變
android:startColor和android:endColor分別為起始和結束顏色,android:angle是漸變角度,必須為45的整數倍。
另外漸變預設的模式為android:type="linear",即線性漸變,可以指定漸變為徑向漸變,android:type="radial",徑向漸變需要指定半徑android:gradientRadius="50"。solid -- 填充。
solid:實心,就是填充的意思android:color指定填充的顏色
stroke -- 描邊。
stroke:描邊
android:width="2dp" 描邊的寬度,android:color 描邊的顏色。
我們還可以把描邊弄成虛線的形式,設定方式為:
android:dashWidth="5dp"
android:dashGap="3dp"
其中android:dashWidth表示'-'這樣一個橫線的寬度,android:dashGap表示之間隔開的距離。corners -- 圓角。
corners:圓角
android:radius為角的弧度,值越大角越圓。
我們還可以把四個角設定成不同的角度,方法為:
<corners
android:topRightRadius="20dp" 右上角
android:bottomLeftRadius="20dp" 右下角
android:topLeftRadius="1dp" 左上角
android:bottomRightRadius="0dp" 左下角
/>
這裡有個地方需要注意,bottomLeftRadius是右下角,而不是左下角!