2017-01-16 271 views
2

根據我的應用程序ui要求,它需要在cardview上方顯示簡單的一面,因此需要從上側刪除陰影並觸摸另一個視圖。從一側刪除CardView陰影

我試圖

card_view:cardElevation = 「0dp」

,但它從所有側去除陰影,所以它不是對我很有用。

我嘗試將負邊距(-5dp)逐個應用於CardView和圖像視圖,但所有時間CardView都在圖像下方過來,所以它不適用於我。

應用程序的用戶界面的要求是這樣的

UI Like this

任何一個可以給做有助於解決這個建議嗎?

回答

2

我通過創建自定義背景看起來像卡片視圖但沒有頂部陰影從這個問題出來。

在可繪製文件夾中創建一個XML文件,並將此代碼放入並設置爲背景。

的android:背景= 「@繪製/ custom_cardview_no_top_shadow」

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

<item> 
    <shape> 
     <padding android:top="0dp" android:right="10dp" android:bottom="5dp" android:left="10dp" /> 
     <solid android:color="@color/transparent" /> 
    </shape> 
</item> 

<item> 
    <shape> 
     <padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" /> 
     <solid android:color="@color/card_shadow_1" /> 
     <corners android:radius="0dp" /> 
    </shape> 
</item> 
<item> 
    <shape> 
     <padding android:top="0dp" android:right="0dp" android:bottom="1dp" android:left="0dp" /> 
     <solid android:color="@color/card_shadow_2" /> 
     <corners android:radius="0dp" /> 
    </shape> 
</item> 
<!-- Background --> 
<item> 
    <shape > 
     <solid android:color="@color/card_background" /> 
     <corners android:radius="0dp" /> 
    </shape> 
</item> 

下面是卡圖的顏色

<!-- card colors --> 
<color name="card_background">#ffffff</color> 
<color name="card_shadow_1">#d4d4d4</color> 
<color name="card_shadow_2">#dddddd</color> 
<color name="transparent">#00000000</color> 
0

可以實現這種通過在z軸上創建高於cardview的另一個視圖來產生效果。之後,您需要將其outlineProvider屬性設置爲none以禁用陰影效果並將其放置到CardView的所需邊緣。

<RelativeLayout> 
    <CardView/> 
    <View 
     .. 
     android:outlineProvider="none" 
     android:translationZ="12dp" 
     android:background="@color/cardViewBackgroundColor> 
    </View> 
</RelativeLayout>