Develop Reference

Fill with Layout until next layout (at bottom)

So, I have a header, and then a CardView that should fill the screen until the footer. Problem is, it fills all the screen, and the footer goes "under" the screen, as you can see in the images.
I want to keep the footer (button + the two images) always at the bottom and the cardview should always fill the rest of the screen. There is a scrollview in the cardview that will allow text to be read in the cardview.
Anyway, here is the XML code:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/grey_10">
<View
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#color/colorPrimary" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:layout_marginBottom="#dimen/spacing_mlarge"
android:orientation="vertical"
android:padding="#dimen/spacing_mlarge">
<TextView
android:id="#+id/qstView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_marginBottom="20dp"
android:text="Insert question text here"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Large"
android:textColor="#color/white" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="#dimen/spacing_middle"
android:layout_marginEnd="#dimen/spacing_middle"
android:layout_marginLeft="#dimen/spacing_middle"
android:layout_marginRight="#dimen/spacing_middle"
android:layout_marginStart="#dimen/spacing_middle"
android:layout_marginTop="#dimen/spacing_middle"
android:visibility="visible"
app:cardCornerRadius="6dp"
app:cardElevation="5dp">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/checkbox_full_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:orientation="vertical">
</LinearLayout>
</LinearLayout>
</ScrollView>
</android.support.v7.widget.CardView>
</LinearLayout>
<Button
android:id="#+id/add_field_button"
android:layout_width="match_parent"
android:layout_height="55dp"
android:onClick="onAddAnswer"
android:layout_gravity="bottom"
android:layout_marginLeft="-4dp"
android:layout_marginRight="-4dp"
android:background="#drawable/btn_rounded_primary"
android:text="Suivant"
android:textAllCaps="false"
android:textColor="#android:color/white"
android:textStyle="bold" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="#dimen/spacing_mlarge"
android:layout_gravity="center_horizontal"
android:gravity="center">
<ImageView
android:layout_width="80dp"
android:layout_height="60dp"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="#dimen/spacing_mlarge"
android:layout_marginTop="#dimen/spacing_large"
android:src="#drawable/ineedhelp"/>
<View
android:layout_width="#dimen/spacing_large"
android:layout_height="0dp" />
<ImageView
android:layout_width="80dp"
android:layout_height="60dp"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="#dimen/spacing_mlarge"
android:layout_marginTop="#dimen/spacing_large"
android:src="#drawable/mbtouch_dark"/>
</LinearLayout>
<View
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginBottom="#dimen/spacing_middle"
android:layout_alignParentBottom="true"/>
</LinearLayout>
</RelativeLayout>
This is what I have at the moment:
And this is what I would like to have (here I forced dimensions, but since not all devices are the same, the space will not be used optimally).
Thanks in advance!

Try to arrange your view like the manner below (For CardView and bottom layout, rest things will stay as they were)..
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
....
...>
<!-- Since, weight is 1 it will occupy whole space subtracting height of bottom -->
<CardView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
.... />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
....>
<!-- Put your bottom widgets over here -->
</LinearLayout>
</LinearLayout>

Put Button at bottom of scrollview or bottom of screen

I have a problem with layout of my Application.
I'm trying to do a layout like Trello (screen of trello layout for example get from google)
But I have a problem with the Button at the Bottom of ScrollView:
Now my app is something like:
So How you can see, the button I always at the bottom of display.
I would like create a Header section, body section with Scrollview and recycler view and Footer with action button.
For now my xml app is:
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/card_view"
android:layout_width="320dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/header_title"
style="#style/card_header_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:text="title"
/>
<TextView
android:id="#+id/header_subtitle"
style="#style/card_header_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/header_title"
android:text="subtitle" />
<ImageButton
android:id="#+id/context_menu"
android:layout_width="80dp"
android:layout_height="24dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_gravity="right"
android:background="#android:color/transparent"
android:clickable="true"
android:src="#drawable/ic_more_vert_black_16dp"
/>
</RelativeLayout>
<android.support.v4.widget.NestedScrollView
android:layout_below="#+id/header"
android:layout_above="#+id/button_action"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/header"
/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="#string/button_action"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
The parent Layout that contain a "list of block" is
<HorizontalScrollView
android:id="#+id/horizontalScrollFather"
android:orientation="horizontal"
android:fillViewport="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:descendantFocusability="blocksDescendants"
android:orientation="horizontal"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list_blocks"
android:layout_width="wrap_content"
android:layout_height="match_parent"
/>
</RelativeLayout>
</HorizontalScrollView>
EDIT
I have tried to make a modify to my xml with:
<android.support.v4.widget.NestedScrollView
android:id="#+id/myNestedScrollView"
android:layout_below="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_below="#+id/myNestedScrollView" <!-- as suggested -->
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/button_action"
/>
But the problem now is the scrollview with recycler hides the Button:
How Can I replicate the layout ?

Use this code
<android.support.v4.widget.NestedScrollView
android:id="#+id/myNestedScrollView"
android:layout_below="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/button_action"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/myNestedScrollView"
android:text="#string/button_action"/>
Changes
Don't do alignParentBottom on Button and don't put NestedScrollView above Button instead put Button below NestedScrollView
And there is no need to use android:layout_below="#id/header" in RecyclerView

How to put buttons below scrollview and always show button without being overlapped by scrollview in Android?

My layout is like this
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/nextChar_btn" />
</LinearLayout>
</LinearLayout>
However, when there are little or no text, the buttons are pulled up, when there are too many text in search_results TextView, the buttons won't show up because scrollview takes the space all the way to the bottom. Any suggestion to always keep the buttons at the bottom and always visible?

