Android screen layouts - multiple layouts and densities

Question

I am looking for some advice on a problem I have supporting multiple Android screens in my app.

I have read the article Supporting Multiple Screens. I followed the advice and created 4 /res layout folders /layout-small, /layout-normal, /layout-large and /layout-xlarge. I mostly use RelativeLayouts and all units are measured in dip.

On my various test devices, this all works fine. However, a number of users have contacted me to say that the data is running off the edge of the screen. Closer examination using the excellent Screen info app shows that the devices I have been able to test my app on have Normal HDPI, Normal XHDPI and XLarge MDPI screens but the user devices where there are problems have Large MDPI screens.

My IDE is IntelliJ Idea and this has a preview mode which lets me test the layouts against a number of different screen emulations. To emulate the Large screen, I set the Preview mode to 7 inch WSVGA (Tablet). Does that seem correct? I don't own an actual Large screen test device.

What I don't understand is why I am having a problem with certain devices? Surely I don't have to create any more than the 4 layouts I have already designed? Even at 4, it becomes a real pain every time I add a screen to have to update different values for each of them.

How do other developers test different screen sizes / densities without having a range of test devices?

EDIT I should have said - my screens consist only of buttons and textviews, no graphics to speak of.

EDIT 2 I have added screenshots. The first (actually a photograph) shows the screen layout as it appears on a user device (note Friday is not visible). The second shows the program working as it should be.

Edit 3 I have included some of the XML code used for the layout

<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
             android:background="@drawable/paper_thin_background"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent"
             android:paddingLeft="15dip"
             android:paddingTop="15dip"
    >

<TextView
        android:id="@+id/timetable_week"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="25dip"
        android:textSize="20sp"
        android:textColor="#15252D"
        android:text="@string/timetable_week"
        android:paddingTop="10dip"
        android:paddingBottom="30dip"
        />

<Spinner
        android:id="@+id/timetable_week_spinner"
        android:layout_toRightOf="@id/timetable_week"
        android:layout_height="wrap_content"
        android:prompt="@string/enterday"
        android:layout_width="140dip"
        android:entries="@array/timetable_weeks"
        android:textSize="205sp"
        android:textColor="#768766"
        />

            <TextView
                android:id="@+id/period_heading"
                android:layout_width="120dp"
                android:layout_height="wrap_content"
                android:textColor="#768766"
                android:text="@string/period"
                android:textSize="20sp"
                android:paddingBottom="15dip"
                android:gravity="center_horizontal"
                android:layout_below="@+id/timetable_week"
            />

            <TextView
                    android:id="@+id/monday_heading"
                    android:layout_toRightOf="@id/period_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/monday"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    android:layout_below="@+id/timetable_week"
                    />

            <TextView
                    android:id="@+id/tuesday_heading"
                    android:layout_toRightOf="@id/monday_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/tuesday"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    android:layout_below="@+id/timetable_week"
                    />
            <TextView
                    android:id="@+id/wednesday_heading"
                    android:layout_toRightOf="@id/tuesday_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/wednesday"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    android:layout_below="@+id/timetable_week"
                    />
            <TextView
                    android:id="@+id/thursday_heading"
                    android:layout_toRightOf="@id/wednesday_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/thursday"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    android:layout_below="@+id/timetable_week"
                    />
            <TextView
                    android:id="@+id/friday_heading"
                    android:layout_toRightOf="@id/thursday_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/friday"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    android:layout_below="@+id/timetable_week"
                    />

    <!-- PERIOD 1-->

            <TextView
                    android:id="@+id/p1_heading"
                    android:layout_below="@id/period_heading"
                    android:layout_width="120dp"
                    android:layout_height="wrap_content"
                    android:textColor="#768766"
                    android:text="@string/p1"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

            <TextView
                    android:id="@+id/monp1"
                    android:layout_below="@id/period_heading"
                    android:layout_toRightOf="@id/period_heading"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#15252D"
                    android:text="@string/blank"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

            <TextView
                    android:id="@+id/tuep1"
                    android:layout_below="@id/period_heading"
                    android:layout_toRightOf="@id/monp1"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#15252D"
                    android:text="@string/blank"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

            <TextView
                    android:id="@+id/wedp1"
                    android:layout_below="@id/period_heading"
                    android:layout_toRightOf="@id/tuep1"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#15252D"
                    android:text="@string/blank"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

            <TextView
                    android:id="@+id/thup1"
                    android:layout_below="@id/period_heading"
                    android:layout_toRightOf="@id/wedp1"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#15252D"
                    android:text="@string/blank"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

            <TextView
                    android:id="@+id/frip1"
                    android:layout_below="@id/period_heading"
                    android:layout_toRightOf="@id/thup1"
                    android:layout_width="170dp"
                    android:layout_height="wrap_content"
                    android:textColor="#15252D"
                    android:text="@string/blank"
                    android:textSize="20sp"
                    android:paddingBottom="15dip"
                    android:gravity="center_horizontal"
                    />

Answer 1

I have realised that the problems I have been experiencing relate to my use of relative layouts combined with DIP measurements. It's just not possible to support the vast range of devices in this way.

Instead, I have gone back and redesigned every screen in my app using android:weightSum and android:layout_weight.

This, in theory, should make my app far more adaptive to different screen sizes.

Answer 2

Not a very nice way of structuring your app. When you have random, static layout(i.e not categorized as table or grid or list) then you can use individual views freely but when you have a dynamic and a categorized layout then using lots of views is not a good idea plus it's really cumbersome and difficult to manage.

For eg. In your case you needed to display a table or a grid of data. You have implemented this using lots of text views. Now on some devices it will fit and some it won't. You could have easily achieved with a small code using a dynamic view like grid view.
If you use a grid view then you just need a grid view and a text view as it's item. Now depending on the device size you can change the column width(size of text item) and the layout could have easily fit on any device.

If you need to support multiple device then you need to use a combination of xmls(different xmls in different folders) and code.

A very good link to GridView tutorial.