【Android -- Res资源】shape案例1

演示

二、案例

• main布局 btn.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:orientation="vertical">

    <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:text="圆角虚线" />

    <Button
            android:id="@+id/Button1"
            android:layout_width="100dp"
            android:layout_height="40dp"
            android:layout_centerInParent="true"
            android:layout_marginTop="8dp"
            android:background="@drawable/btn_selector"
            android:text="hello" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:text="一半是直角 一半是圆角，实线" />

    <Button
            android:id="@+id/Button2"
            android:layout_width="100dp"
            android:layout_height="40dp"
            android:layout_centerInParent="true"
            android:layout_marginTop="8dp"
            android:background="@drawable/btn_selector_another"
            android:text="hello" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:text="渐变线性背景色" />


    <TextView
            android:layout_width="200dp"
            android:layout_height="40dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/btn_bg_gradient" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:text="渐变放射性背景色" />

    <TextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/btn_bg_gradient_circle" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:text="渐变扇形背景色" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="40dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/btn_bg_gradient_sweep" />

    <TextView
            android:layout_width="200dp"
            android:layout_height="40dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/my_layer_list"
            android:gravity="center"
            android:text="使用layer-list 背景色" />

/>
</LinearLayout>

</ScrollView>

• 圆角虚线 btn_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Button正常状态下的背景 -->
    <item android:drawable="@drawable/btn_bg_normal" android:state_pressed="false" />
    <!-- Button按下时的背景 -->
    <item android:drawable="@drawable/btn_bg_pressed" android:state_pressed="true" />
</selector>

• 一半是直角 一半是圆角，btn_selector_another.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Button正常状态下的背景 -->
    <item>
        <shape>
            <!-- 矩形的圆角弧度 -->
            <corners android:bottomLeftRadius="20dp" android:bottomRightRadius="0dp" android:topLeftRadius="20dp" android:topRightRadius="0dp" />
            <!-- 矩形的填充色 -->
            <solid android:color="#FF4081" />
            <padding android:bottom="2dp" android:left="2dp" android:right="0dp" android:top="0dp" />
            <!-- 矩形的边框的宽度,每段虚线的长度，和两段虚线之间的颜色和颜色 -->
            <stroke android:width="1dp" android:color="#4eb621" />
        </shape>
    </item>
    <item android:state_pressed="true">
        <shape>
            <!--内边距-->
            <padding android:bottom="2dp" android:left="2dp" android:right="0dp" android:top="0dp" />
            <!-- 矩形的圆角弧度 -->
            <corners android:bottomLeftRadius="20dp" android:topLeftRadius="20dp" />
            <!-- 矩形的填充色 -->
            <solid android:color="#3F51B5" />
            <!-- 矩形的边框的宽度,每段虚线的长度，和两段虚线之间的颜色和颜色 -->
            <stroke android:width="1dp" android:color="#4eb621" />
        </shape>
    </item>
</selector>

• 渐变线性背景色 btn_bg_gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 矩形的圆角弧度 -->
    <corners android:radius="10dp" />
    <!--android:angle="0" 渐变的角度 为45度的倍数，逆时针方向-->
    <gradient
        android:angle="0"
        android:type="linear"
        android:endColor="@color/colorAccent"
        android:startColor="@color/design_default_color_primary" />

</shape>

• 渐变放射性背景色 btn_bg_gradient_circle.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 矩形的圆角弧度 -->
    <corners android:radius="40dp" />
    <gradient
        android:angle="0"
        android:useLevel="false"
        android:centerColor="@color/design_default_color_primary_dark"
        android:centerX="0.5"
        android:centerY="0.5"
        android:endColor="@color/colorAccent"
        android:gradientRadius="100"
        android:startColor="@color/design_default_color_primary"
        android:type="radial" />

</shape>

• 渐变扇形背景色 btn_bg_gradient_sweep.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 矩形的圆角弧度 -->
    <corners android:radius="40dp" />
    <gradient
        android:endColor="@color/colorAccent"
        android:startColor="@color/design_default_color_primary"
        android:useLevel="false"
        android:type="sweep" />

</shape>

• 使用layer-list 背景色 my_layer_list.xml

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

    <!--上面的为背景的底层-->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/design_default_color_secondary" />
        </shape>
    </item>

    <!--背景上面的图层 让底部的背景露出来4dp的高度-->
    <item android:bottom="4dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorAccent" />
        </shape>
    </item>
</layer-list>