Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to make buttons of the same size

this is my xml, and this is the result, but would like the 3 buttons above (together) occupy the same size of the largest button, something like that image, where should I change my layout?

This is what I have:

this is the result

And this is what I want:

but I would like to stay so

My xml:

<?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:background="@android:color/transparent"
              android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="#FFA500"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="10dp"
            android:background="#FFA500"
            android:orientation="vertical">

            <TextView
                android:id="@+id/textoPoup1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:text="1. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
                android:textColor="@android:color/white"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <Button
                    android:id="@+id/nota0"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="0"/>

                <Button
                    android:id="@+id/nota40"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="50"/>

                <Button
                    android:id="@+id/nota80"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="90"/>
            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <Button
                    android:id="@+id/nota120"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="110"/>

                <Button
                    android:id="@+id/nota160"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="170"/>

                <Button
                    android:id="@+id/nota200"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="300"/>
            </LinearLayout>

            <Button
                android:id="@+id/proxima1"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Next"/>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
like image 537
Matheus Ariel Avatar asked Dec 05 '22 17:12

Matheus Ariel


1 Answers

This can be done easily using layout_weight for each of the buttons like this:

<Button
        android:id="@+id/nota0"
        android:layout_width="0"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="0"/>

This way, each button will take exactly 1/3 of the width of it's parent, which takes up the whole screen width. You can still play with the margins and the padding to make the spacing between the buttons as you wish.

Edit

You can do the same thing with ConstraintLayout much more easily without nesting, using chains and applying horizontal or vertical weights like app:layout_constraintHorizontal_weight="1"

like image 181
Vucko Avatar answered Dec 08 '22 07:12

Vucko