z-index in Relative layout

问题

I need to place a TextView above the Button in RelativeLayout. But it is not working: TextView is always under the Button, even if I move it before the button. I also tried bringChildToFront() function to move textview on front, but no luck.

<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>

回答1:

I stumbled upon this question a little late, but here’s I how solved it.

The problem occurs on Android with an API level 21 (Lollipop/Android 5.0) and above when you work with items which have an elevation, such as the Button.

When ordering the layout on pre Lollipop devices Android will look to the order of the items in the XML. The further down an item is in the XML the higher up it is in Z-index. So if you place the Button first and the TextField below it, it will work.

However, when deciding the order of the z-index on devices with Android above API 21 the system will also look at the items elevation and render items with a higher elevation value above items with a lower elevation value. So to get your design to work you must make sure that your TextField has a higher elevation than your Button which you can achieve by defining android:elevation on your items. The mock XML below works on devices pre and post API level 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>

回答2:

Take RelativeLayout as your button by changing its background and set TextView as centerInParent="True"

<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>

Class

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

回答3:

add this code, it will solve your problem.

android:stateListAnimator="@null"

reference this answer

Buttons in Lollipop and higher have a default elevation to them which causes them to always draw on top. You can change this by overriding the default StateListAnimator.

Try putting this into your button XML:
android:stateListAnimator="@null"
The FrameLayout should now cover the button.

回答4:

Place the TextView first than apply layout_below for button:

<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>

来源：https://stackoverflow.com/questions/27132825/z-index-in-relative-layout

标签

android

z-index

android-relativelayout