First of all you have to set the ScrollView's height to 0dp.
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="0dp">
<TextView
android:id="#+id/search_results"
android:textSize="#dimen/text_font_size"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
You have to do this because the weight param is going to control the size of the view depending on how much space is available. If you set it to wrap content, it will take how much space it needs to wrap everything within.
Then you need to remove your LinearLayout's weight param:
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
And the reason for doing that is just the opposite of the previous explanation: in this case the wrap content is going to take the space necessary to always display the buttons within.

Here is some sample code I put together for you. You basically need to take out the linear layout you have wrapping you xml layout and use a relative layout instead. Once you do that you can add ids to the linear layout with the buttons and then have the edit text align to the parent top. Then you can put the scrollview below the edittext and then put the scrollview above to the linear layout containing the buttons. This should work!
<?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"
tools:context="com.example.thegamefan93.loginregister.LoginActivity">
<EditText
android:id="#+id/searchKey"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:hint="xx" />
<ScrollView
android:layout_weight="1"
android:fillViewport="true"
android:layout_below="#id/searchKey"
android:layout_width="match_parent"
android:layout_above="#+id/LL1"
android:layout_height="wrap_content">
<TextView
android:id="#+id/search_results"
android:textSize="20sp"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_gravity="center|bottom"
android:layout_weight="1"
android:id="#+id/LL1"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/lastCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last_Char" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="next_char" />
</LinearLayout>
</RelativeLayout>

Try 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"
android:orientation="vertical">
<EditText
android:id="#+id/searchKey"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="xx" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/linear"
android:layout_below="#+id/searchKey"
android:layout_weight="1"
android:fillViewport="true">
<TextView
android:id="#+id/search_results"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:textSize="#dimen/text_font_size" />
</ScrollView>
<LinearLayout
android:id="#+id/linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/lastCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/lastChar_btn" />
<Button
android:id="#+id/nextCharacterButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/nextChar_btn" />
</LinearLayout>
</RelativeLayout>

layout_weight working in simulator, not on device

I have a linear layout with two listviews, a text view, and another linear layout to hold some buttons. I want the second listview to be twice the height of the first. I have set the height of both list views to 0dp and gave the first a layout_weight of 1 and the second a weight of 2, and then set the weightSum of the containing view to 3. Here is the actual layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:weightSum="3"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/categoryList" />
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:id="#+id/itemList" />
<TextView
android:id="#+id/walletStr"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/cancelBtn"
android:text="cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="#+id/buyBtn"
android:text="buy"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
On the simulator, this produces the desired effect, but on the actual device almost all of the space goes to the top listview.
Any ideas? Thanks in advance.

linear layout not have only 2 list, also have more component and you have to consider.
The weightSum should be divided all component of this linear layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:weightSum="7"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:id="#+id/categoryList" />
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:id="#+id/itemList" />
<TextView
android:id="#+id/walletStr"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.5">
<Button
android:id="#+id/cancelBtn"
android:text="cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="#+id/buyBtn"
android:text="buy"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>

ListView rows disappear when adding a RelativeLayout below a ListView

Here's a simplified version of the portrait UI I want from my layout:
It's a ListView above another layout.
The complication is that I want the whole bottom layout (in this case 'Button2') to be visible when lots of lines get added to the EditText:
I've been trying to achieve this by nesting a RelativeLayout inside a LinearLayout. Unfortunately, the ListView disappears when I get the effect I want with the EditText, e.g.
I've tried loads of alternatives, but nothing seems to achieve both goals.
Here's my XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<FrameLayout
android:id="#+id/AAA"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</FrameLayout>
<LinearLayout
android:id="#+id/BBB"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/AAA"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/list_container"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:entries="#array/list_items"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/input_parent"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_above="#+id/bottom_layout"
android:layout_width="100dip"
android:layout_height="50dip"
android:clickable="true"
android:text="Button1" />
<EditText
android:id="#+id/edittext"
android:layout_above="#+id/bottom_layout"
android:layout_toRightOf="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="50dip"
android:imeOptions="flagNoExtractUi"
android:inputType="textMultiLine"
android:maxLines="8"
android:scrollbars="vertical" />
<!-- Align this with the bottom so when the input text area gets
really big it doesn't push this section off screen -->
<LinearLayout
android:id="#+id/bottom_layout"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="150dip"
android:layout_gravity="bottom"
android:clickable="true"
android:text="Button2" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
If I remove the android:layout_alignParentBottom="true" from the bottom_layout then the ListView contents appears, but then I lose the effect I want with the EditText.
Can anybody help? I need to support OS 2.2+.

Simplifying the layout a bit like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<FrameLayout
android:id="#+id/AAA"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</FrameLayout>
<RelativeLayout
android:id="#+id/BBB"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/AAA"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_above="#+id/edittext"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:entries="#array/list_items"/>
<Button
android:id="#+id/button1"
android:layout_above="#+id/bottom_layout"
android:layout_width="100dip"
android:layout_height="50dip"
android:clickable="true"
android:text="Button1" />
<EditText
android:id="#+id/edittext"
android:layout_above="#+id/bottom_layout"
android:layout_toRightOf="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="50dip"
android:imeOptions="flagNoExtractUi"
android:inputType="textMultiLine"
android:maxLines="8"
android:scrollbars="vertical" />
<!-- Align this with the bottom so when the input text area gets
really big it doesn't push this section off screen -->
<LinearLayout
android:id="#+id/bottom_layout"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="150dip"
android:layout_gravity="bottom"
android:clickable="true"
android:text="Button2" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
seems to give the result you were describing.