Different display of SmartWatch control screen

Question

My app presents a simple screen of the numbers 1-9, in a simple grid of 3x3. You can see how this looks on my SmartWatch here: https://www.youtube.com/watch?v=ijh5EOTTR-w

Now, that is all correct. The problem is that a user reported very different display of the same app on his device, which could be seen here: https://docs.google.com/open?id=0BwywSxPvL53dcmlwd0RJQWhVa0E

Both SmartWatches are running on the same versions:

• Smartwatch version 0.1.A.3.7
• Host application 1.2.37

The only difference is the phone model: the problem occurs on Sony Xperia S, while on the Sony Xperia Sola all is working fine. Both phones run Sony's stock Android Gingerbread (on the Sola all continues to work fine after the upgrade to ICS).

I tried specifying the numbers' (text) size in different ways, using dip, px, mm, but in all cases on the Sola they were presented much smaller in dimensions than on the Xperia S.

I have no idea what could be making this significant difference, and would appreciate any hints or help. Thank you!

P.S. I'm not using any drawables.

Here's my code to make things even more clear:

1) The grid holding the values:

<?xml version="1.0" encoding="utf-8"?>
<!-- px is used since this is a layout for the accessory display. -->
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/smart_watch_control_height"
    android:layout_height="@dimen/smart_watch_control_width" 
    xmlns:tools="http://schemas.android.com/tools" 
    tools:ignore="PxUsage">

<GridView
    android:id="@+id/grid"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginRight="0px"
    android:layout_marginTop="-13px"
    android:columnWidth="40px"
    android:gravity="center"
    android:horizontalSpacing="0dip"
    android:numColumns="3"
    android:padding="0dip"
    android:stretchMode="none"
    android:verticalSpacing="0dip" />

</RelativeLayout>

2) Into each cell of the grid goes one of these elements:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="16dip"
    android:textStyle="bold"
    android:textColor="#0000FF"
    android:gravity="center"
    android:padding="0dip"
/>

3) The drawing logic in the control:

// Create background bitmap for animation.
background = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
// Set default density to avoid scaling.
background.setDensity(DisplayMetrics.DENSITY_DEFAULT);

LinearLayout root = new LinearLayout(mContext);
root.setLayoutParams(new LayoutParams(width, height));

LinearLayout sampleLayout= (LinearLayout) LinearLayout.inflate(mContext,
        R.layout.speed_dial_control, root);

// draw on the sampleLayout
GridView gridView = (GridView) sampleLayout.findViewById(R.id.grid);
gridView.setAdapter(adapter);

// adjust the size
sampleLayout.measure(width, height);
sampleLayout.layout(0, 0, sampleLayout.getMeasuredWidth(),
    sampleLayout.getMeasuredHeight());

// Draw on canvas
Canvas canvas = new Canvas(background);
sampleLayout.draw(canvas);

// Send bitmap to accessory
showBitmap(background);

Answer 1

So, another answer, since the first answer is still relevant - for drawables.

First of all, you want to use PX since the SmartWatch display is built up by 128x128 pixels. Density should not be applied.

I have modified your xmls a bit. Mostly I have removed unnecessary definitions.

The grid:

<?xml version="1.0" encoding="utf-8"?>
<!-- px is used since this is a layout for the accessory display. -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="@dimen/smart_watch_control_height"
    android:layout_height="@dimen/smart_watch_control_width"
    tools:ignore="PxUsage" >

    <GridView
        android:id="@+id/grid"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:numColumns="3" />

</RelativeLayout>

As you can see, I have left out most of your original xml. You really just need to define the grid and the number of columns. The rest will take care of itself - i.e. the grid will be distributed evenly in the parent layout (128x128).

The cell:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@android:id/text1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    android:textColor="#0000FF"
    android:textSize="26px"
    android:textStyle="bold"
    tools:ignore="PxUsage" />

Here I changed the textSize to pixels, and removed the padding, since you do not need to state it.

This should do the trick for you. I tested on different phone models - works out nicely. If it doesn't, your adapter could be the problem. For testing, I used a simple ArrayAdapter, like this:

String[] numbers = new String[] {
        "1", "2", "3", "4", "5",
        "6", "7", "8", "9"
};

ArrayAdapter<String> adapter = new ArrayAdapter<String>(mContext, R.layout.cell, numbers);

Cheers!

Answer 2

To stop Android from applying density, try using the res/drawable-nodpi folder.

I think your problem might be similar to this question.