Reputation: 1362
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
Upvotes: 0
Views: 65
Reputation: 245
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>
Upvotes: 1
Reputation: 24853
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>
Upvotes: 1