Is it possible to place one view over another in android?
Solution 1
FrameLayouts
let you pile each view on top of the one below. This can also be achieved with a RelativeLayout
.
Solution 2
The FrameLayout
is the simplest ViewGroup
and stacks the Views
in the order they're defined in layout XML (or added programmatically); the first will be lower, and the last will be on top.
Here is an example where two Views
are stacked and offset to better illustrate the point:
Here is the actual layout XML with the two overlapping TextView
boxes. The offset of the two boxes is done using android:layout_gravity
while android:gravity
is used for centering the text itself within each box.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="100dp"
android:layout_height="100dp">
<TextView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="top|left"
android:background="@android:color/holo_blue_light"
android:gravity="center"
android:text="First is below"/>
<TextView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="bottom|right"
android:background="@android:color/holo_green_light"
android:gravity="center"
android:text=" Last is on top"/>
</FrameLayout>
Solution 3
Just in case if you want to place a view on top of a ButtonView then use this;
android:elevation="7dp"
for the view which needs to be placed on top of the button.
Solution 4
You can also do it by using ConstraintLayout a new layout introduced by google.
ConstraintLayout allows you to create large and complex layouts with a flat view hierarchy (no nested view groups).
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="4"
tools:context="com.edalat.example.MainActivity">
<VideoView
android:id="@+id/videoView"
android:layout_width="283dp"
android:layout_height="349dp"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="24dp"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="24dp"
android:layout_marginRight="24dp"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="24dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintHorizontal_bias="0.509"/>
<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="@mipmap/ic_launcher"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="24dp"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="24dp"
android:layout_marginLeft="24dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="24dp"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
Solution 5
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/dp_20"
android:background="@color/yellow"
>
<VideoView
android:id="@+id/videoview"
android:layout_width="wrap_content"
android:layout_centerInParent="true"
android:layout_height="300dp"
android:contentDescription="@string/app_name"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/camera"
android:layout_margin="30dp"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:id="@+id/imageView" />
</RelativeLayout>
Comments
-
kiki almost 3 years
Can we place a small view over another large view? For example, I have a VideoView which is playing a file in the background. Over this, somewhere in the middle/corner, I want to place another ImageView.
But in Linear/Relative Layout, views can be placed only one after another or relative to each other, and AbsoluteLayout is advised against. So what do I do?
-
kiki over 13 yearsCould you please give me an example of either case? I am not able to think it out.
-
McStretch over 13 years@kiki - Google "android FrameLayout" and you'll find plenty of examples.
-
nograde about 12 years
-
Gaurav Agrawal over 11 yearsUse FrameLayout as it allow you to overlapping between views
-
Chivorn almost 6 yearsThanks. It worked, but also worked with 1dp up for me.
-
viper almost 5 yearsExactly what I needed.
-
Zulqarnain almost 4 yearsThanks , I got stuck to send back the button for hours.You saved my day
-
KennyAli over 3 yearsThis answer is pure gold!
-
Martin Olariaga almost 3 yearsIn ConstraintLayout, views are placed taking in consideration the order. For example
<ConstraintLayout> <View1/> <View2/> </ConstraintLayout>
View2 will be placed over View1 (if both are in the same place on screen) -
Nadeem almost 3 yearsIf you are using materialCardView Like components then you should use android:cardElevation
-
Ronen Festinger about 2 yearsIt doesn't work. can't drag the element over the bottom element in design view.