Android change Material elevation shadow color
I know that this question is very old and probably the author doesn't need the answer anymore. I'll just leave it here so others can find it.
Lollipop's elevation system doesn't support colored shadows.
But, if you need colored shadows, it's possible to get them using Carbon. It's a kind-of support library for Material Design and in the most recent version there is an option to change shadow color. There's a ton of nice designs on Behance featuring colored shadows and I thought it would be nice to have them despite lack of such feature in Android. It's important to note that colored shadows are emulated on all Android versions, on 5.0+ too.
https://github.com/ZieIony/Carbon
The following image and code can be found in Carbon's samples.
Code:
<carbon.widget.LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<carbon.widget.Button
android:layout_width="56dp"
android:layout_height="56dp"
android:layout_margin="@dimen/carbon_padding"
android:background="#ffffff"
app:carbon_cornerRadius="2dp"
app:carbon_elevation="8dp"
app:carbon_elevationShadowColor="@color/carbon_red_700"/>
</carbon.widget.LinearLayout>
"CardView":
<carbon.widget.LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<carbon.widget.LinearLayout
android:layout_width="match_parent"
android:layout_height="160dp"
android:layout_margin="@dimen/carbon_margin"
android:background="#ffffff"
app:carbon_cornerRadius="2dp"
app:carbon_elevation="8dp"
app:carbon_elevationShadowColor="@color/carbon_red_700">
<carbon.widget.ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:src="@drawable/test_image"/>
<carbon.widget.TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="test text"/>
</carbon.widget.LinearLayout>
</carbon.widget.LinearLayout>
How to set elevation color below the view in Android?
Try this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="@+id/rel1"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@android:color/white"
android:elevation="5dp">
<ImageView
android:id="@+id/backBut"
android:layout_width="50dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:src="@drawable/ic_close" />
<TextView
android:id="@+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="CREATE"
android:textColor="#000"
android:textSize="20sp" />
</RelativeLayout>
<android.support.v7.widget.CardView
android:id="@+id/createSingleDealBut"
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_below="@id/rel1"
android:layout_marginStart="30dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="30dp"
app:cardCornerRadius="30dp"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/test"
android:orientation="horizontal"
android:weightSum="1">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.3">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_margin="20dp"
android:scaleType="centerInside"
android:src="@drawable/dishu" />
</RelativeLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.6"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="Single Deal"
android:textColor="#000"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Time sensitive exclusive deal expiring live within 24hrs or less"
android:textSize="12sp" />
</LinearLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.1">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
/>
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<TextView
android:id="@+id/or"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/createSingleDealBut"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:text="OR"
android:textColor="#000"
android:textSize="20sp" />
<android.support.v7.widget.CardView
android:id="@+id/createOngoingDealBut"
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_below="@id/or"
android:layout_marginStart="30dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="30dp"
app:cardCornerRadius="30dp"
app:cardElevation="5dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/test"
android:orientation="horizontal"
android:weightSum="1">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.3">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_margin="15dp"
android:scaleType="centerInside" />
</RelativeLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.6"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="Ongoing Deals List"
android:textColor="#000"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Ongoing daily/weekly time specific deal specials offered to all customers. Create a Happy Hour deals menu"
android:textSize="12sp" />
</LinearLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.1">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:src="@drawable/ic_apk_box" />
</RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
</RelativeLayout>
drawable/test
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:left="-8dp"
android:right="-8dp"
android:top="-8dp">
<shape>
<corners
android:bottomLeftRadius="35dp"
android:bottomRightRadius="35dp" />
<stroke
android:width="4dp"
android:color="#17E208" />
</shape>
</item>
</layer-list>
OUTPUT
How to set elevation color?
Unfortunately, the color of the shadow produced by Android's setElevation cannot be changed. Also, their Material Design guidelines around the web like here don't seem to indicate that you can change the color.
https://developer.android.com/training/material/shadows-clipping.html
In addition, box shadows in React Native are also not supported on Android, based on this.
Material Button won't cast white elevation shadow on Android 11
As Mike M. has mentioned in the comment, those attributes don't really change the color, they just add a little 'tint'.
If you wanna use material buttons with more features, you should take a look at this library :
Github Repo: Carbon by ZieIony
It should fulfill the required objective (casting white shadows) successfully and without issues on all Android APIs.
Change Card View Elevation Color
here you can change color first you can make a drawable file and paste this code in it. then in your layout inside cardview, you can assign as background file.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<corners android:bottomLeftRadius="8dp"
android:topLeftRadius="5dp"
android:bottomRightRadius="8dp"
android:topRightRadius="5dp"/>
<solid android:color="#ddd"/>
</shape>
</item>
Shadow for EditText Android
You can try using the "elevation" property. Here is the documentation: https://developer.android.com/training/material/shadows-clipping .
To change the color you will need to use Carbon (https://github.com/ZieIony/Carbon). You could also see this answer: Android change Material elevation shadow color .
Material 3 Android - dark theme uses shadows instead of lighter color elevations. Has anyone experienced this? How to solve a problem?
After implementing codelab point by point, I achieved the desired result.
Related Topics
Intellij Fat One Jar Artifact Does Not Generate a Working Output
Giving Jmenuitem's Name to It's Actionlistener
Getextractedtext on Inactive Inputconnection Warning on Android
Private Final Static Attribute VS Private Final Attribute
Easiest Way to Convert a List to a Set in Java
Configuring Log4J Loggers Programmatically
How to Capitalize the First Letter of a String in Java
"Java Dateformat Is Not Threadsafe" What Does This Leads To
Jackson Enum Serializing and Deserializer
How Do Hashtables Deal with Collisions
Getting Spring Application Context
How to Set -Fx-Max-Width to Use_Pref_Size in Javafx CSS
How to Get the Selected Index of a Radiogroup in Android
Show Only Two Digit After Decimal
Where to Stop/Destroy Threads in Android Service Class
Jersey Rest Web Service with Activemq Middleware Integration