There are millions of questions and answers in related to "layout_gravity Bottom/Top in LinearLayout" on stack overflow but I still haven't solved my problem.
I want to place my EditText which says "Please place me at the very top" at the very top, and TextView which says "Please place me at very bottom" at the very bottom. My dream is very basic but I cannot achieve it!!
Can anyone help me?
This is my XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="210dp"
android:background="#android:color/holo_green_light"
android:gravity="center_vertical"
android:orientation="vertical"
android:weightSum="1">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="textPersonName"
android:text="Please place me at very top" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#android:color/background_light"
android:text="TextView"
android:layout_weight="0.19" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="248dp"
android:layout_weight="0.70"
android:background="#color/colorAccent"
android:gravity="center_vertical"
android:orientation="vertical"
android:weightSum="1">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="62dp"
android:layout_gravity="top"
android:text="Button" />
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.16"
android:background="#android:color/background_light"
android:text="Please place me at very bottom" />
</LinearLayout>
</LinearLayout>
And this is my output:
If LinearLayout isn't working, then don't force yourself to use it.
Nested LinearLayouts and weights are bad for performance.
RelativeLayout (or ConstraintLayout) are naturally meant to place things at the anchor points of ViewGroups
I assume you want the text and button centered based on your other attributes
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="2">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/holo_green_light"
android:layout_weight="1">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:layout_alignParentTop="true"
android:inputType="textPersonName"
android:text="Please place me at very top" />
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#android:color/background_light"
android:text="TextView" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#android:color/holo_red_light"
android:orientation="vertical">
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="62dp"
android:layout_centerInParent="true"
android:text="Button"/>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#android:color/background_light"
android:text="Please place me at very bottom"/>
</RelativeLayout>
</LinearLayout>
Alternatively, you only need android:gravity="bottom" on the second LinearLayout, then all views within are at the bottom.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1">
<!-- Top Gravity -->
<LinearLayout
android:gravity="top"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/holo_green_light"
android:orientation="vertical"
android:layout_weight="0.5">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Please place me at very top"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/background_light"
android:text="TextView"/>
</LinearLayout>
<!-- Bottom Gravity -->
<LinearLayout
android:gravity="bottom"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.50"
android:background="#android:color/holo_red_light"
android:orientation="vertical">
<Button
android:layout_width="match_parent"
android:layout_height="62dp"
android:text="Button"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/background_light"
android:text="Please place me at very bottom"/>
</LinearLayout>
</LinearLayout>
You have set gravity bottom for your second linear layout to place the views at the bottom.
change this line at first LinearLayout:
android:gravity="center_vertical"
To:
android:gravity="top"
change this line at Second LinearLayout:
android:gravity="center_vertical"
To:
android:gravity="bottom"
Note: Avoid using nested weights it will slow down the performance.
Related
Based on this layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lytContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical">
<Button
android:id="#+id/scanButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/scan" />
<TextView
android:id="#+id/authorship"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:text="" />
</LinearLayout>
I'd like to keep the Scan Button centered horizontally keeping the screen ratio, so it's always kept in the middle of the screen.
Next, I'd like to have the TextView centered on the bottom of the screen and centered too, like this:
Seems like the property and value of android:gravity="center_vertical|center_horizontal" I have on the LinearLayout is stopping me from having it so, but I have no idea how to proceed.
Here the code snippet here I hope this work for you as per your need...
<LinearLayout 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_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:weightSum="1"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_gravity="center_vertical"
android:gravity="center"
android:layout_weight="1"
android:orientation="vertical"
android:layout_height="wrap_content">
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
app:cornerRadius="10dp"
android:paddingHorizontal="10dp"
android:textSize="16sp"
android:text="Scan Product"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Hello World!"
android:gravity="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
</LinearLayout>
Following the Udacity Android for Beginners course, I want to add an audio icon button to a list_item view. Now the list_item.xml has a parent Horizontal Linear Layout and a nested Vertical Linear Layout. The course instructor added the audio icon by changing to a Relative Layout but i want to see how I could do this with a Linear Layout.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/tan_background"
android:minHeight="#dimen/list_item_height"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="#dimen/list_item_height"
android:layout_height="#dimen/list_item_height"/>
<LinearLayout
android:id="#+id/text_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="16dp">
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="bottom"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="#android:color/white"
android:textStyle="bold"
tools:text=""/>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:textColor="#android:color/white"
tools:text=""/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/baseline_play_arrow_white_24"/>
</LinearLayout>
My problem now is that when i add any element after the nested Vertical Linear Layout, nothing will show. I'm trying different things but I just can't understand. All i can think of is that this is the cause:
android:layout_width:"match_parent"
Please let me know how i can add the audio icon to the right and in the center while keeping this a LinearLayout.
This is the output i am trying to achieve
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:background="#color/apptool"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="match_parent"
android:src="#android:drawable/btn_star"
android:tint="#color/black"
android:background="#ebed54"
android:layout_weight=".1"/>
<LinearLayout
android:id="#+id/text_container"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/colorPrimary"
android:layout_weight=".3"
android:paddingLeft="16dp">
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="bottom"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="#android:color/white"
android:textStyle="bold"
tools:text="sdfdsfdsf"/>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:textColor="#android:color/white"
tools:text="sdfdsfdsf"/>
</LinearLayout>
<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".1"
android:background="#color/colorPrimary"
android:src="#android:drawable/ic_media_play"/>
</LinearLayout>
</LinearLayout>
output
You make width of linear layout match_parent so it consumes all remain place so you need to first change match_parent to wrap_content like below :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/tan_background"
android:minHeight="#dimen/list_item_height"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView"
android:layout_width="#dimen/list_item_height"
android:layout_height="#dimen/list_item_height"/>
<LinearLayout
android:id="#+id/text_container"
android:layout_width="wrap_conten"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="16dp">
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="bottom"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="#android:color/white"
android:textStyle="bold"
tools:text=""/>
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="top"
android:textColor="#android:color/white"
tools:text=""/>
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/baseline_play_arrow_white_24"/>
</LinearLayout>
I have the following layout consisting of several text boxes which I want to scroll as one object. I then have a linear layout below that which contains navigation buttons - I want this to stick to the bottom of the screen and not scroll.
Right now the bottom linear layout is pushed off the screen - I suspect because of the setting of the height of the scroll view. However I can't see the trick to resolve this. How can I make it so that the buttons in the linear view are always visible and stick to the bottom of the screen (not the bottom of the scrollview)?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingLeft="8dp"
android:paddingRight="8dp"
tools:context="com.QuestionView">
<android.support.v7.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<ScrollView
android:id="#+id/ScrollView"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:scrollbars="horizontal">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:orientation="vertical">
<TextView
android:id="#+id/questionText"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerA"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerB"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerC"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerD"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Back" />
<Button
android:id="#+id/flip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#1a75ff"
android:text="Flip" />
<Button
android:id="#+id/next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Next" />
</LinearLayout>
</LinearLayout>
Use a RelativeLayout for the outer layout. Define the Linear layout with buttons to be layout_alignParentBottom. Make the ScrollView layout_above the button layout and layout_below the toolbar (which should be alignParentTop). Then the buttons will be on the bottom, the toolbar on top, and the scroll view between them.
Best way to do this is to use android.support.design.widget.CoordinatorLayout to get Button Layout at bottom use android:layout_gravity="bottom" like below
Step 1:
Add compile 'com.android.support:design:26.1.0'
step 2:
<android.support.design.widget.CoordinatorLayout
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.QuestionView">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/questionText"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerA"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerB"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerC"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
<TextView
android:id="#+id/answerD"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scrollbars="vertical"
android:text="TextView"
android:textSize="24dp" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Back" />
<Button
android:id="#+id/flip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#1a75ff"
android:text="Flip" />
<Button
android:id="#+id/next"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:backgroundTint="#ff9933"
android:text="Next" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
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>
I'm creating a login dialog on Android where I want two buttons to align horizontally both on the top and bottom edge, irregardless of the screen size. Sometimes "Forgot password" will break over two lines, sometimes not. I do not want to impose a minHeight on the buttons, and would prefer a solution based on XML design only (not code).
Landscape is fine:
Portrait, default implementation leaves the login button shorter than "forgot password"
One solution I tried was setting match_parent for the layout_height param of the first button. Didn't quite work:
XML:
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp"
>
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/login"
android:textSize="18sp"
android:id="#+id/dialog_login_button_login"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/forgotPassword"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password"
/>
</LinearLayout>
Use RelativeLayout and make "Login" button to align to the top and bottom of "Forgot Password" Button
As #manjusg answered, make the Login button align the bottom and top to the other button.
Here is how I did it:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp">
<View
android:id="#+id/center_strut"
android:layout_height="0dp"
android:layout_width="0dp"
android:layout_centerInParent="true" />
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:text="Login"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/center_strut"
android:layout_alignBottom="#+id/dialog_login_button_forgot_password"
android:layout_alignTop="#+id/dialog_login_button_forgot_password"
android:id="#+id/dialog_login_button_login" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignLeft="#+id/center_strut"
android:text="Forgot Password"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password" />
</RelativeLayout>
</LinearLayout>
replace your xml with this xml
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp"
android:weightSum="2"
>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/login"
android:textSize="18sp"
android:id="#+id/dialog_login_button_login"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/forgotPassword"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
</LinearLayout>
check this
<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"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout">
<Button
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Login"
android:id="#+id/button"/>
<Button
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="FORGOT PASSWORD"
android:id="#+id/button2"/>
</LinearLayout>
<LinearLayout
android:layout_alignBottom="#+id/linearLayout"
android:layout_width="wrap_content"
android:layout_centerInParent="true"
android:paddingTop="6dp"
android:paddingBottom="6dp"
android:layout_height="wrap_content">
<View
android:layout_width="0.5dp"
android:layout_height="wrap_content"
android:background="#000000"/>
</LinearLayout>
</RelativeLayout>