How to use layout buttons for screen sizes with different aspect ratios

Question

I am trying to lay buttons on top of an image that is used as the background for multiple devices / screen sizes. If I define a button in relativeLayout for a device with a 9:16 aspect ratio (for example, Galaxy Nexus or Nexus 5), so that the button is aligned with a specific spot in the image, then it does not correspond to the same image on the device with an aspect ratio of 3: 5 (e.g. Nexus S). In my relative layout, the first button is left and bottom aligned with the offset (for example, android: layout_marginLeft = "32dp" and android: layout_marginBottom = "150dp). All other buttons are aligned with this button.

I spent days trying to figure this out through experimentation and searching for textbooks, but nothing works.

The following image is for the Nexus 5. As you can see, the buttons align with the background:

The following image is for the Nexus S. As you can see, the buttons are offset from the background

EDIT: I obviously lack some key concept. I have separate directories for each screen density hdpi, xhdpi and xxhdpi. But, based on my two attached images, it seems that I need to have a separate layout for screens with sizes of 480x800 versus 720x1280 and 1080x1920. It seems that the 720x1280 screen should have the same layout as the 1080x1920 screen, because the Nexus 5 and Galaxy Nexus have the same result (that is, as seen in the first image). To create a separate layout, I tried using layout, layout, layout, etc. (This is an outdated approach), as well as layout-sw480dp and layout-sw720dp. Then, the layout_marginLeft and layout_margin_bottom of the first button are adjusted to the appropriate screen size. None of these approaches work.

Here is the current contents of my layout for the first image:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:paddingLeft="15dp"
    android:paddingBottom="5dp"
    tools:context="com.myCompany.myApp.MainActivity"
    android:background="@drawable/android_home_screen">

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 1"
    android:id="@+id/channel1"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:textColor="#FFFFFF"
    android:layout_marginBottom="145dp"
    android:layout_marginLeft="17dp"
    android:lines="2" />

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 3"
    android:id="@+id/channel3"
    android:textColor="#FFFFFF"
    android:layout_marginLeft="0dp"
    android:layout_toRightOf="@+id/channel1"
    android:layout_alignTop="@+id/channel1"
    android:lines="2" />

<Button
    style="?android:attr/buttonStyleSmall"
    android:layout_width="90dp"
    android:layout_height="wrap_content"
    android:text="Channel 5"
    android:id="@+id/channel5"
    android:textColor="#FFFFFF"
    android:layout_marginLeft="0dp"
    android:layout_toRightOf="@+id/channel3"
    android:layout_alignTop="@+id/channel3"
    android:lines="2" />

...

</RelativeLayout>

, , / / . , , , 480x800 720x1280.

. . hdpi, xhdpi xxhdpi . hdpi 480x693 , xhdpi - 720x1040 , xxhdpi - 1080x1559 213,34 ppi, 320 ppi 480 ppi. ( ) .

Answer 1

, ,

   <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#ababab" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_margin="10dp"
        android:background="#fff"
        android:orientation="vertical"
        android:padding="10dp" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:weightSum="3" >

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:orientation="horizontal"
            android:weightSum="1" >

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".1" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".4" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".4" />

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight=".1" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>