【Android】自定義Drawable文件，簡單實現頂部弧形背景：向上凹 和 向下凸

 看到淘寶首頁頂部是一個向上凹進去的背景（如下左圖），有點好奇是如何實現的，今日閒來無事，便琢磨個實現的方法。

琢磨的過程中，想到的就是用layer-list來實現，此外又實現了一個頂部向下凸的背景（如下右圖），在這裏記錄下實現的過程。

                    

一、實現頂部向上凹的背景

1、自定義drawable文件，arc_bg_up.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:top="0dp"
        android:right="-250dp"
        android:left="-250dp">

        <shape android:shape="oval">

            <solid android:color="#FFFFFF"/>
        </shape>

    </item>

    <item android:top="50dp">
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF"/>
        </shape>
    </item>
</layer-list>

2、佈局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ArcActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="150dp">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/love"
            android:scaleType="fitXY"/>
    </LinearLayout>

    <LinearLayout
        android:layout_marginTop="-20dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/arc_bg_up">
    </LinearLayout>

</LinearLayout>

二、實現頂部向下凸的背景

1、自定義drawable文件，arc_bg_down.xml

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

    <item android:height="50dp"
        tools:ignore="UnusedAttribute">

        <shape android:shape="rectangle">
            <solid android:color="#e7873e"/>

        </shape>
    </item>

    <item android:top="0dp"
        android:right="-200dp"
        android:left="-200dp">
        <shape android:shape="oval">
            <solid android:color="#e7873e"/>
        </shape>
    </item>

</layer-list>

2、佈局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ArcActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:background="@drawable/arc_bg_down">
    </LinearLayout>

</LinearLayout>

好啦，兩種頂部弧形背景的樣式到這裏就簡單實現啦。