Is it possible to change the color of the shadow around the CardView? Mainly used to mark selected the card as it were lighted on?
Should be valid on L and pre-L devices.
CardView shadow colors are defined in the resources of the CardView library. You can override them by redefining the resource value in your own project but you can not change them dynamically by code.
Edit: overriding the resource value only affects pre-Lollipop devices. On Lollipop and above, CardView always uses the native shadow implementation whose color cannot be changed.
Update: Check my modification.
Here's a workaround:
Copy the source code of CardView. Then create your own Android Library Module and use this module instead of support library. After these, comment or remove code in CardView like below:
static {
// if (Build.VERSION.SDK_INT >= 21) {
// IMPL = new CardViewApi21Impl();
// } else
if (Build.VERSION.SDK_INT >= 17) {
IMPL = new CardViewApi17Impl();
} else {
IMPL = new CardViewBaseImpl();
}
IMPL.initStatic();
}
That is, you will use compat-version CardViewApi17Impl even when api is 21 or higher. Then, you can define your own cardview_shadow_start_color and cardview_shadow_end_color to override those in class RoundRectDrawableWithShadow. Furthermore, you can make that more customizable.
Hope can help someone.
I've used a small trick. One CardView is put behind another one. Both are the same, difference is card_view:cardElevation="10dp" for background one, and card_view:cardElevation="2dp" for faced one. The subtraction of elevation provides how long is your shadow, and color of the second CardView gonna be color of the shadow for first one.
Example:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/view_click_basement"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
card_view:cardCornerRadius="5dp"
card_view:cardBackgroundColor="#color/colorNewGreen"
card_view:cardElevation="10dp"
card_view:cardUseCompatPadding="true">
<android.support.v7.widget.CardView
android:id="#+id/view_click"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="2dp"
card_view:cardUseCompatPadding="true">
Try this :-
android:outlineSpotShadowColor="#color/"
android:outlineAmbientShadowColor="#color/"
Related
Hello can you tell me how can I add the rectangular box in the android layout which adds up like a 3d effect as in the below screenshot. Thanks.
You can add this effect to almost every view or widget, using android:elevation attribute, or programmatically using setElevation(x) method. X is number of Dp.
Note: This only works on api level 21 or newer.
you are referring to material design you can add this effect using card view
Add elevation to your view
read this documentation for assigning elevation to your view
https://developer.android.com/training/material/shadows-clipping.html
Add dependency compile 'com.android.support:cardview-v7:23.0.1'
<android.support.v7.widget.CardView
android:id="#+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="#color/grey_300"
card_view:cardCornerRadius="5dp"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true">
This is my card_view. I have mentioned card_view:cardElevation.
But still shadow is not showing.
I have searched many links. Everywhere they have mentioned to use card_view:cardElevation.
<android.support.v7.widget.CardView
android:id="#+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="#color/white"
card_view:cardCornerRadius="4dp"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true"
app:cardPreventCornerOverlap="false">
</android.support.v7.widget.CardView>
Can you tell what I am missing here?
Read https://developer.android.com/training/material/lists-cards.html
To create a card with a shadow, use the card_view:cardElevation
attribute. CardView uses real elevation and dynamic shadows on Android
5.0 (API level 21) and above and falls back to a programmatic shadow implementation on earlier versions. For more information, see
Maintaining
Compatibility.
UPDATE
try adding margin to card if you want to see shadow
check https://developer.android.com/reference/android/support/v7/widget/CardView.html
Set the following attribute in your cardview
card_view:cardUseCompatPadding = "true"
card_view:cardElevation = "5dp"
Following code works perfectly on Kitkat, but shadows are not visible in Lollipop.
Actually I can see shadow in Android Studio Preview, but not while running on a device/emulator. I'm using CardView for adapter of ViewPager (android.support.v4.view.ViewPager)
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardUseCompatPadding="true"
card_view:cardCornerRadius="4dp"
card_view:cardElevation="6dp">
Actually it also shows shadow in L version, but it is based on elevation so you can't see the shadow if card height is match parent
try adding margin to card if you want to see shadow
Found the solution. I'm able to get the shadow effect using following code.
android:background="#android:drawable/dialog_holo_dark_frame"
I have an app that runs well in any version of android, but in Lollipop seems that all views don't respect any margin or padding.
Does anyone know why??
Thanks in advance.
I'm declaring the CardView like this:
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view1"
android:background="#color/backgroundItem"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_marginRight="2dp"
android:layout_marginLeft="2dp"
card_view:cardCornerRadius="0dp"
android:layout_weight="1">
Per the CardView documentation:
Note that, if you specify exact dimensions for the CardView, because of the shadows, its content area will be different between platforms before L and after L. By using api version specific resource values, you can avoid these changes. Alternatively, If you want CardView to add inner padding on platforms L and after as well, you can set setUseCompatPadding(boolean) to true.
I'm trying to implement simple cardview with semi-transparent background.
<android.support.v7.widget.CardView
android:id="#+id/card_view"
app:cardBackgroundColor="#33FFFFFF"
app:cardCornerRadius="4dp"
android:foreground="#33FFFFFF"
android:padding="20dp"
android:layout_width="match_parent"
android:layout_height="100dp">
......
</android.support.v7.widget.CardView>
And this is the result in L and preL
android L: (Nexus 5)
Pre L:
Any idea how to fix the pre L to look like L ?
As you can see there are too many borders/strokes surrounding the card.
I'm can guess it relates to shadows and stuff...
Thanks.
Look like it's a known defect in google forums
Thanks to #benhylau for providing implementation for cardview with alpha here
There no possible to color cardview background with #__FFFFF as it ignores the transparency values. need to work with alpha attribute