How to change app:elevation programmatically

Question

My app is work for API 19. So I can't use android:elevation. So I app:elevation in my layout.

Android XML: android:elevation vs. app:elevation

For exemple :

<android.support.design.widget.AppBarLayout
    android:id="@+id/appBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    app:elevation="5dp">

How to change app:elevation programmatically ? I can change android:elevation but I can't find how to change app:elevation !

score 51 · Accepted Answer · edited Apr 19 '20 at 23:01

51

Try with using the following code

ViewCompat.setElevation(View, float)

Following the below link. Here showed how to make elevation on pre-lollipop device

Android AppCompat 21 Elevation

edited Apr 19 '20 at 23:01

now

4,772
2
24
26

answered May 10 '16 at 17:24

Masum

4,879
2
23
28

Please describe here what would be the value of "View". – akshat tailang May 23 '20 at 07:54
The 'View' would be the xml element to which you are trying to add the elevation to. For instance if you have ImageView or a LinearLayout with an android:id="@+id/my_custom_id" then the code would be ViewCompat.setElevation(my_custom_id, 15F) – Anudeep Ananth May 23 '20 at 13:38
This doesn't work with `android.support.design.widget.AppBarLayout` – Michael Abyzov May 13 '22 at 15:08

Archie G. Quiñones · Answer 2 · 2018-08-29T09:14:08.430

The accepted answer won't actually work. The answer should have been updated.

If you look at why mAppBarLayout.setTargetElevation(0) is deprecated. it states that:

@deprecated target elevation is now deprecated. AppBarLayout's elevation is now controlled via a {@link android.animation.StateListAnimator}. This method now always returns 0.

So to programmatically set the appbar layout you can only do it by creating a StateListAnimator such as appbar_state_unelevated_animator at the animator res folder:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item>
    <objectAnimator
        android:propertyName="elevation"
        android:valueTo="4dp"
        android:valueType="floatType"
        android:duration="100"/>
</item>

then loading it in code like so:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        appbar.stateListAnimator = AnimatorInflater.loadStateListAnimator(applicationContext, R.animator.appbar_state_unelevated_animator)
    }

If I'm not mistaken you could also create a StateListAnimator by code but don't take my word for it.

Update:

In my experience when you set the app:elevation="//Any DP value//"

The Shadow of the app bar will be lost. Simple remove that line to get the appbar shadow again.

Your answer makes a lot of sense, especially with the Google documentation. But its not working for me. I really wonder why. Do you mind sharing a sample git project where this method is working? Or I can share mine here, if you're still tracking this issue... — katie, Aug 08 '18 at 20:35
You can share me yours coz, the code above is all you ever need to do this. There probably something which is specific to your implementation. Maybe I could help you with that. Go ahead and share me your code. — Archie G. Quiñones, Aug 09 '18 at 03:04

score 10 · Answer 3 · answered Feb 10 '20 at 12:40

I would like to provide updated and full answer:

    switch (state) {
        case On:
            appBarLayout.setStateListAnimator(AnimatorInflater.loadStateListAnimator(getContext(), R.animator.appbar_elevation_on));
            break;
        case Off:
            appBarLayout.setStateListAnimator(AnimatorInflater.loadStateListAnimator(getContext(), R.animator.appbar_elevation_off));
            break;
    }

appbar_elevation_on.xml under RES\animator

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    tools:ignore="PrivateResource">
    <item>
        <objectAnimator
            android:propertyName="elevation"
            android:valueTo="@dimen/design_appbar_elevation"
            android:valueType="floatType" />
    </item>
</selector>

appbar_elevation_off.xml under RES\animator

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    tools:ignore="PrivateResource">
    <item>
        <objectAnimator
            android:propertyName="elevation"
            android:valueTo="0dp"
            android:valueType="floatType" />
    </item>
</selector>

Thank you for complete answer. – JerabekJakub May 06 '20 at 14:30 — JerabekJakub, May 06 '20 at 14:30

score 4 · Answer 4 · edited May 23 '17 at 11:47

4

Since you try to change the elevation of the Action bar you can easily use this line, which will work on API 19

getSupportActionBar().setElevation(0);

or you follow this link and check out how to change the elevation of views on Android below API 21 generally

Android AppCompat 21 Elevation

edited May 23 '17 at 11:47

Community

1
1

answered May 10 '16 at 17:21

Chris Sherlock

931
5
19

2

That's change android:elevation. Not what I want :x – Eraseth May 10 '16 at 17:23
2

No, that dosesn't work. I except for a setAppElevation or something else. – Eraseth May 10 '16 at 17:37
I just used it in a an app min api 15 – Chris Sherlock May 10 '16 at 17:39

score 0 · Answer 5 · answered Jun 07 '17 at 06:53

0

Accepted answer didn't work for me.

To remove shadow in Toolbar use

app:elevation="0" in AppBarLayout xml or

use mAppBarLayout.setTargetElevation(0) in java.

It worked in my case.

answered Jun 07 '17 at 06:53

Vijay

545
1
5
15

score 0 · Answer 6 · edited Nov 02 '17 at 21:21

The following solution is for NativeScript

let nativeAnView = tnsView.android;
var shape = new android.graphics.drawable.GradientDrawable();
shape.setShape(android.graphics.drawable.GradientDrawable.OVAL);
shape.setColor(android.graphics.Color.parseColor('#30bcff'));
nativeAnView.setBackgroundDrawable(shape);
nativeAnView.setElevation(20);

on Android

let nativeView = tnsView.ios;
nativeView.layer.shadowColor = new Color('#888888').ios.CGColor;
nativeView.layer.shadowOffset = CGSizeMake(0, 2.0);
nativeView.layer.shadowOpacity = 0.5;
nativeView.layer.shadowRadius = 5.0;

on iOS

How to change app:elevation programmatically

6 Answers6