user5554725
user5554725

Reputation:

Three buttons evenly divided linear layout

So, I am trying to use a linear layout to hold three different buttons, each should take up 33% of the width on one line. This linear layout will be below all the other content in my relative layout, which holds all the other widgets on this activity. Unfortunately, when I add the third button into the layout, the other two have a white bar along the bottom of them and the third button (in this case the home button) is positioned higher than the others.

Can someone explain this behavior and how to rectify it? Thanks.

This is the XML file for the linear layout, I've removed all the text for the other widgets. If that would be helpful, I can post it as well.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true">

    <Button
        android:layout_width="0dp"
        android:layout_weight=".33"
        android:layout_height="wrap_content"
        android:text="@string/adfazsdfasdfadfsagjlfkdlgjklfsadgfjgps"
        android:onClick="resetDates"
        android:background="@drawable/sumbitstyleing"
        android:id="@+id/resetDatesButton" />

    <Button
        android:layout_width="0dp"
        android:layout_weight=".33"
        android:layout_height="wrap_content"
        android:text="@string/home"
        android:onClick="home"
        android:id="@+id/homeButtonSearch"
        android:background="@drawable/generalbutton" />

    <Button
        android:layout_weight=".33"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/submitchanges"
        android:onClick="submitChanges"
        android:background="@drawable/sumbitstyleing"
        android:id="@+id/submitchanges" />

</LinearLayout>

The first picture is WITHOUT the third button, the second picture is WITH the third button.

Without the home button

With the home button

Upvotes: 0

Views: 884

Answers (3)

Riten
Riten

Reputation: 2949

Here you can go this way :

 <?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:background="@color/white"
>
<LinearLayout
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:layout_centerHorizontal="true"/>
    <!--Buttons -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum="3"
        >

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/motor_team_send_sms_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/send_sms"

            />

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/motor_team_sleep_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/sleep"

            />

        <android.support.v7.widget.AppCompatButton
            android:id="@+id/motor_team_rise_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/rise"

            />
    </LinearLayout>

Output is:

enter image description here

This might help you.

Upvotes: 1

Hitesh Sahu
Hitesh Sahu

Reputation: 45052

Try this, I have removed Properties you should use with RelativeLayout and unnecessary with LinearLayout, and buttons aligned horizontally,

    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"

and assigned Weightsum to LinearLayout along with button height to match parents

<?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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:weightSum="1">

        <Button
            android:id="@+id/resetDatesButton"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".33"
            android:onClick="resetDates"
            android:text="Rese check dates" />

        <Button
            android:id="@+id/homeButtonSearch"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".33"
            android:onClick="home"
            android:text="home" />

        <Button
            android:id="@+id/submitchanges"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight=".33"
            android:onClick="submitChanges"
            android:text="submit changes" />

    </LinearLayout>

</RelativeLayout>

Result

enter image description here

Upvotes: 1

Fuyuba
Fuyuba

Reputation: 191

Try this, in your LinearLayout add android:gravity="center"

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:gravity="center">
...
</LinearLayout>

Upvotes: 0

Related Questions