Supporting Different Screen Sizes - xml not loading correctly. Possible bug?

Question

Question at the end

I have this folders and files (omitted not important ones):

-layout
----activity_map.xml
----list_item_place_map.xml
layout-sw600dp-land
----activity_map.xml
values
----dimens.xml
values-sw600dp
----dimens.xml
values-sw720dp-land
----dimens.xml

layout/activity_map.xml:

<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.MapFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MapActivity" />

layout/list_item_place_map.xml:

<?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"
    android:minHeight="48dp"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin" >

    <TextView
        android:id="@+id/place_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:duplicateParentState="true"
        android:fontFamily="sans-serif-light"
        android:text="@android:string/unknownName"
        android:textColor="@color/missions_item_text"
        android:textSize="18sp" />

</RelativeLayout>

layout-sw600dp-land/activity_map.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="false" 
    tools:context=".MapActivity" >

    <ListView
        android:id="@+id/map_places_list"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:divider="@color/missions_divider"
        android:dividerHeight="1dp"
        android:listSelector="@drawable/missions_listselector"
        tools:ignore="InconsistentLayout"
        tools:listitem="@layout/list_item_place_map" />

    <fragment
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.MapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

values/dimens.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
    <dimen name="main_sign_in_textsize">14sp</dimen>
    <dimen name="main_greeting_textsize">18sp</dimen>
    <dimen name="main_missions_textsize">18sp</dimen>
    <dimen name="main_progress_textsize">40sp</dimen>

</resources>

values-sw600dp/dimens.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <dimen name="main_greeting_textsize">20sp</dimen>

</resources>

values-sw720dp-land/dimens.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <dimen name="activity_horizontal_margin">128dp</dimen>

</resources>

Problem is happening when activity_map.xml is shown.

When using the app on portrait, it works as expected (any screen size) When using the app on landscape, this should happen:

• If below sw600dp, it should only show a map (I have no problems with this case)
• if sw600dp case is met, then it should also show a list on the left side. (partially works)

Using the Eclipse Layout Preview, it works as expected for Nexus 7. However, on Nexus 10 and 10.1" preview, it doesn't show the list preview (items are not shown, list appears but empty).

I thought that it may just be a bug on the ADT plugin so I made my friend test the APK on his device (Galaxy Tab 2 10.1 with Android 4.2.2). He sent me this screenshot (private info erased):

As you can see, the list is there. The elements are loaded correctly. Touch events work without any problem. However, the list_item_place_map.xml seems to not have loaded correctly.

My guess is that the folder values-sw720dp-land is making conflict with how layout is loaded since layout/list_item_place_map.xml is referencing activity_horizontal_margin, located in both values/dimens.xml and values-sw720dp-land/dimens.xml. As soon as I remove the reference, the Eclipse Layout Peview starts working as expected an ALL screen sizes.

My questions are

• Is it a bug?
• If so has it been acknowledge and/or fixed? Since which version it is fixed?
• How can I create a workaround? I would like not to create copies of the same file on different folders. I'd rather use Layout Aliases

EDIT:

I have created a simple project to dest/demonstrate my problem (LINK).

The structure is as follows:

-layout  (Blue version)
----activity_map.xml
----list_item_place_map.xml
layout-sw600dp-land (Orange version)
----activity_map.xml
layout-sw720dp-land (Green version)
----activity_map.xml

activity_map is the same on all 3 folders except for the color on the right.

As you can see in the screenshot (taken from Eclipse Layout Preview), the list is not correctly showing the items on:

• 10.1 in (it uses the sw600dp version)
• Nexus 10 (it uses the sw720dp version)

I tested the project on the emulator and had same results.

EDIT 2:

I Uploaded a small project which reproduces my problem on github: LINK

As suggested by @anddev84, I used HierarchyViewer. What I found so far is that all place_name TextViews inside the list are being loaded correctly. However, the RelativeLayout container doesn't display correctly. I still haven't figured out if it is a problem in the RelativeLayout's or TextView's properties at runtime, or if there is another thing making conflict (possibly a bug?).

Answer 1

Your ListView has a hard width of 200 dips, but you have defined the left/right padding for it's items to be 128 dips in devices with a screen width of 720 dips or more, which leaves no room for actual content. You will need to change the list item dimensions for sw720dp-land, either increasing the width to be more than 256 dips (the space currently taken by the padding), or decreasing the padding to be less than 100 dips (which would take over the whole area).

Answer 2

I see a typo (maybe)? Are these supposed to be the same?

 tools:listitem="@layout/list_item_place_map"

but the filename is:

list_item_places_map.xml

"place_map" !- "places_map"

EDIT

In response to your edit about Eclipse using the wrong folders, I have found the same thing with values and drawables as well. Sometimes Eclipse and an AVD use different folders and both get them wrong (like with a Galaxy S4). Other times, at least the AVD gets it right.

I have asked two questions recently. One of them gave me the tumbleweed badge!

Drawable-xxxx : Eclipse Versus AVD

Android Galaxy S4 uses values-large?

I am also seeing a big difference in how Eclipse (set to show an AVD) and the AVD for certain devices and APIs render a layout. It would seem that it is just a crap shoot to use the dev tools we are provided, and only by testing on a real device, can you really verify how your content will look.

Answer 3

I think the issue is that you are not specifying "exact matches" to the Resource directory tree for the devices in question. It's all spelled out in this link from the dev page.

As per the dev page, the device does it's best to choose the closest resource available for screen density. In your original problem (not the color example), you provide a 'layout-sw600dp-land but no values-sw600dp-land, therefore the device will find the first set of values that match the landscape and other qualifiers you provide, and closest screen density.

Try to add values folders for all of your configurations (all desired screen densities, portrait and land) and see if that solves it for you.