RelativeLayout is taking fullscreen for wrap_content

AndroidAndroid Layout

Android Problem Overview


Why does FOOBARZ get layed out all the way at the bottom when no elements are layout_height="fill_parent" in other words, all elements are wrap_content for height? enter image description here

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content">
	<TextView
		android:id="@+id/feed_u"
		android:layout_width="50dip"
		android:layout_height="50dip"
		android:layout_marginLeft="5dip"
		android:scaleType="centerCrop"
		android:drawableTop="@android:drawable/presence_online"
		android:text="U" />
	<RelativeLayout
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:layout_toRightOf="@id/feed_u">
		<ImageView
			android:id="@+id/feed_h"
			android:layout_alignParentRight="true"
			android:layout_alignParentTop="true"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:src="@android:drawable/btn_minus" />
		<ImageView
			android:id="@+id/feed_ha"
			android:layout_toLeftOf="@id/feed_h"
			android:layout_alignParentRight="true"
			android:layout_alignParentTop="true"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:src="@android:drawable/btn_plus" />
		<TextView
			android:id="@+id/feed_t"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:text="Title">
		</TextView>
		<TextView
			android:id="@+id/feed_a"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:text="Band"
			android:layout_below="@id/feed_t">
		</TextView>
		<TextView
			android:id="@+id/feed_s"
			android:layout_below="@id/feed_a"
			android:text="S"
			android:layout_height="wrap_content"
			android:layout_width="wrap_content">
		</TextView>
		<TextView
			android:id="@+id/feed_tm"
			android:layout_alignParentBottom="true"
			android:layout_alignParentRight="true"
			android:text="FOOBARZ"
			android:layout_height="wrap_content"
			android:layout_width="wrap_content">
		</TextView>

	</RelativeLayout>
</RelativeLayout>

Android Solutions


Solution 1 - Android

From the RelativeLayout doc:

>Class Overview > >A Layout where the positions of the children can be described in relation to each other or to the parent. > >Note that you cannot have a circular dependency between the size of the RelativeLayout and the position of its children. For example, you cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a child set to ALIGN_PARENT_BOTTOM

Class documentation

Which is exactly your case. RelativeLayout can not do that.

Solution 2 - Android

For those looking for a solution to this, like I did, you can use FrameLayout instead of RelativeLayout.

Then you can set the gravity the intended object to bottom right as below

<TextView
    android:layout_gravity="bottom|right"
    android:text="FOOBARZ"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content">
</TextView>

Solution 3 - Android

You have set the RelativeLayout to "wrap_content" and the TextView to android:layout_alignParentBottom="true", so it automatically tries to stretch the RelativeLayout to the bottom. Don't use such dependencies with Relative Layout, as it can count as "circular dependencies".

From the docs for RelativeLayout:

> Note that you cannot have a circular dependency between the size of the RelativeLayout and the position of its children. For example, you cannot have a RelativeLayout whose height is set to WRAP_CONTENT and a child set to ALIGN_PARENT_BOTTOM.

Try to align your TextView to something other than the parent RelativeLayout, but watch out for this problem as well:
https://stackoverflow.com/questions/6479461/circular-dependencies-need-some-help-with-exact-code

Alternatively, try to add more sophisticated inner layouts.

Solution 4 - Android

Dont use alight_Parent type properties with the child views

You can use frame layout instead of RelativeLayout with respective gravity

    <FrameLayout
    android:layout_height="wrap_content"
    android:layout_width="wrap_content">
     <TextView
        android:layout_gravity="bottom|right"
        android:text="Hello "
        android:layout_height="wrap_content"
        android:layout_width="wrap_content">
    
    </TextView>

</FrameLayout>

Solution 5 - Android

FrameLayout is usually good for placing different views one on top of each other (where the most recent child is on top of the previous child). In your case, you'd like to place views one next to each other (above, below, start, end), so I think ConstrainLayout fits better because it's exactly what it does.

Unlike RelativeLayout, you'd be able to set the ConstrainLayout width to wrap_content and still arrange its children views as you wish, for example instead of

android:layout_alignParentTop="true"

you can use

grid:layout_constraintTop_toTopOf="parent" 

and instead of

android:layout_alignParentBottom="true"

you can use

grid:layout_constraintBottom_toBottomOf="parent"

Solution 6 - Android

Good answers. Now if you don't have layout_alignParentBottom="true" and still getting this issue watch out for android:background="@drawable/bkgnd" where bkgnd is a biggie.

Solution 7 - Android

I'm not sure why the clean and obvious way of accomplishing this hasn't been posted yet. This performant solution works for any View MyView with a known height.

Wrap your RelativeLayout with height wrap_content in a FrameLayout:

<!-- width here should constrain RelativeLayout -->
<FrameLayout 
     android:layout_width="@dimen/my_layout_width"
     android:layout_height="wrap_content">

     <RelativeLayout  
          android:layout_width="match_parent"
          android:layout_height="wrap_content" />

     <MyView
        ...
        android:layout_gravity="bottom" />
</FrameLayout>

Just note that the view at the bottom of the FrameLayout will be on top of your RelativeLayout content, so you'll need to add padding to the bottom of that layout to accomodate it. If you want that view to be variable height, you can either Subclass FrameLayout to add padding in code based on the measured view height, or just change the FrameLayout to vertical LinearLayout if you're not worried about the performance, i.e. it's not a listview item, or the views are relatively lightweight.

Solution 8 - Android

Not sure why all the answers here suggest FrameLayout, which is designed to render a single view or views layered in the z axis. OP's problem is a sequence of views stacked vertically, which should be in a LinearLayout.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionhunterpView Question on Stackoverflow
Solution 1 - Androiduser658042View Answer on Stackoverflow
Solution 2 - AndroidMuzView Answer on Stackoverflow
Solution 3 - AndroidDirolView Answer on Stackoverflow
Solution 4 - AndroidAmit PathakView Answer on Stackoverflow
Solution 5 - AndroidAmir GolanView Answer on Stackoverflow
Solution 6 - AndroidkellogsView Answer on Stackoverflow
Solution 7 - AndroidJohnny CView Answer on Stackoverflow
Solution 8 - AndroidChristopher PickslayView Answer on Stackoverflow