CODEWITHSUNDEEP
androidandroid-layoutandroid-5.0-lollipopmaterial-design
Martin
Martin

Reputation: 24316

FloatingActionButton placed above another 2 widgets

Using the Lollipop version of Android (v5.0) and following Material Design guidelines, I figured out how to create a FloatingActionButton using an ImageButton tag and elevation.

How is it possible to get the effect of the button sitting between (and on top) of 2 other widgets?

     widget A
---------O---------  <<<<  button is placed on top where widget a and b meet
     widget B

I am stuck, anyone have some example XML?

Thanks in advance

Upvotes: 0

Views: 101

Answers (1)

Daniel Veihelmann
Daniel Veihelmann

Reputation: 1487

In XML, you can use a FrameLayout or a RelativeLayout to overlay widgets like buttons and other views. Quick example using FrameLayout:

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

<View
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:background="#88AAAA" />

<View
    android:layout_marginTop="108dp"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:background="#AA88AA" />

<!-- Your fab button -->
<ImageButton
    android:layout_width="60dp"
    android:layout_height="60dp"
    android:layout_gravity="center_horizontal"
    android:background="#ff0000"
    android:layout_marginTop="68dp" />

</FrameLayout>

Result:

FrameLayout to overlay views:

Upvotes: 1

Related Questions