Limit Height LinearLayout with ListView And Button

Question

I have a LinearLayout like bellow

    <LinearLayout
        android:id="@+id/middleLinearLayout"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:orientation="vertical" >

            <ListView
                android:id="@+id/listView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#00000000"
                android:cacheColorHint="#00000000"
                android:gravity="center"    
                android:listSelector="@drawable/categories_list_item_selector" >
            </ListView>

            <ImageButton
                android:id="@+id/imageButton1"
                android:layout_width="300dp"
                android:layout_height="22dp"
                android:adjustViewBounds="true"
                android:background="@android:color/transparent"
                android:scaleType="fitCenter"
                android:src="@drawable/button_plus" />


    </LinearLayout>

I want the button stick to the ListView at the bottom so if the ListView has 0 items then the button to go up... If the ListView has many items then i want the Button grow as the ListView until will touch the bottom of Linear and then the ListView will stop getting more height.

Thanks for your help...

-----EDIT----------

My full layoout xml is like bellow

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal"
tools:context=".ShowFoodOrSupplement" >

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:scaleType="fitXY"
    android:src="@drawable/main_bg" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentLeft="true"
    android:adjustViewBounds="true"
    android:orientation="vertical" >

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

        <ImageButton
            android:id="@+id/backButton"
            android:layout_width="15dp"
            android:layout_height="16dp"
            android:layout_marginLeft="15dp"
            android:layout_marginTop="10dp"
            android:background="@android:color/transparent"
            android:onClick="backBtnClick"
            android:scaleType="fitXY"
            android:src="@drawable/back_arrow" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="245dp"
            android:layout_height="45dp"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="0dp"
            android:src="@drawable/general_top_image" />

        <TextView
            android:id="@+id/titleTextView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="8dp"
            android:text="το πρόγραμμά μου"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textSize="12sp" />

    </RelativeLayout>

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:adjustViewBounds="true"
        android:src="@drawable/myprogram_breakfast_image" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="6dp" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:src="@drawable/lines_bg_program_food" />

        <ImageButton
            android:id="@+id/imageButton4"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_marginLeft="40dp"
            android:background="@android:color/transparent"
            android:scaleType="fitXY"
            android:src="@drawable/watch_program" />

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="5dp"
            android:layout_toRightOf="@id/imageButton4"
            android:text="--:--" />

        <ImageButton
            android:id="@+id/imageButton5"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_centerHorizontal="true"
            android:background="@android:color/transparent"
            android:scaleType="fitXY"
            android:src="@drawable/alarm_icon" />

        <ImageButton
            android:id="@+id/imageButton6"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_alignParentRight="true"
            android:layout_marginRight="40dp"
            android:background="@android:color/transparent"
            android:scaleType="fitXY"
            android:src="@drawable/copy_program" />
    </RelativeLayout>

    <TextView
        android:id="@+id/textView9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="5dp"
        android:layout_marginTop="3dp"
        android:text="Kcal"
        android:layout_gravity="right"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#000000" />

    <RelativeLayout
        android:id="@+id/middleLinearLayout"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:orientation="vertical" >

            <ListView
                android:id="@+id/listView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#00000000"
                android:cacheColorHint="#00000000"
                android:gravity="center"
                android:listSelector="@drawable/categories_list_item_selector" >
            </ListView>

            <ImageButton
                android:id="@+id/imageButton1"
                android:layout_width="300dp"
                android:layout_height="22dp"
                android:adjustViewBounds="true"
                android:layout_below="@id/listView1"
                android:background="@android:color/transparent"
                android:scaleType="fitCenter"
                android:onClick="PickSomeFood"
                android:src="@drawable/button_plus" />


    </RelativeLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <View
            android:layout_width="fill_parent"
            android:layout_height="1dp"
            android:layout_marginBottom="10dp"
            android:layout_marginTop="10dp"
            android:background="@android:color/darker_gray" />

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="match_parent" >

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_marginLeft="20dp"
                android:text="σύνολο θερμίδων:" />

            <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_marginRight="20dp"
                android:text="0 Kcal" />
        </RelativeLayout>

        <View
            android:layout_width="fill_parent"
            android:layout_height="1dp"
            android:layout_marginBottom="10dp"
            android:layout_marginTop="10dp"
            android:background="@android:color/darker_gray" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center" >

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <ImageButton
                android:layout_width="130dp"
                android:layout_height="35dp"
                android:background="@android:color/transparent"
                android:scaleType="fitXY"
                android:src="@drawable/profile_form_save_button" />

            <TextView
                android:id="@+id/text"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:text="αποθήκευση"
                android:textColor="#ffffff"
                android:textSize="14sp" />
        </FrameLayout>

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <ImageButton
                android:id="@+id/ImageButton02"
                android:layout_width="130dp"
                android:layout_height="35dp"
                android:layout_gravity="center"
                android:background="@android:color/transparent"
                android:scaleType="fitXY"
                android:src="@drawable/profile_form_save_button" />

            <TextView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:text="διαγραφή"
                android:textColor="#ffffff"
                android:textSize="14sp" />
        </FrameLayout>
    </LinearLayout>

    <ImageView
        android:id="@+id/imageViewBottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_marginBottom="5dp"
        android:src="@drawable/bottom_schedule" />

