Stbdroid之ShapeDrawable

时间:2023-03-09 13:14:17
Stbdroid之ShapeDrawable

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>

下面是一些例子,修改上面的属性的效果图:

layout就是一个ImageView

<ImageView
android:layout_width="200dp"
android:layout_height="100dp"
android:background="@drawable/shape_style" />

下面是shape的配置文件内容

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" > <corners android:radius="0dp" >
</corners> <stroke
android:width="10dp"
android:color="@android:color/holo_blue_light" >
</stroke> </shape>

效果如左边的图,当上面改成

android:radius="50dp"

Stbdroid之ShapeDrawableStbdroid之ShapeDrawable

现在看下gradient,shape的内容如下

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" > <gradient
android:endColor="#ffffffff"
android:startColor="@android:color/holo_blue_bright" >
</gradient> </shape>

效果图如下,

,Stbdroid之ShapeDrawable

修改如下:

    <gradient
android:endColor="#ffffffff"
android:startColor="#ffffffff"
android:centerColor="@android:color/holo_blue_bright"
android:angle="90" >
</gradient>

图如下

Stbdroid之ShapeDrawable

下面看下padding,首先ImageView的内容:

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_icon"
android:background="@drawable/shape_style" />

shape的内容:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" > <padding android:left="5dp"
android:top="5dp"
android:right="5dp"
android:bottom="5dp"/>
<solid
android:color="@android:color/holo_blue_bright"></solid>
</shape>

Stbdroid之ShapeDrawable

最后,看size和stroke

同样是ImageView:

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/shape_style" />

shape_style内容:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" > <size android:width="200dp"
android:height="100dp"/>
<stroke
android:width="10dp"
android:color="@android:color/holo_blue_bright" /> </shape>

Stbdroid之ShapeDrawable

在shape_style中加入android:dashWidth="5dp"和 android:dashGap="5dp",效果如下:

Stbdroid之ShapeDrawable