Android View 陰影的總結

　　關於 Android 陰影，你們確定不陌生的。可是Android 中到底有多少種方式能夠實現陰影效果以及各類方式之間有什麼區別和優缺點，這就是我想總結的。下面咱們一個一個來講：

1、各類實現陰影的方式

　　1. Android 在 API 21（5.0）添加了 elevation，能夠很方便的在 View 上實現陰影。可是這個只在 >= API21 的手機上能夠看到陰影效果，低於這個版本的就沒有陰影效果。目前市場上應用仍是須要適配至 API15 的，因此須要慎重使用。

　　2. CardView 也能夠實現陰影效果，項目中通常都是使用這種方式實現卡片式的效果並帶有陰影。使用 CardView 確實很不錯，可是它在使用的時候也是須要有注意的地方：

　　　　(1) CardView 實現陰影效果的佈局，在 >= API 21 的版本上和 < 21 的版本上，若是不在代碼上作好控制，他們的顯示差別仍是很大的。至於如何進行適配，能夠自行查找。有圖有真相：大小呈現差別，陰影有差別：測試機型都一致，只有Android 版本差別，對於左下角的 cardBackgroundcolor 透明也是有差別的。左側爲 API 15  、 右側爲 API 22

　　　　　　　　

　　　　(2) CardView 在 >= API21 的版本上實現陰影效果也是經過  elevation 來實現的，最終的渲染是調用 native 方法進行的。在使用過程當中發現這樣一個問題，在不一樣位置的 View 陰影的方向是不同的。不知道大家發現沒，它模擬的場景就是 光源的位置在屏幕中心的正上方，而後 View 的位置由光源的位置決定。陰影方向不一致，這一點形成了我在開發中的一個 BUG，很頭痛啊，這也是一個 BUG，後面會有解決這個 。有圖有真相：

　　　　（3）若是有對陰影顏色有要求的需求， CardView 很差意思，臣妾作不到啊。哈哈，CardView 黑的差很少了。

　　3. Shape 來實現陰影。經過這種方式來實現陰影，因爲shape是做爲背景來使用的，陰影的存在有可能使內容顯示在陰影部分即陰影也佔位哈。硬傷啊，固然你能夠手動設置 margin 或者 padding 值控制內容的顯示位置，固然要是 dp 適配的哈。咱們來看一下 shape 如何實現陰影：

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

    <!--邊-->
    <item>
            <shape android:shape="rectangle">
            <padding
                android:bottom="2px"
                android:left="1px"
                android:right="2px"
                android:top="1px" />

            <solid android:color="#00CCCCCC" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
            <shape android:shape="rectangle">
            <padding
                android:bottom="2px"
                android:left="1px"
                android:right="2px"
                android:top="1px" />

            <solid android:color="#10CCCCCC" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
            <shape android:shape="rectangle">
            <padding
                android:bottom="2px"
                android:left="1px"
                android:right="2px"
                android:top="1px" />

            <solid android:color="#20CCCCCC" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
            <shape android:shape="rectangle">
            <padding
                android:bottom="2px"
                android:left="1px"
                android:right="2px"
                android:top="1px" />

            <solid android:color="#30CCCCCC" />

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <padding
                android:bottom="2px"
                android:left="1px"
                android:right="2px"
                android:top="1px" />

            <solid android:color="#50CCCCCC" />
            <corners android:radius="5dp" />
        </shape>
    </item>

    <!--中心背景 -->
    <item>
        <shape
            android:shape="rectangle"
            android:useLevel="false">
            <!--實心 -->
            <solid android:color="@color/white_f2" />
            <corners android:radius="5dp" />
            <size android:width="32dp"
                android:height="32dp"/>

        </shape>
    </item>

</layer-list>

View Code

　　效果圖：

　　4. 經過 .9 圖來製做陰影，這裏經過一個很好的工具來製做哈：http://inloop.github.io/shadow4android/

　　　　來看下界面：這種方式製做小的背景陰影很模糊，效果上比不過 shape。若是這個沒太大關係，這種方式很方便，不用敲代碼，哈哈。

　　5.  用 SCardView 來實現陰影，使用方式和 CardView 同樣，可是它是使用一套代碼，顯示不會有差別，並且能夠經過設置光源的位置來控制陰影的方向以及陰影的顏色。來看下效果：

　　

　　SCardView 如何在代碼中使用： 添加依賴

compile 'io.github.meetsl:SCardView:1.0'

　　XML 代碼：

    <com.meetsl.scardview.SCardView
        android:layout_width="@dimen/card_size"
        android:layout_height="@dimen/card_size"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_margin="20dp"
        app:cardBackgroundColor="#80B3FF"
        app:cardCornerRadius="5dp"
        app:cardElevation="@dimen/cardview_elevation"
        app:cardLightDirection="RT">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:padding="5dp"
            android:text="RT"
            android:textColor="@android:color/white"
            android:textSize="16sp" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:src="@mipmap/home_back" />
    </com.meetsl.scardview.SCardView>

2、總結各類方式

方式	是否有顯示差別	是否能夠控制陰影方向	是否能夠設置陰影顏色	陰影是否佔位	是否模糊	繪製效率	其餘
elevation	無	不可控制	不可設置	不佔位	不	高，經過 native 繪製	只在 API 21 生效
CardView	有	不可控制	不可設置	不佔位	不	Api 21 上效率高，經過native 繪製
shape	無	可控	可設置	佔位	不	通常
.9 圖	無	可控，生效一次，更改需從新生成	可設置，更改需從新生成	佔位	模糊	慢（加載圖片顯示）
SCardView	無	可控	可設置	不佔位	不	通常

　　陰影的各類繪製比較已經奉上，按照需求和方便程度，各取所需。就到這吧，週末愉快！

　　SCarView 的具體說明和使用能夠看這篇：

　　http://www.javashuo.com/article/p-auxflsud-eb.html