相对布局中的 z-index

Question

我需要在RelativeLayout 中的Button 上方放置一个TextView。但它不起作用：TextView 始终位于按钮下方，即使我将它移到按钮之前也是如此。 我还尝试了bringChildToFront() 函数将 textview 移到前面，但没有运气。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/rlBottom"
android:layout_width="fill_parent"
android:layout_height="match_parent">

<Button
    android:id="@+id/bVio"
    android:layout_width="wrap_content"
    android:layout_height="50dip"
    android:layout_alignParentLeft="true"
    android:text="VIO"></Button>

    <TextView
        android:id="@+id/bVio_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@+id/bVio"
        android:layout_marginTop="6dip"
        android:layout_marginRight="6dip"
        android:text="00"
        android:textSize="15dip"
        android:textColor="#FF0000"/>
</RelativeLayout>

Answer 1

在 API 级别 21 (Lollipop/Android 5.0) 及更高级别的 Android 上，当您使用具有高度的项目（例如按钮）时，会出现此问题。

在 Lollipop 之前的设备上排序布局时，Android 将查看 XML 中项目的顺序。项目在 XML 中的位置越靠下，它在 Z-index 中的位置就越高。因此，如果您先放置 Button 并在其下方放置 TextField，它将起作用。

但是，在使用 API 21 以上的 Android 设备上决定 z-index 的顺序时，系统还会查看项目高度并将具有较高高度值的项目呈现在具有较低高度值的项目之上。因此，要使您的设计工作，您必须确保您的 TextField 具有比您的 Button 更高的高度，您可以通过在您的项目上定义 android:elevation 来实现。下面的模拟 XML 适用于 API 级别 21 之前和之后的设备：

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rlBottom"
    android:layout_width="fill_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/bVio"
        android:layout_width="wrap_content"
        android:layout_height="50dip"
        android:layout_alignParentLeft="true"
        android:text="VIO"
        android:elevation="0dp"
        />

    <TextView
        android:id="@+id/bVio_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@+id/bVio"
        android:layout_marginTop="6dip"
        android:layout_marginRight="6dip"
        android:text="00"
        android:textSize="15dip"
        android:textColor="#FF0000"
        android:elevation="10dp"
        />

</RelativeLayout>

Answer 2

通过更改其背景并将 TextView 设置为 centerInParent="True"

，将 RelativeLayout 作为您的按钮

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rlBottom"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/ic_launcher" >

    <TextView
        android:id="@+id/bVio_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="I am khan "
        android:textColor="#FF0000"
        android:textSize="35dip" />

</RelativeLayout>

类

(RelativeLayout)findViewById(R.id.rlBottom).setOnClick(new OnClick... //like a button

Answer 3

添加此代码，它将解决您的问题。

android:stateListAnimator="@null" 

参考this answer

Lollipop 及更高版本中的按钮具有默认高度，这导致它们始终绘制在顶部。您可以通过覆盖默认的 StateListAnimator 来更改它。

尝试将其放入您的按钮 XML：

android:stateListAnimator="@null"

FrameLayout 现在应该覆盖按钮。

Answer 4

您不能为此使用 LinearLayout，但可以使用 FrameLayout。在 FrameLayout 中，z-index 由添加项目的顺序定义，例如：

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/my_drawable"
    android:scaleType="fitCenter"
    />
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|center"
    android:padding="5dp"
    android:text="My Label"
    />

在这种情况下，TextView 将绘制在 ImageView 的顶部，沿着图像的底部中心。

Answer 5

先放置 TextView，然后为按钮应用 layout_below：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rlBottom"
    android:layout_width="fill_parent"
    android:layout_height="match_parent">

        <TextView
            android:id="@+id/bVio_count"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignRight="@+id/bVio"
            android:layout_marginTop="6dip"
            android:layout_marginRight="6dip"
            android:text="00"
            android:textSize="15dip"
            android:textColor="#FF0000"/>

        <Button
            android:id="@+id/bVio"
            android:layout_width="wrap_content"
            android:layout_height="50dip"
            android:layout_alignParentLeft="true"
            android:layout_below="@+id/bVio_count"
            android:text="VIO"/>

</RelativeLayout>