Make all buttons have the same dimensions

Question

I am trying to make a layout with three buttons in the middle. I'm going to add 2 more buttons on the right corner later on, but for now I'm trying to make it work with these 3.

This is what I had in mind:

And in some way it should similar in every screen size (so the buttons become smaller as the screen size became smaller).

Now this is what I have:

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

<Button
    android:id="@+id/multiplay"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@drawable/menubutton"
    android:text="@string/multiplayer" />

<Button
    android:id="@+id/options"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/multiplay"
    android:layout_below="@+id/multiplay"
    android:background="@drawable/menubutton"
    android:text="@string/options" />

<Button
    android:id="@+id/singleplay"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/multiplay"
    android:layout_alignLeft="@+id/multiplay"
    android:background="@drawable/menubutton"
    android:text="@string/singleplayer"
 />

It looks fine on a big screen, but on a smaller this happens:

I have googled around, and most pages suggest using "weight", but apparently that only works for linear layout.Any suggestions?

Thanks

Answer 1

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:orientation="vertical" >

        <Button
            android:id="@+id/multiplay"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/menubutton"
            android:text="@string/multiplayer" />

        <Button
            android:id="@+id/options"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/menubutton"
            android:text="@string/options" />

        <Button
            android:id="@+id/singleplay"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/menubutton"
            android:text="@string/singleplayer" />
    </LinearLayout>

</RelativeLayout>

Answer 2

You should use weight, this way you can evenly devide the buttons on the screen no matter what screensize.

Here an example of a LinearLayour inside the RelativeLayout. (if nothing else is in the RelativeLayout you can replace the RelativeLayout with the LinearLayout)

You should play with it a little so it matches your requirements.

<?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="match_parent"
android:orientation="vertical"
android:weightSum="3" >

<Button
    android:id="@+id/multiplay"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:layout_centerHorizontal="true"
    android:background="@drawable/menubutton"
    android:text="@string/multiplayer" />

<Button
    android:id="@+id/options"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:layout_centerHorizontal="true"
    android:background="@drawable/menubutton"
    android:text="@string/options" />

<Button
    android:id="@+id/singleplay"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:layout_centerHorizontal="true"
    android:background="@drawable/menubutton"
    android:text="@string/singleplayer"
 />

    </LinearLayout>

</RelativeLayout>