How to make the button fit the same amount of the screen and be in the same place on android app

330 Views Asked by At

I have a basic soundboard app that I am developing for android using eclipse, which has 8 buttons. When I view these on the default 3.7" nexus they are all perfect size and positioning, but when I go use another screen a 4.7" for example the buttons are a lot smaller and aren't where I want them to be, I know that it's something to do with the ratio of the screen size to the size I think. This is my activity_main.xml :

<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:background="@drawable/appbackground" >



<Button
    android:id="@+id/button1"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginLeft="45dp"
    android:layout_marginTop="116dp"
    android:text="@string/button" />

<Button
    android:id="@+id/button2"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignBaseline="@+id/button1"
    android:layout_alignBottom="@+id/button1"
    android:layout_alignParentRight="true"
    android:layout_marginRight="40dp"
    android:text="@string/button2" />

<Button
    android:id="@+id/button3"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignLeft="@+id/button1"
    android:layout_below="@+id/button1"
    android:layout_marginTop="32dp"
    android:text="@string/button3" />

<Button
    android:id="@+id/button4"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignBaseline="@+id/button3"
    android:layout_alignBottom="@+id/button3"
    android:layout_alignRight="@+id/button2"
    android:text="@string/button4" />

<Button
    android:id="@+id/button5"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignLeft="@+id/button3"
    android:layout_below="@+id/button3"
    android:layout_marginTop="29dp"
    android:text="@string/button5" />

<Button
    android:id="@+id/button6"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignBaseline="@+id/button5"
    android:layout_alignBottom="@+id/button5"
    android:layout_alignLeft="@+id/button4"
    android:text="@string/button6" />

<Button
    android:id="@+id/button7"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignLeft="@+id/button5"
    android:layout_below="@+id/button5"
    android:layout_marginTop="30dp"
    android:text="@string/button7" />

<Button
    android:id="@+id/button8"
    android:layout_width="110dp"
    android:layout_height="50dp"
    android:layout_alignBaseline="@+id/button7"
    android:layout_alignBottom="@+id/button7"
    android:layout_alignLeft="@+id/button6"
    android:text="@string/button8" />

</RelativeLayout>

Thanks, any help would be greatly appreciated.

1

There are 1 best solutions below

1
On

this is happening because you're giving your Buttons precise sizes.. I didn't go through your entire XML so I don't know how you're Buttons are set up but try using a combination of embedded LinearLayout with android:layout_weightattribute.

If you're putting them within a grid try using Grid