自定義陰影顏色的CardView

自定義陰影顏色的CardView

今天用CardView做卡片式設計的時候，給出的UI讓做一個藍色的陰影效果，我找遍了CardView的接口都沒有發現修改陰影顏色的方法，於是看了一下源碼，發現谷歌把CardView的陰影顏色給寫死了。因此寫了一個能自定義顏色、陰影寬度、模糊度的CardView，感覺效果還不錯，便封裝起來做成依賴庫發佈了。

一個簡單的效果圖：

使用方法：

1.添加依賴

首先，在build.gradle文件下加入 maven {url ‘https://jitpack.io’}

allprojects {
	repositories {
		google()
		jcenter()
		maven {url "https://jitpack.io"}
	}
}

然後在dependencies下加入依賴

implementation 'com.github.EHENJOOM:ShadowCardView:1.2.0'

2.在佈局文件中添加ShadowCardView

<RelativeLayout 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"
    tools:context=".MainActivity">

   <com.zhk.shadowcardview.ShadowCardView
       android:layout_width="match_parent"
       android:layout_height="200dp"
       android:layout_centerInParent="true"
       android:layout_marginLeft="40dp"
       android:layout_marginRight="40dp"
       app:cornersRadius="15dp"
       app:shadowColor="@color/red" />

</RelativeLayout>

3.在java代碼裏修改對應的屬性值

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        ShadowCardView shadowCardView=findViewById(R.id.shadowCardView);
        shadowCardView.setCornersRadius(ShadowCardView.dp2px(this,15))
                .setShadowColor(getResources().getColor(R.color.red))
                .setShadowOffsetY(ShadowCardView.dp2px(this,5));
    }
}

4.xml標籤屬性表

加入命名空間才能使用下面的屬性

xmlns:app="http://schemas.android.com/apk/res-auto"

標籤名	對應屬性
cornersRadius	CardView圓角
shadowLeftHeight	左側陰影寬度
shadowTopHeight	頂部陰影寬度
shadowRightHeight	右側陰影寬度
shadowBottomHeight	底部陰影寬度
shadowOffsetX	X軸的陰影偏離度
shadowOffsetY	Y軸的陰影偏離度
cardColor	CardView的顏色
shadowColor	陰影顏色
shadowRadius	陰影模糊度，值越大越模糊

5.java代碼方法表

方法名	對應屬性
setCornersRadius(int)	設置CardView圓角
setShadowLeftHeight(int)	設置左側陰影寬度
setShadowTopHeight(int)	設置頂部陰影寬度
setShadowRightHeight(int)	設置右側陰影寬度
setShadowBottomHeight(int)	設置底部陰影寬度
setShadowOffsetX(int)	設置X軸的陰影偏離度
setShadowOffsetY(int)	設置Y軸的陰影偏離度
setCardColor(int)	設置CardView的顏色
setShadowColor(int)	設置陰影顏色
setShadowRadius(int)	設置陰影模糊度，值越大越模糊

需要注意的是，這裏寬度的單位爲px，如果想使用dp爲單位，可以調用dp2px(Context,float)函數將dp轉化爲px值再傳入參數。

後續將會更新更多的屬性和方法，有什麼想法的小夥伴可以留言。覺得這個控件不錯的小夥伴動動手指點個讚唄，也歡迎去項目地址Star。