Android - CardView elevation shadow make darker

Question

I am using 'com.android.support:cardview-v7:23.4.0' and I see the shadow but is not a dark grey shadow, and I would like to get a darker elevation shadow, but I do not see any attribute to get it, any ideas?

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginBottom="8dp"
        app:cardElevation="8dp"
        app:cardPreventCornerOverlap="false"
        app:cardCornerRadius="1dp"
        app:cardUseCompatPadding="false">
        <include layout="@layout/any_layout"/>
    </android.support.v7.widget.CardView>

Try app:cardUseCompatPadding = "true" – karthik vishnu kumar Aug 28 '17 at 08:08 — karthik vishnu kumar, Aug 28 '17 at 08:08
Thx but that is not going to get a darker shadow. – Billyjoker Sep 14 '17 at 10:07 — Billyjoker, Sep 14 '17 at 10:07

score 45 · Answer 1 · answered Nov 25 '18 at 03:34

45

I believe that the shadow intensity is defined by the underlying theme that the app uses. So for API level more than 21, you can override the intensity of shadows. In your styles.xml add these two extra lines of ambientShadowAlpha and spotShadowAlpha. Please note that these values range from 0 to 1, with 0 being completely transparent and 1 being completely opaque(almost black) :

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="android:fontFamily">@font/barlow_family</item>
    <item name="android:ambientShadowAlpha">1</item>
    <item name="android:spotShadowAlpha">1</item>

    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:statusBarColor">@android:color/background_light</item>
</style>

answered Nov 25 '18 at 03:34

Atharva Kulkarni

609
5
5

1

This is awesome! – Peter Fortuin Nov 25 '18 at 10:11
1

Thanks a lot. That made my day – smbd uknow May 19 '19 at 14:15
1

this works, but it would affect a lot of the other components in your app – oziomajnr Mar 11 '20 at 14:03
1

is there any way to only change these values for a particular view? – shubham vashisht Apr 11 '20 at 07:01
@shubhamvashisht Yes, in that case, you just have to create a new theme, with the parent theme as shown in the code here, and then apply that theme explicitly to that view. ... – Atharva Kulkarni Apr 21 '20 at 04:14
@oziomajnr Agreed, which is why its recommended to apply the theme explicitly to a particular layout/activity/fragment. – Atharva Kulkarni Apr 21 '20 at 04:16
@Atharva Kulkarni Unfortunately, it doesn't work for a single view (BottomNavigationView in my case) when I apply it the way you advised. – Daniel May 06 '20 at 20:00
Thanks for styling! In my case wrong theme was applied to `BottomSheetDialogFragment`. – CoolMind Aug 17 '22 at 06:16

score 5 · Answer 2 · answered Sep 13 '20 at 17:14

   <androidx.cardview.widget.CardView app:cardCornerRadius="10dp"
        app:cardUseCompatPadding="true"
        android:elevation="10dp"
        android:outlineSpotShadowColor="@color/black"
        android:outlineAmbientShadowColor="@color/grey"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

 app:cardUseCompatPadding="true"

try this

5

applicable for api 28+ only – deviant Nov 25 '20 at 16:28

score 1 · Answer 3 · answered Jan 30 '18 at 07:05

You can't change cardView shadow color but to make it darker you can use app:cardElevation="15dp" like

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_margin="10dp"
    app:cardElevation="15dp"
    > </android.support.v7.widget.CardView>

score 0 · Answer 4 · answered Aug 28 '17 at 08:21

0

there is no way to change color of official CardView elevation, look at this Carbon

answered Aug 28 '17 at 08:21

Behnam Eskandari

1,011
12
27

Thanks, but it requires upgrade my Android Studio and it does not have an easy integration, no import by gradle dependency. – Billyjoker Sep 14 '17 at 10:05
Technically i do not want to change the color, but the alfa shadow – Billyjoker Sep 14 '17 at 10:06

score 0 · Answer 5 · answered Nov 09 '17 at 04:26

Try using this solution. Wrap your cardview in a RelativeLayout and give a background to it.

 <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:background="#FFE7E2E4">
    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:cardElevation="5dp"
        app:cardUseCompatPadding="true"/>
</RelativeLayout>

Android - CardView elevation shadow make darker

5 Answers5