RelativeLayout : different result when change relative between view

Question

I have this layout : first, is a spinner, after that is a listview, after that is a linearlayout include EditText and Button, and at the bottom of the screen is a Button.

Here is my first layout file:

<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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:orientation="vertical">

    <Spinner
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:textColor="#0e0e0e"
        android:layout_above="@+id/list_view"
        android:id="@+id/spinner"/>

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/list_view"
        android:layout_alignParentLeft="true"
        android:layout_above="@+id/linear_layout" />


    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/linear_layout"
        android:layout_above="@+id/search_btn"
        android:weightSum="3"
        android:layout_alignParentLeft="true">

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/insert_chord_edit_text"
            android:layout_weight="2"
            android:text=""/>

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/add_chord_button"
            android:layout_weight="1"
            android:text="Add"/>

    </LinearLayout>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/search_btn"
        android:text="Search"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="32dp" />

</RelativeLayout>

Everything works fine, except that I cannot see Spinner. (and I have tested on real device). after that, I change layout above. Instead of say : spinner is above listview and listview is above of linearlayout. I change to : listview is below of spinner and listview is above of linearlayout. I have change as below layout:

<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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:orientation="vertical">

    <Spinner
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:textColor="#0e0e0e"
        android:id="@+id/spinner"/>

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/list_view"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/spinner"       // ADD THIS LINE
        android:layout_above="@+id/linear_layout" />


    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/linear_layout"
        android:layout_above="@+id/search_btn"
        android:weightSum="3"
        android:layout_alignParentLeft="true">

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/insert_chord_edit_text"
            android:layout_weight="2"
            android:text=""/>

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/add_chord_button"
            android:layout_weight="1"
            android:text="Add"/>

    </LinearLayout>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/search_btn"
        android:text="Search"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="32dp" />

</RelativeLayout>

And it works as I want, but I cannot explain why. Please tell me.

Thanks :)

Answer 1

// try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"
    android:orientation="vertical" >

    <Spinner
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:textColor="#0e0e0e"
        android:id="@+id/spinner"/>

    <ListView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:id="@+id/list_view"/>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="5dp"
        android:id="@+id/linear_layout">

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/insert_chord_edit_text"
            android:layout_weight="2"
            android:text=""/>

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/add_chord_button"
            android:layout_weight="1"
            android:text="Add"/>

    </LinearLayout>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/search_btn"
        android:text="Search"
        android:layout_marginBottom="5dp"
        android:layout_marginTop="5dp"/>
</LinearLayout>

Answer 2

set layout_weight="1" for your Spinner may solve your problem.

Answer 3

In first case, your listview was mentioned as height fill parent and it has layout_above attribute but no layout_below attribute. So the listview occupied all height above the linear_layout element. Thats why you cant see the spinner.as the spinner visibility is overridden by listview.