高于 2dp 的高度会导致按钮消失
Elevation above 2dp causes buttons to disappear
在我下面的代码中,我有一个高度为 8dp 的白色视图。蓝色按钮的高度为 10dp,因此理论上它应该显示。然而,事实并非如此。它只显示不在白色视图正上方的部分。我知道这与海拔有关,但我不知道到底是什么。我已经猜到当白色视图 =<2 时它很好,但是一旦我将它设置得更高,问题就出现了。
这是我的代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_width="match_parent"
android:layout_height="@dimen/login_background"
android:background="@color/colorPrimary" />
<View
android:id="@+id/view"
android:layout_width="@dimen/login_container_width"
android:layout_height="@dimen/login_container_height"
android:layout_centerHorizontal="true"
android:layout_marginTop="@dimen/login_container_margin_top"
android:background="@drawable/login_container"
android:elevation="8dp">
</View>
<Button
android:id="@+id/button"
android:layout_width="190dp"
android:layout_height="50dp"
android:layout_marginBottom="52dp"
android:background="@drawable/login_button"
android:elevation="10dp"
android:text="LOGIN"
android:textColor="@color/white"
android:textSize="20sp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
</LinearLayout>
以下反映了 this Stack Overflow 问题和接受的答案。
让我们考虑一下您的起点。我无权访问您的所有维度等,以使以下内容看起来与您的示例完全一样,但基础就在那里。下面是基本布局。您可以看到按钮位于视图下方,即使视图的高度为 8dp
并且按钮的高度为 10dp
.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">
<View
android:id="@+id/view"
android:layout_width="match_parent"
android:layout_height="175dp"
android:layout_alignBottom="@+id/button"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
android:layout_margin="30dp"
android:background="@android:color/white"
android:elevation="8dp">
</View>
<Button
android:id="@+id/button"
android:layout_width="190dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="52dp"
android:background="@mipmap/ic_launcher"
android:elevation="10dp"
android:text="LOGIN"
android:textColor="@color/white"
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
那么,这是为什么呢?这是因为按钮 XML 中的 android:elevation="10dp"
并未真正定义高度。相反,按钮的高度由 "StateListAnimator" 控制,该 "StateListAnimator" 控制 android:elevation 和 android:translationZ 属性。”(参见上述问题的已接受答案。)
如果您真的不关心 StateListAnimator 为您的布局做了什么,您可以通过将 android:stateListAnimator="@null"
添加到按钮的 XML 来简单地消除它。这是添加此代码后布局的样子。 (请注意,设计器可能不会立即显示更改;Android Studio 3.0 Beta 6 没有)。因此,您可能需要刷新布局才能看到更改。
如您所见,按钮现在如我们预期的那样位于视图上方。
如果您确实关心 StateListAnimator
为您做什么,您将需要定义自己的名称并输入其名称,而不是上面更改的 XML 语句中的 @null
。我上面提到的答案有 Android 可能使用的 StateListAnimator
,因此您可以以此为基础并将海拔高度更改为您喜欢的高度。我没试过,但应该可以。
在我下面的代码中,我有一个高度为 8dp 的白色视图。蓝色按钮的高度为 10dp,因此理论上它应该显示。然而,事实并非如此。它只显示不在白色视图正上方的部分。我知道这与海拔有关,但我不知道到底是什么。我已经猜到当白色视图 =<2 时它很好,但是一旦我将它设置得更高,问题就出现了。
这是我的代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_width="match_parent"
android:layout_height="@dimen/login_background"
android:background="@color/colorPrimary" />
<View
android:id="@+id/view"
android:layout_width="@dimen/login_container_width"
android:layout_height="@dimen/login_container_height"
android:layout_centerHorizontal="true"
android:layout_marginTop="@dimen/login_container_margin_top"
android:background="@drawable/login_container"
android:elevation="8dp">
</View>
<Button
android:id="@+id/button"
android:layout_width="190dp"
android:layout_height="50dp"
android:layout_marginBottom="52dp"
android:background="@drawable/login_button"
android:elevation="10dp"
android:text="LOGIN"
android:textColor="@color/white"
android:textSize="20sp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
</LinearLayout>
以下反映了 this Stack Overflow 问题和接受的答案。
让我们考虑一下您的起点。我无权访问您的所有维度等,以使以下内容看起来与您的示例完全一样,但基础就在那里。下面是基本布局。您可以看到按钮位于视图下方,即使视图的高度为 8dp
并且按钮的高度为 10dp
.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">
<View
android:id="@+id/view"
android:layout_width="match_parent"
android:layout_height="175dp"
android:layout_alignBottom="@+id/button"
android:layout_alignParentEnd="true"
android:layout_alignParentStart="true"
android:layout_margin="30dp"
android:background="@android:color/white"
android:elevation="8dp">
</View>
<Button
android:id="@+id/button"
android:layout_width="190dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="52dp"
android:background="@mipmap/ic_launcher"
android:elevation="10dp"
android:text="LOGIN"
android:textColor="@color/white"
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
那么,这是为什么呢?这是因为按钮 XML 中的 android:elevation="10dp"
并未真正定义高度。相反,按钮的高度由 "StateListAnimator" 控制,该 "StateListAnimator" 控制 android:elevation 和 android:translationZ 属性。”(参见上述问题的已接受答案。)
如果您真的不关心 StateListAnimator 为您的布局做了什么,您可以通过将 android:stateListAnimator="@null"
添加到按钮的 XML 来简单地消除它。这是添加此代码后布局的样子。 (请注意,设计器可能不会立即显示更改;Android Studio 3.0 Beta 6 没有)。因此,您可能需要刷新布局才能看到更改。
如您所见,按钮现在如我们预期的那样位于视图上方。
如果您确实关心 StateListAnimator
为您做什么,您将需要定义自己的名称并输入其名称,而不是上面更改的 XML 语句中的 @null
。我上面提到的答案有 Android 可能使用的 StateListAnimator
,因此您可以以此为基础并将海拔高度更改为您喜欢的高度。我没试过,但应该可以。