Eddi
Eddi

Reputation: 577

How to create 2 vertical left right pane with header and footer pane layout in android?

Just like this

<--Header-->

Left | Right

<--Footer-->

Where I will put a search textBox on header pane and then a listView on left pane and the right pane will have text field to display detail about selected item in listView. The footer will have some Buttons on it.

Upvotes: 1

Views: 254

Answers (3)

Hanan
Hanan

Reputation: 444

<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"
tools:context="com.example.layouttest.MainActivity" >

<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/white"
    android:text="I am Header" />

<Button
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:text="I am Footer" />

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="200dp"
    android:layout_centerVertical="true"
    android:weightSum="2" >

    <ListView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:divider="@android:color/black"
        android:dividerHeight="2px"
        android:padding="5dp" >
    </ListView>

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:hint="Details of List View" />
</LinearLayout>

 </RelativeLayout>

Upvotes: 1

joao2fast4u
joao2fast4u

Reputation: 6892

I am not usually a fan of "ask and get" method. You must show what you have tried so far and explain what is not working on your code. But since you haven't given more feedback about your issue, here it goes. You can have a simple layout like that just using LinearLayouts and RelativeLayouts as parent Views. Then, insert the specific Views you are referring (TextView, ListView) inside those parent views. Like this:

    <?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" >

    <LinearLayout
        android:id="@+id/headerLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:orientation="vertical" >


    </LinearLayout>

    <LinearLayout
        android:id="@+id/contentLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/headerLayout"
        android:gravity="center"
        android:orientation="horizontal"
        android:weightSum="2" >

        <ListView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" >
        </ListView>

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Description" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/footerLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal" >

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button1" />
    </LinearLayout>

 </RelativeLayout>

This is just a scratch. But from here, you can costumize it as you like.

Upvotes: 1

Hanan
Hanan

Reputation: 444

This Example May help you to handle Header and Footer in RelativeLayout.

Upvotes: 0

Related Questions