Java Android 高程未在按钮上显示阴影

Android elevation not showing shadow on Button

提问by Ramiro

Can't get button shadows to show up.

无法显示按钮阴影。

Stripped down my code to the minimal example:

将我的代码精简为最小示例：

activity_main.xml

活动_main.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:id="@+id/main_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="10dp">

            <Button
                android:id="@+id/my_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_marginLeft="20dp"
                android:elevation="10dp"
                android:translationZ="10dp"
                android:background="@android:color/holo_green_light"
                android:text="BUTTON"/>

        </RelativeLayout>

    </LinearLayout>

</ScrollView>

I need that layout structure.

我需要那种布局结构。

MainActivity.java

主活动.java

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

}

Shadows is visible in Android Studio designer:

阴影在 Android Studio 设计器中可见：

But not shown at runtime:

但在运行时不显示：

Tested on:

测试：

• Genymotion Google Nexus 5X - Marshmallow 6.0.0 - API 23
• Genymotion Google Nexus 5 - Lollipop 5.1.0 - API 22
• Genymotion Samsung Galaxy S2 - Jelly Bean 4.1.1 - API 16
• Hardware device, Samsung Galaxy S5 mini - KitKat 4.4.2 - API 19

• Genymotion 谷歌 Nexus 5X - 棉花糖 6.0.0 - API 23
• Genymotion 谷歌 Nexus 5 - 棒棒糖 5.1.0 - API 22
• Genymotion 三星 Galaxy S2 - 果冻豆 4.1.1 - API 16
• 硬件设备，三星 Galaxy S5 mini - KitKat 4.4.2 - API 19

All same result.

结果都一样。

I'm using:

我正在使用：

• Android Studio 2.1.2
• minSdkVersion 16
• targetSdkVersion 24

• 安卓工作室 2.1.2
• minSdk 版本 16
• 目标SDK版本24

Please create a new project in Andriod Studio, Empty Activity template, then copy and paste that code into activity_main.xmland MainActivity.javaso you can test and tell me.

请在 Andriod Studio 中创建一个新项目，空活动模板，然后将该代码复制并粘贴到其中activity_main.xml，MainActivity.java以便您进行测试并告诉我。

采纳答案by Harshad Pansuriya

The default Buttonstyle under Materialhas a StateListAnimatorthat controls the android:elevationand android:translationZproperties.

下的默认Button样式Material具有StateListAnimator控制android:elevation和android:translationZ属性。

_{copied from here}

_{从这里复制}

just add this property to your Button. you can set your own using the android:stateListAnimatorproperty.

只需将此属性添加到您的Button. 您可以使用该android:stateListAnimator属性设置自己的。

android:stateListAnimator="@null"

full code :

完整代码：

        <Button
                android:id="@+id/my_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_marginLeft="20dp"
                android:elevation="2dp"
                android:translationZ="2dp"
                android:stateListAnimator="@null"
                android:background="@android:color/holo_green_light"
                android:text="BUTTON">

UpDate :

更新 ：

for Understanding I set it 10dp..

为了理解，我将其设置为 10dp ..

xml code :

xml代码：

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="20dp">

        <Button
            android:id="@+id/my_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginLeft="20dp"
            android:elevation="10dp"
            android:translationZ="10dp"
            android:stateListAnimator="@null"
            android:background="@android:color/holo_green_light"
            android:text="BUTTON"/>

    </RelativeLayout>

回答by Khan

It was working in my case, Give it a try app:elevation

它在我的情况下有效，试一试 app:elevation

<Button
    android:id="@+id/my_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_marginLeft="20dp"
    android:layout_topLeft="20dp"
    app:elevation="2dp"
    android:translationZ="2dp"
    android:background="@android:color/holo_green_light"
    android:text="BUTTON">

回答by Lovekush Vishwakarma

I've been playing around with shadows on Lollipop for a bit and this is what I've found:

我一直在 Lollipop 上玩阴影，这就是我发现的：

It appears that a parent?ViewGroup's bounds cutoff the shadow of its children for some reason and shadows set with?android:elevation?are cutoff by the?View's bounds, not the bounds extended through the margin;

似乎父级？ViewGroup 的边界出于某种原因切断了其子级的阴影，并且阴影设置为？android:elevation? 被?View 的边界截断，而不是通过边距延伸的边界；

The right way to get a child view to show shadow is to set padding on the parent and set?android:clipToPadding=falseon that parent.

让子视图显示阴影的正确方法是在父视图上设置填充并设置？android:clipToPadding=false在那个父母身上。

Here's my suggestion to you based on what I know:

这是我根据我所知道的给你的建议：

Set your top-level?RelativeLayout?to have padding equal to the margins you've set on the relative layout that you want to show shadow; Set?android:clipToPadding=falseon the same?RelativeLayout;

设置您的顶级？RelativeLayout？使填充等于您在要显示阴影的相对布局上设置的边距；放？android:clipToPadding=false在同一个？RelativeLayout;

Remove the margin from the?RelativeLayout?that also has elevation set.

从同样设置高程的?RelativeLayout? 中删除边距。

At the end of the day, your top-level relative layout should look like this:

在一天结束时，您的顶级相对布局应如下所示：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
style="@style/block" android:gravity="center"
android:layout_gravity="center"
android:background="@color/lightgray"
android:paddingLeft="40dp"
android:paddingRight="40dp"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:clipToPadding="false" >

The interior relative layout should look like this:

内部相对布局应如下所示：

<RelativeLayout 
android:layout_width="300dp" 
android:layout_height="300dp" 
android:background="[some non-transparent color]" 
android:elevation="30dp" >