CODEWITHSUNDEEP
androidandroid-layout
cesar
cesar

Reputation: 9074

Creating an Android Layout with 2 resizing views

In my layout, I need a header, a list-view, and a footer with a TextView. The TextView needs to be resizable to up to 5 lines. Think facebook chat, where you have the blue header with the name of your friend, the middle content pane, and a text box down below, that grows as you type stuff in:

[header]     a fragment that takes up about 50dp
[content]
[content]
[content]
[content]    something like a ViewGroup with a ListView in it
[content]
[content]
[content]
[footer]     a ViewGroup that contains an EditText and Buttons

I've tried all sorts of different layout settings, but can't get it right. Either the footer takes up all the space, or the content covers the footer.

Here's what I have so far:

<LinearLayout ...>

    <!-- Slot to put Header fragment in -->
    <FrameLayout
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <!-- Here's where the content goes. This is supposed to be a ListView
         inserted as a fragment -->
    <FrameLayout
        android:id="@+id/content"
        ... />

    <include
        android:id="@+id/footer"
        ... />

</LinearLayout>

I left out the layout_width and layout_height values empty, because I don't know what to set them to.

UPDATES Initially, I thought the problem was because my EditText was set to maxLines=5 and TextMultiline, but I tried removing everything but one button with a hardcoded height, and the insert still covered everything. I also tried setting <footer below="content"> but then content just covered footer

Upvotes: 0

Views: 445

Answers (3)

cesar
cesar

Reputation: 9074

The problem was that the footer layout included is another RelativeLayout. The footer layout contains elements that set layout_alignParentBottom="true", which made the footer layout take up the entire screen. I have no idea why it would do that, but that's what happens.

Upvotes: 1

dejavu
dejavu

Reputation: 91

check this...I hope it helps. At the moment I have defined an array.xml in Values folder with some empty entries for ListView. You will have to handle it with code. 

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


        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="HEADER" />    

        <ListView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:entries="@array/chats"
            android:layout_weight="1">

        </ListView>


        <EditText 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:lines="5"
            android:inputType="textMultiLine"
            android:hint=" Please enter your Chat" />  

</LinearLayout>

Upvotes: 0

Shruti
Shruti

Reputation: 5591

For creating a UI like this create a layout

header.xml 

<?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:orientation="horizontal" >

<TextView

            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:text="xyz"
            android:textSize="10dp" />
</LinearLayout>

for footer:

footer.xml

<?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:orientation="horizontal" >

<EditText

            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:text="xyz"
            android:textSize="10dp" />
</LinearLayout>

Create another layout that will contain listView as you said : main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical" >
 **<include layout="@layout/header.xml" android:layout_alignParentTop="true"/>**   
<ListView
        android:id="@+id/listview"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:clickable="true"
        >
    </ListView>
 **<include layout="@layout/footer.xml" android:layout_below="@+id/listview" android:layout_alignParentBottom="true"/>**   
</RelativeLayout>

Upvotes: 0

Related Questions