Search code examples
androidandroid-layoutscreen-size

How can I place objects in my view based on the actual screen size in Android?


Suppose I have a background in my Activity's root layout. I wish to place some buttons on the screen which always stay in the same place relative to the screen. How can I accomplish that?

I tried using dp and sp but if I test the layout in another screen it all falls apart. (So if it is OK in WVGA it is not working in QVGA. Am I doing something wrong?

This is my layout xml:

<?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="@drawable/menu_activity_bg" >
        <Button
            android:id="@+id/continueButton"
            android:layout_width="110sp"
            android:layout_height="30sp"
            android:layout_marginLeft="100sp"
            android:layout_marginTop="180sp"
            android:background="@drawable/menu_activity_continue" />
        <Button
            android:id="@+id/newGameButton"
            android:layout_width="130sp"
            android:layout_height="35dp"
            android:layout_marginLeft="90sp"
            android:layout_marginTop="220sp"
            android:background="@drawable/menu_activity_new_game" />
            <!-- ... -->
    </RelativeLayout>

Solution

  • My solution to this is to have a number of style types, which I place in the values-large, values-small, values-normal, and values-xlarge folders. A typical entry will look like this:

    <resources>
    <style name="bigText">
        <item name="android:textSize">60dp</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_marginTop">5dp</item>
        <item name="android:layout_marginBottom">5dp</item>
        <item name="android:textColor">#000000</item>
    </style>
    </resources>
    

    Then my layout XMLs would look like:

    <TextView
        android:id="@+id/somTextValue"
        style="@style/bigText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/someText" />
    

    Having a number of these styles, I apply them to my objects that need to scale. Trial and error will allow me to find something that works well for all screen sizes.