Z10987654321X
Z10987654321X

Reputation: 124

Layout issues; Overlapping buttons

How do I make it so that Button 3 AND the relativelayout (with the blue background) are both in front of Button 2? They are both higher (in value) in the component tree but Button 2 is still in front of everything.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_marginStart="75dp"
    android:layout_marginTop="64dp"
    android:text="Button 2" />

<RelativeLayout
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:layout_alignStart="@+id/button2"
    android:layout_alignTop="@+id/button2"
    android:layout_marginStart="48dp"
    android:background="@android:color/holo_blue_bright"
    android:id="@+id/relativeLayout">

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@+id/relativeLayout"
        android:layout_alignTop="@+id/button2"
        android:layout_marginStart="11dp"
        android:layout_marginTop="17dp"
        android:text="Button 3" />
</RelativeLayout>

enter image description here

Upvotes: 2

Views: 394

Answers (1)

R. Zag&#243;rski
R. Zag&#243;rski

Reputation: 20268

The answer lies in material design specs. Raised buttons (and that is the button that has no style applied) has a default elevation of 2dp, while RelativeLayout has 0dp. My suggestion is to apply style="@style/Widget.AppCompat.Button.Borderless" to the button2. Then it has 0dp elevation. If you want colored button, apply android:background to it.

Upvotes: 4

Related Questions