CODEWITHSUNDEEP
androidandroid-layoutandroid-widget
Nick
Nick

Reputation: 6940

Android AppWidget, Massive layout discrepancy

I'm creating an App Widget, and I'm having a strange issue. In the Eclipse graphical layout editor, my widget's layout looks like this:

How widget appears in Eclipse layout manager

However, when I install it on an emulator/my phone, it looks like this:

How widget appears on device emulator

And here is the layout code in question:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:layout_gravity="center_horizontal" android:gravity="center_horizontal">
    <RelativeLayout android:background="@drawable/blackbg"
        android:layout_width="290dp" android:layout_height="145dp">
        <ImageView android:layout_width="wrap_content" android:src="@drawable/clock_colon"
            android:layout_height="107dp" android:layout_marginRight="10dp"
            android:layout_marginLeft="10dp" android:layout_marginTop="5dp"
            android:layout_centerInParent="true" android:id="@+id/colon" />
        <ImageView android:layout_width="wrap_content" android:src="@drawable/num_0"
            android:layout_height="107dp" android:layout_marginRight="5dp"
            android:layout_marginLeft="5dp" android:id="@+id/hour2"
            android:layout_toLeftOf="@id/colon" android:layout_centerVertical="true" />
        <ImageView android:layout_width="wrap_content" android:src="@drawable/num_1"
            android:layout_height="107dp" android:layout_marginRight="5dp"
            android:layout_marginLeft="5dp" android:id="@+id/hour1"
            android:layout_marginTop="5dp" android:layout_toLeftOf="@id/hour2"
            android:layout_centerVertical="true" />
        <ImageView android:layout_width="wrap_content" android:src="@drawable/num_3"
            android:layout_height="107dp" android:layout_marginRight="5dp"
            android:layout_marginLeft="5dp" android:id="@+id/minute1"
            android:layout_marginTop="5dp" android:layout_toRightOf="@id/colon"
            android:layout_centerVertical="true" />
        <ImageView android:layout_width="wrap_content" android:src="@drawable/num_2"
            android:layout_height="107dp" android:layout_marginRight="5dp"
            android:layout_marginLeft="5dp" android:id="@+id/minute2"
            android:layout_marginTop="5dp" android:layout_toRightOf="@id/minute1"
            android:layout_centerVertical="true" />
        <ImageView android:layout_width="wrap_content" android:src="@drawable/clock_pm"
            android:layout_height="wrap_content" android:id="@+id/clock_ampm"
            android:layout_below="@id/minute2" android:layout_alignParentRight="true"
            android:layout_marginRight="15dp" android:layout_marginBottom="5dp" />
    </RelativeLayout>
</LinearLayout>

So what do you think? How come the numbers are getting cut off and spaced strangely like this. Thanks!

Upvotes: 0

Views: 274

Answers (2)

Nick
Nick

Reputation: 6940

The problem ended up being that I had set the size for the container RelativeLayout. Apparently you can't do that.

Upvotes: 0

Ovidiu Latcu
Ovidiu Latcu

Reputation: 72311

You are setting manually the height of your RelativeLayout and the height of your ImageViews to 107dp and your images may not fit properly inside your ImageView. So you should consider the following:

Upvotes: 1

Related Questions