使用CardView來(lái)設(shè)置陰影效果及點(diǎn)擊效果

CardView簡(jiǎn)介

1.CardView繼承自FrameLayout,是一個(gè)具有圓角背景及陰影效果的FrameLayout.
2.CardView用elevation屬性去設(shè)置陰影效果在Lollipop版本及以上,并對(duì)Lollipop以下的版本做了適配.但是在低版本上,CardView并不去用圓角切割與子View相重疊的部分.而是添加padding避免與子View相交,并且在padding上添加陰影,padding的值為:
paddingLeft=paddingRight=maxCardElevation + (1 - cos45) * cornerRadius paddingBottom=paddingTop= maxCardElevation * 1.5 + (1 - cos45) * cornerRadius
由于CardView的內(nèi)容與陰影之間已經(jīng)有了padding,所以就不能夠?yàn)镃ardView設(shè)置padding了,但可以通過(guò)setContentPadding(int, int, int, int),方法設(shè)置CardView的邊界與子View直接間隔.
3.使用SetCardElevation(float)可以改變陰影的大小,避免正在改變陰影大小的CardView也在移動(dòng),陰影的大小由getMaxCardElevation()的值進(jìn)行限定,如果你打算動(dòng)態(tài)的改變陰影的大小,你應(yīng)該的在初始化的時(shí)候調(diào)用setMaxCardElevation()方法進(jìn)行設(shè)置MaxCardElevation.

注意

如果已經(jīng)為CardView設(shè)置了具體的大小,由于設(shè)置陰影的存在,在Lollipop版本以上與版之下的顯示效果會(huì)有不同.可以通過(guò)為不同的版本來(lái)設(shè)置不同的尺寸來(lái)解決這個(gè)問(wèn)題.

CardView的使用

添加依賴

compile 'com.android.support:cardview-v7:25.3.1'

使用

<android.support.v7.widget.CardView
        android:id="@+id/cardview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        app:cardCornerRadius="5dp"
        app:cardElevation="5dp"
</android.support.v7.widget.CardView>

CardView的常用屬性

XML attributes 用法
app:cardCornerRadius 設(shè)置CardView的圓角半徑
app:cardElevation 設(shè)置z軸高度,來(lái)控制陰影的大小
android:foreground 設(shè)置CardView的前景
app:contentPadding 設(shè)置內(nèi)邊距
app:cardBackgroundColor 設(shè)置CardView背景色
app:cardMaxElevation 設(shè)置最大z軸高度
app:cardPreventCormorOverlap true:防止子View被CardView的圓角進(jìn)行剪切 false: 允許剪切,主要用于適配Lollipop以下

為CardView設(shè)置點(diǎn)擊效果

現(xiàn)在通過(guò)設(shè)置background來(lái)設(shè)置CardView的點(diǎn)擊效果已經(jīng)不起作用了,
可以通過(guò)設(shè)置
android:foreground="?android:attr/selectableItemBackground"
來(lái)為CardView來(lái)添加系統(tǒng)自帶的點(diǎn)擊效果.也可以通過(guò)自定義來(lái)實(shí)現(xiàn):

V21及以上

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#bdbdbd">
    <item android:id="@android:id/mask">
        <shape android:shape="oval">
            <size
                android:width="20dp"
                android:height="20dp" />
            <solid android:color="#f0f0f0" />
        </shape>

    </item>
</ripple>

V21以下

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="oval">
            <solid android:color="#42000000" />
            <size android:width="20dp" android:height="20dp" />
        </shape>
    </item>
    <item android:drawable="#00000000"
          android:state_pressed="false" />
</selector>

注:

版本21以下必須使用通過(guò)透明度控制灰度的色值,如:#42000000

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容