Android, layout_above not working

Question

I want to display some text in the middle of the screen, below header and above footer. Since this text is very long I nested it in ScrollView. I have tried a number of solutions: this, this, this, this, and a bunch more...

At first I had a problem of the two relative_layouts overlapping and text being cut of. The most accepted answer is to use layout_above and layout_below, but when I use layout_above, the text is never displayed.

This is what my xml looks like:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<RelativeLayout
    android:id="@+id/linear_layout_header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/gray"
    android:baselineAligned="false"
    android:orientation="horizontal"
    android:padding="5dp"
    android:weightSum="3">

        <ImageView
            android:id="@+id/profile_image"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:layout_margin="10dp"
            android:contentDescription="@string/profile_photo"
            android:src="@drawable/default_profile"
            tools:ignore="RtlHardcoded" />

</RelativeLayout>

<RelativeLayout
    android:id="@+id/scrollViewAndStuff"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_above="@+id/ln_layout_footer"
    android:layout_below="@+id/linear_layout_header">

    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="10dp"
        tools:ignore="UselessParent">

        <TextView
            android:id="@+id/meetupDescription"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="@string/text"/>-
    </ScrollView>

</RelativeLayout>

<RelativeLayout
    android:id="@+id/ln_layout_footer"
    android:layout_width="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_height="match_parent"
    android:gravity="bottom"
    android:orientation="horizontal"
    android:paddingTop="10dp">

    <LinearLayout
        android:id="@+id/ln_layout"
        android:layout_width="fill_parent"
        android:background="@color/gray"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingBottom="5dp"
        android:paddingTop="5dp">

        <TextView
            android:id="@+id/red"
            android:textColor="@color/white"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/red" />

        <TextView
            android:id="@+id/blue"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:textColor="@color/white"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/blue" />

        <TextView
            android:id="@+id/green"
            android:layout_width="match_parent"
            android:textColor="@color/white"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
        android:text="@string/green" />
    </LinearLayout>

</RelativeLayout>

Try putting your RelativeLayout with the text at the end of the xml (after your footer) — Rachit, Mar 03 '17 at 13:17
Try to use just android:layout_above="@id/ln_layout_footer", + is used for assigning new id to view — Hmm, Mar 03 '17 at 13:18

Chirag.T · Accepted Answer · 2017-03-03T13:32:20.413

in your ln_layout_footer

set android:layout_height="wrap_content"

Edited

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

<RelativeLayout
    android:id="@+id/linear_layout_header"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/dark_gray_pressed"
    android:baselineAligned="false"
    android:orientation="horizontal"
    android:padding="5dp"
    android:weightSum="3">

    <ImageView
        android:id="@+id/profile_image"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_margin="10dp"
        android:contentDescription="@string/action_settings"
        android:src="@drawable/img_splash_logo"
        tools:ignore="RtlHardcoded" />

</RelativeLayout>

<RelativeLayout
    android:id="@+id/scrollViewAndStuff"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/ln_layout_footer"
    android:layout_below="@+id/linear_layout_header">

    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="10dp"
        tools:ignore="UselessParent">

        <TextView
            android:id="@+id/meetupDescription"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="@string/txt_price" />-
    </ScrollView>

</RelativeLayout>

<RelativeLayout
    android:id="@+id/ln_layout_footer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:gravity="bottom"
    android:orientation="horizontal"
    android:paddingTop="10dp">

    <LinearLayout
        android:id="@+id/ln_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/dark_gray"
        android:orientation="horizontal"
        android:paddingBottom="5dp"
        android:paddingTop="5dp">

        <TextView
            android:id="@+id/red"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/txt_quantity"
            android:textColor="@color/white" />

        <TextView
            android:id="@+id/blue"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/txt_material"
            android:textColor="@color/white" />

        <TextView
            android:id="@+id/green"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/msg_enter_user_name"
            android:textColor="@color/white" />
    </LinearLayout>

</RelativeLayout>

I did that, and I still have the same issue, if I add layout_above I do not see the text, and if I remove it the text is showing, but it is overlapped by the footer. — Banana, Mar 03 '17 at 13:27
Chiraq is correct. I duplicated this layout and it works fine once the footer is set to wrap_content — Kuffs, Mar 03 '17 at 13:31
@Chirag.T I tried it again with copy paste from your code. It works, I will just have to adjust my code a little bit. Thanks a lot :) — Banana, Mar 03 '17 at 13:38

score 1 · Answer 2 · edited Mar 03 '17 at 15:54

In you layout using two properties that why it doesn't work. So you can remove one properties here is your working code

    <RelativeLayout
    android:id="@+id/scrollViewAndStuff"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/linear_layout_header">

    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="10dp">

        <TextView
            android:textColor="#000"
            android:id="@+id/meetupDescription"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="5dp"
            android:text="@string/text" />-
    </ScrollView>

</RelativeLayout>

you can use this android:layout_below="@+id/linear_layout_header or this android:layout_above="@+id/ln_layout_footer, one property at a time. or simply copy and past

@Shive Kumar Example provided by Chirag.T works and he uses both properties. When I copy/paste his code it works perfectly, and when I modify it I still get some errors, but I think I will be able to modify his code. — Banana, Mar 03 '17 at 13:49

Android, layout_above not working

2 Answers2