</LinearLayout>

So i want the first linear to get full height of screen, then inside all the widgets above middleLinearLayout to go on top and the rest under of middleLinearLayout to go at the bottom... I succeeded that with adding android:layout_weight="1" so now the middleLinearLayout is getting the rest of height...

Now inside middleLinearLayout i have a ListView and a Button... i want for example if ListView items are 2 then the button will stick at the bottom of ListView and there will be a space till the end of middleLinearLayout...

The problem is that if the ListView Items are more that the height of middleLinearLayout then the UIImageButton beneath ListView Disappears...

take both LIST VIEW and IMAGE BUTTON in two horizontal liner layout and make weight of LIST VIEW's Linearlayout to 1 and look for output — Nitin Misra, Nov 08 '13 at 14:12

score 2 · Answer 1 · answered Nov 08 '13 at 14:18

2

Use RelativeLayout instead of LinearLayout and set property of ImageButton android:layout_below="@id/listView1"

answered Nov 08 '13 at 14:18

Malachiasz

7,126
2
35
49

maybe try with the most parent RelativeLayout android:layout_height="match_parent" and not layout_height="0dip" to exclude it the problem is not there. – Malachiasz Nov 08 '13 at 14:26
@Graeme and Malachiasz please see above... I've added all the code with more explenation – Anaisthitos Nov 08 '13 at 14:36

Graeme · Accepted Answer · 2013-11-08T15:10:07.927

What you want, I think, is a container (LinearLayout or RelativeLayout) which, as you've already discovered, fits between two other views using android:weight="1".

Inside this container you want a ListView and a Button. The Button should sit directly below your list items.

The answer by @Malachiasz is correct, it means that your button will always be below your ListView but now you have encountered the other problem - which is because of the size of the ListView the Button is longer visible because it's doesn't fit inside of your container.

Unfortunately, you cannot achieve the behaviour while the ListView has a parent with a discrete size in its ancestry. Your ListView can either be an discrete size (100dp), a size relative to itself (wrap_contents) or a size relative to it's parent (90%, fill etc).

If you give it an discrete size or a size relative to it's parent, the Button will remain anchored to the bottom of the list (or to the bottom of your container) and will never move upwards or downwards depending on the list items being added. Visually however, this would look fine, it's easy to make it look correct.

If you give the ListView a size relative to itself (wrap_content) then your Button will correctly move upwards or downward depending on the lists contents, however, if the ListView has an ancestor with any height other than wrap_contents you will eventually enter into a position where the ListView will grow bigger than it's container and the button will disapear (you will also be unable to scroll to the last items in your list).

It's up to you to decide which approach to take and what considerations you need to make in order to allow your UI to look reasonable and be functionally correct.

Thanks A lot @Graeme, I will go with the solution of adding footer in ListView... In the same project in iOS i am counting the items and if they are more than that fits i set in code table height... Anyway, Thanks for your time and i appreciate for your help. — Anaisthitos, Nov 08 '13 at 15:16
The ListView footer api is described in this question/answer here: http://stackoverflow.com/a/4265324/726954 - As far as I can see however, you will still have the same problem as your ListView contents will mean your List grows larger than it's container and the footer will also disappear? — Graeme, Nov 08 '13 at 15:50

Limit Height LinearLayout with ListView And Button

2 Answers2