I have a bunch of RelativeLayout inside LinearLayout. Inside this will be ProgressBar and other elements.
The problem at the moment is that the ProgressBar is extending the height dimension of the parent LinearLayout when placed inside the RelativeLayout.
Here's the basics of what I have.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1"
android:weightSum="2">
<RelativeLayout
android:id="#+id/timer1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/darker_gray">
<ProgressBar
android:layout_width="200dp"
android:layout_height="20dp"
style="#android:style/Widget.ProgressBar.Horizontal"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:layout_centerInParent="true"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/timer2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/holo_blue_light"/>
</LinearLayout>
The ProgressBar looks like it is extending height of the parent LinearLayout by the height of the ProgressBar. Which of course is not wanted.
Bare in mind that the above LinearLayout is inside another vertical LinearLayout where weightSum="3". So this distortion of the height means all will not fit in the screen vertically.
The one flaw I may have in my thinking is that because I have not yet completed the code (not put ProgressBar in each of the three levels) that it's just a quirk. I'll do that and report back. But it still seems to me this can't be a good thing.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="1">
<RelativeLayout
android:id="#+id/timer1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/darker_gray">
<ProgressBar
android:layout_width="200dp"
android:layout_height="20dp"
style="#android:style/Widget.ProgressBar.Horizontal"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:layout_centerInParent="true"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/timer2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#android:color/holo_blue_light"/>
</LinearLayout>
when using weights use the width or the height to 0dp which ever orientation u need
Well there you go. After I filled all three levels of the outer LinearLayout (not visible in example code above), the layout seemed to sort itself out.
All height parameters are the same (each taking up one third of the height of the screen) and this is true in both the xml Preview pane and when tested on an emulator.
So it looks to me that if you have a weightSum of 3, then the layout will not balance out until you have actually written the code for all three weight divisions.
For example, this would work:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:wieghtSum="3" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/example_text" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/example_text" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/example_text" />
<LinearLayout/>
But the following would potentially show a distorted height of the text views because the code is incomplete. weightSum is set to 3 but only code for two of the three divisions is written.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:wieghtSum="3" >
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/example_text" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="#string/example_text" />
<LinearLayout/>
I want a layout to be centered vertically when there are few elements in it, see the image to the left. When there are many elements, I want it to grow and become a scroll view that covers the whole screen. See right image.
How can I achieve this?
The red elements are dynamically added to the layout. The two blue TextViews are outside the scrollview. Basically the scrollview kicks in when we have no more space left on the screen.
Try this one.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ff0000"
android:gravity="center"
android:padding="5dp"
android:text="Top TextView"
android:textColor="#fff" />
<!-- You can remove min Height if you don't want it-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00ffff"
android:minHeight="100dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Do you Code here.-->
</ScrollView>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ff0000"
android:gravity="center"
android:padding="5dp"
android:text="Bottom TextView"
android:textColor="#fff" />
</LinearLayout>
I'm currently doing a special xml layout of a landscape screen, where 4 images are present and 2 LinearLayouts are next to each other with 2 images each. These LinearLayouts I call linearLayout1 and linearLayout2.
linearLayout1 is marked with blue rectangle:
linearLayout2 is marked with blue rectangle:
As you can see, the first one uses ~80% of the screen, while the second one uses what's left. I don't want this of course, I want 50% for each. I can't use layout_weight because it's already used in the LinearLayouts themselves (positioning of the two images) and nested weights are bad for performance.
I've tried many different variations, but I simply can't get the two LinearLayouts to have 50% of the screen each. Here's the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/title_container"
style="#style/TitleBar" >
<ImageView
style="#style/TitleBarLogo"
android:contentDescription="#string/imgViewDesc"
android:src="#drawable/title_logo" />
<ImageView
style="#style/TitleBarSeparator"
android:contentDescription="#string/imgViewDesc" />
<TextView style="#style/TitleBarText" />
<ImageButton
style="#style/TitleBarAction"
android:contentDescription="#string/imgViewDesc"
android:onClick="onClickAbout"
android:src="#drawable/title_about" />
</LinearLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title_container"
android:layout_above="#+id/mobFoxView" >
<!-- LEFT COLUMN -->
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/mobFoxView"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/linearLayout2"
android:background="#color/white"
android:gravity="center"
android:orientation="vertical"
android:weightSum="2" >
<ImageView
android:id="#+id/imgNews"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/imgViewDesc"
android:onClick="onClickFeature"
android:src="#drawable/front_news_1" />
<ImageView
android:id="#+id/imgReleases"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/imgViewDesc"
android:onClick="onClickFeature"
android:src="#drawable/front_releases_1" />
</LinearLayout>
<!-- RIGHT COLUMN -->
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_above="#+id/mobFoxView"
android:layout_alignParentRight="true"
android:layout_alignTop="#id/linearLayout1"
android:background="#color/white"
android:gravity="center"
android:orientation="vertical"
android:weightSum="2" >
<ImageView
android:id="#+id/imgArtists"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/imgViewDesc"
android:onClick="onClickFeature"
android:src="#drawable/front_artists_1" />
<ImageView
android:id="#+id/imgLabels"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/imgViewDesc"
android:onClick="onClickFeature"
android:src="#drawable/front_labels_1" />
</LinearLayout>
</RelativeLayout>
<com.mobfox.sdk.MobFoxView
android:id="#+id/mobFoxView"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
mode="test"
publisherId="#string/mobFoxID" />
</RelativeLayout>
Well, there are two options I see available here.
Screw that LINT warning and use the nested weights anyway. Phones are fast and it will make milliseconds worth of a difference since you only inflate layouts once (most of the time). Having nested layouts is only bad for performance because the inflator needs to make more passes to measure the layouts.
Swap your top LinearLayout with a RelativeLayout and align the two children to an invisible View in the center like so:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/top"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/center_point"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent="true"/>
<LinearLayout
android:id="#+id/left_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/center_point">
</LinearLayout>
<LinearLayout
android:id="#+id/right_layout"
android:orientation="horizontal" //default
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignLeft="#+id/center_point">
</LinearLayout>
</RelativeLayout>
You can set "Weight" for the layouts , like this :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
</LinearLayout>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
</LinearLayout>
So each linearlyouts take 50% of the screen. :)
If you're trying to avoid using a feature for its intended purpose you probably should consider if your approach is non-ideal... It seems like you're trying to arrange items into rows and columns. Try using a TableLayout.
Without layout_weight, put both of those linearlayouts into a parent linearlayout
<LinearLayout orientation:horizontal>
<LinearLayout Child 1 />
<LinearLayout Child 2 />
</LinearLayout>
center them using layout_gravity , if the content of those linearlayouts are the same size, they should be the same size
if not, then you could still have a problem
and may need to resize using code
Good Afternoon,
I have a list being generated gradually on the users screen, (right now the list is sitting in a scrollview but that might not be the final resting place.) Above the scrollview are a few buttons, and below the scrollview are a few buttons. Scrollview takes up whole middle of the screen.
Right now, as the list is generated, it goes under the buttons below the scrollview. I would like it however to stop at the top. Also looking for it to always display the last line, rather than the new information start disappearing at the bottom.
I know this is probably confusing so if you have any questions please let me know.
Right now the XML looks a little something like this, and its layed out in this order on the screen too.
<Button
android:text="Ok"
android:id="#+id/buttonOk"
android:layout_height="wrap_content"
android:layout_width="75sp"
android:layout_below="#+id/textHoleNumber"
android:layout_alignParentRight="true"></Button>
<ScrollView <-- ***would like this to line up under the OK button***
android:layout_height="wrap_content"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_below="#+id/buttonMinus">
<TextView
android:id="#+id/textScoreCard"
android:layout_height="wrap_content"
android:text="Score card info goes here"
android:textSize="20sp"
android:layout_width="fill_parent"></TextView>
</ScrollView> <-- ***would like this to stay above linear layout***
<LinearLayout
android:layout_width="fill_parent"
android:id="#+id/linearLayout1"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<Button
android:layout_height="wrap_content"
android:layout_width="0dip"
android:layout_weight="1"
android:id="#+id/buttonSave"
android:text="Save"></Button>
<Button
android:id="#+id/buttonReset"
android:layout_height="wrap_content"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_toRightOf="#+id/buttonSave"
android:layout_alignTop="#+id/buttonSave"
android:layout_alignBottom="#+id/buttonSave"
android:text="Reset"></Button>
</LinearLayout>
Always use Scrollview inside linear layout and give android:layout_weight="1". Try following example it will work..
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:background="#null">
<LinearLayout android:id ="#+id/layout_above_scrollview" android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<ScrollView android:id="#id/android:list" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1">
<LinearLayout android:id ="#+id/layout_above_scrollview" android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
// Your components........
</LinearLayout>
</ScrollView>
<LinearLayout android:id="#+id/add_app_done_layout" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:layout_marginTop="5dp"
android:layout_marginLeft="50dp"
android:orientation="horizontal" android:layout_alignParentBottom="true">
<Button android:id="#+id/add_app_done" android:text="Done"
android:layout_width="100dp"
android:textStyle="bold" android:layout_height="wrap_content" />
<Button android:id="#+id/add_app_revert" android:text="Revert"
android:layout_width="100dp" android:layout_marginLeft="5dp"
android:textStyle="bold" android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
If you're talking about what I think you are, try adding a margin to the bottom of the scrollview, and a negative margin to the top of the linear layout. For instance:
<ScrollView android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="60sp">
<LinearLayout android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</LinearLayout>
</ScrollView>
<LinearLayout android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="-60sp">
</LinearLayout>
As for scrolling to the bottom of the scrollview when a new item is added, look at How to scroll to bottom in a ScrollView on activity startup.
Note: This is assuming you have your ScrollView and the LinearLayout beneath it all contained in a vertical LinearLayout.
Here's my layout code;
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:text="#string/welcome"
android:id="#+id/TextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
<LinearLayout android:id="#+id/LinearLayout"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom">
<EditText android:id="#+id/EditText"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</EditText>
<Button android:text="#string/label_submit_button"
android:id="#+id/Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</Button>
</LinearLayout>
</LinearLayout>
What this looks like is on the left and what I want it to look like is on the right.
The obvious answer is to set the TextView to fill_parent on height, but this causes no room to be left for the button or entry field.
Essentially the issue is that I want the submit button and the text entry to be a fixed height at the bottom and the text view to fill the rest of the space. Similarly, in the horizontal linear layout I want the submit button to wrap its content and for the text entry to fill the rest of the space.
If the first item in a linear layout is told to fill_parent it does exactly that, leaving no room for other items. How do I get an item which is first in a linear layout to fill all space apart from the minimum required by the rest of the items in the layout?
Relative layouts were indeed the answer:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:text="#string/welcome"
android:id="#+id/TextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
</TextView>
<RelativeLayout
android:id="#+id/InnerRelativeLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<Button
android:text="#string/label_submit_button"
android:id="#+id/Button"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</Button>
<EditText
android:id="#+id/EditText"
android:layout_width="fill_parent"
android:layout_toLeftOf="#id/Button"
android:layout_height="wrap_content">
</EditText>
</RelativeLayout>
</RelativeLayout>
The modern way to do this is to have a ConstraintLayout and constrain the bottom of the view to the bottom of the ConstraintLayout with app:layout_constraintBottom_toBottomOf="parent"
The example below creates a FloatingActionButton that will be aligned to the end and the bottom of the screen.
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent">
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
For reference, I will keep my old answer.
Before the introduction of ConstraintLayout the answer was a relative layout.
If you have a relative layout that fills the whole screen you should be able to use android:layout_alignParentBottom to move the button to the bottom of the screen.
If your views at the bottom are not shown in a relative layout then maybe the layout above it takes all the space. In this case you can put the view, that should be at the bottom, first in your layout file and position the rest of the layout above the views with android:layout_above. This enables the bottom view to take as much space as it needs, and the rest of the layout can fill all the rest of the screen.
In a ScrollView this doesn't work, as the RelativeLayout would then overlap whatever is in the ScrollView at the bottom of the page.
I fixed it using a dynamically stretching FrameLayout :
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fillViewport="true">
<LinearLayout
android:id="#+id/LinearLayout01"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical">
<!-- content goes here -->
<!-- stretching frame layout, using layout_weight -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</FrameLayout>
<!-- content fixated to the bottom of the screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<!-- your bottom content -->
</LinearLayout>
</LinearLayout>
</ScrollView>
You can keep your initial linear layout by nesting the relative layout within the linear layout:
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:text="welcome"
android:id="#+id/TextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TextView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button android:text="submit"
android:id="#+id/Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true">
</Button>
<EditText android:id="#+id/EditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#id/Button"
android:layout_alignParentBottom="true">
</EditText>
</RelativeLayout>
</LinearLayout>
The answer above (by Janusz) is quite correct, but I personnally don't feel 100% confortable with RelativeLayouts, so I prefer to introduce a 'filler', empty TextView, like this:
<!-- filler -->
<TextView android:layout_height="0dip"
android:layout_width="fill_parent"
android:layout_weight="1" />
before the element that should be at the bottom of the screen.
You can do this with a LinearLayout or a ScrollView, too. Sometimes it is easier to implement than a RelativeLayout. The only thing you need to do is to add the following view before the Views you want to align to the bottom of the screen:
<View
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1" />
This creates an empty view, filling the empty space and pushing the next views to the bottom of the screen.
1. Use ConstraintLayout in your root Layout
And set app:layout_constraintBottom_toBottomOf="parent" to let the Layout on the bottom of the screen:
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent">
</LinearLayout>
2. Use FrameLayout in your root Layout
Just set android:layout_gravity="bottom" in your layout
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal">
</LinearLayout>
3. Use LinearLayout in your root Layout (android:orientation="vertical")
(1) Set a layout android:layout_weight="1" on the top of the your Layout
<TextView
android:id="#+id/TextView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="welcome" />
(2) Set the child LinearLayout for android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="bottom"
The main attribute is ndroid:gravity="bottom", let the child View on the bottom of Layout.
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
android:orientation="horizontal">
</LinearLayout>
4. Use RelativeLayout in the root Layout
And set android:layout_alignParentBottom="true" to let the Layout on the bottom of the screen
<LinearLayout
android:id="#+id/LinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
</LinearLayout>
Output
This also works.
<LinearLayout
android:id="#+id/linearLayout4"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_below="#+id/linearLayout3"
android:layout_centerHorizontal="true"
android:orientation="horizontal"
android:gravity="bottom"
android:layout_alignParentBottom="true"
android:layout_marginTop="20dp"
>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
/>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
/>
</LinearLayout>
Following up on Timores's elegant solution, I have found that the following creates a vertical fill in a vertical LinearLayout and a horizontal fill in a horizontal LinearLayout:
<Space
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
You don't even need to nest the second relative layout inside the first one. Simply use the android:layout_alignParentBottom="true" in the Button and EditText.
If you don't wish to make many changes, then you could just put:
android:layout_weight="1"
for the TextView having ID as #+id/TextView i.e
<TextView android:text="#string/welcome"
android:id="#+id/TextView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
</TextView>
Creating both header and footer, here is an example:
Layout XML
<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:background="#color/backgroundcolor"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="40dp"
android:background="#FF0000">
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:background="#FFFF00">
</RelativeLayout>
</RelativeLayout>
Screenshot
For a case like this, always use RelativeLayouts. A LinearLayout is not intended for such a usage.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/db1_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- Place your layout here -->
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:paddingLeft="20dp"
android:paddingRight="20dp" >
<Button
android:id="#+id/setup_macroSavebtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Save" />
<Button
android:id="#+id/setup_macroCancelbtn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel" />
</LinearLayout>
</RelativeLayout>
Use the below code. Align the button to buttom. It's working.
<?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="match_parent"
android:orientation="vertical" >
<Button
android:id="#+id/btn_back"
android:layout_width="100dp"
android:layout_height="80dp"
android:text="Back" />
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.97"
android:gravity="center"
android:text="Payment Page" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Submit"/>
</LinearLayout>
</LinearLayout>
Use android:layout_alignParentBottom="true" in your <RelativeLayout>.
This will definitely help.
In case you have a hierarchy like this:
<ScrollView>
|-- <RelativeLayout>
|-- <LinearLayout>
First, apply android:fillViewport="true" to the ScrollView and then apply android:layout_alignParentBottom="true" to the LinearLayout.
This worked for me perfectly.
<ScrollView
android:layout_height="match_parent"
android:layout_width="match_parent"
android:scrollbars="none"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:id="#+id/linearLayoutHorizontal"
android:layout_alignParentBottom="true">
</LinearLayout>
</RelativeLayout>
</ScrollView>
You can just give your top child view (the TextView #+id/TextView) an attribute:
android:layout_weight="1".
This will force all other elements below it to the bottom.
This can be done with a linear layout too.
Just provide Height = 0dp and weight = 1 to the layout above and the one you want in the bottom. Just write height = wrap content and no weight.
It provides wrap content for the layout (the one that contains your edit text and button) and then the one that has weight occupies the rest of the layout.
I discovered this by accident.
I used the solution Janusz posted, but I added padding to the last View since the top part of my layout was a ScrollView.
The ScrollView will be partly hidden as it grows with content. Using android:paddingBottom on the last View helps show all the content in the ScrollView.