CardView是android5.0以上的新控件,卡片式布局,繼承FrameLayout實(shí)現(xiàn),今天這里主要說一下CardView的使用和注意的地方
1.首先肯定需要引用gradle配置
compile'com.android.support:cardview-v7:21.0.+'
介紹一下主要的屬性:
app:cardBackgroundColor這是設(shè)置背景顏色
app:cardCornerRadius設(shè)置圓角大小
app:cardElevation設(shè)置z軸的陰影
app:cardMaxElevation設(shè)置z軸的最大高度值
app:contentPadding 設(shè)置內(nèi)容的內(nèi)邊距
app:contentPaddingLeft 設(shè)置內(nèi)容的左內(nèi)邊距
app:contentPaddingTop 設(shè)置內(nèi)容的上內(nèi)邊距
app:contentPaddingRight 設(shè)置內(nèi)容的右內(nèi)邊距
app:contentPaddingBottom 設(shè)置內(nèi)容的底內(nèi)邊距
具體的效果根據(jù)需求進(jìn)行測試吧。
我們今天主要記錄一下跳過使用這個東西的一些火坑
這玩意是5.0+上發(fā)布的 所以根據(jù)平時的習(xí)慣做出來以后再5.0+上的手機(jī)上運(yùn)行很完美,根本看不出來問題。
但是有一天我用cardView+listView寫好以后再4.4的一個機(jī)子上運(yùn)行后發(fā)現(xiàn)cardview的外邊距(layout_margin)很大。第一反應(yīng) 肯定是兼容出問題咯,果然發(fā)現(xiàn)在低版本中設(shè)置了 CardElevation 之后 CardView 會自動留出空間供陰影顯示,而 Lollipop 之后則需要手動設(shè)置 Margin 邊距來預(yù)留空間,導(dǎo)致我在設(shè)置 Margin 在 Android 5.0 機(jī)器上運(yùn)行后發(fā)現(xiàn) Kitkat 機(jī)器調(diào)試時發(fā)現(xiàn)邊距非常大,嚴(yán)重地浪費(fèi)了屏幕控件而且還很丑。
找到問題就好說,解決方案就很明確了:
1.在res下創(chuàng)建values(默認(rèn)已經(jīng)存在)和一個values-v21的文件夾并且在兩個文件下創(chuàng)建dimens.xml文件
2.dimens.xml文件中自定義一個dimen
values-v21文件夾下
<dimen name="cardView_m">10dp</dimen>
values文件夾下
<dimen name="cardView_m">0dp</dimen>
因?yàn)樵诘桶姹鞠略O(shè)置CardElevation后默認(rèn)就有了邊距,所以這里我們就不要在設(shè)置邊距了,不然會疊加導(dǎo)致低版本外邊距很大
3.只需要在CardView下設(shè)置
android:layout_margin="@dimen/cardView_m"
這樣就可以根據(jù)自己的需求可以調(diào)整出自己想要的距離
--------------------華麗麗的分割線----------------------
好吧,再說一下CardView上的按下,點(diǎn)擊的效果實(shí)現(xiàn)。你以為還是跟正常的background設(shè)置一下就好了?如果真這樣,那就可以不用說了,很明顯不是。
foreground:通過這個東西來設(shè)置點(diǎn)擊的效果實(shí)現(xiàn)
android:foreground="?attr/selectableItemBackground"
但是很尷尬,這個只能支持5.0+上的版本,低版本看著很low,有點(diǎn)生硬,所以還是自己動手才是王道,下面我提供一下自己實(shí)現(xiàn)的點(diǎn)擊效果:
1.創(chuàng)建drawable和drawable-v21文件夾,并且實(shí)現(xiàn)以下的一個select_card_foreground.xml文件
drawable-v21文件夾下
select_card_foreground.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#20000000"
android:drawable="@drawable/card_foreground_selector" />
card_foreground_selector.xml文件
<?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="rectangle">
<solid android:color="@color/color_d2d2d2"/>
</shape>
</item>
<item android:state_focused="true" android:state_enabled="true">
<shape android:shape="rectangle">
<solid android:color="@color/color_d2d2d2"/>
</shape>
</item>
</selector>
drawable文件夾下
select_card_foreground.xml
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/card_foreground_selector"
android:insetLeft="2dp"
android:insetRight="2dp"
android:insetTop="4dp"
android:insetBottom="4dp"/>```
card_foreground_selector.xml文件
<?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="rectangle">
<solid android:color="@color/transparent_1"/>
</shape>
</item>
<item android:state_focused="true" android:state_enabled="true">
<shape android:shape="rectangle">
<solid android:color="@color/transparent_1"/>
</shape>
</item>
</selector>```
最后在CardView設(shè)置:
android:foreground="@drawable/select_card_foreground"
最后就能完美使用了。