Search code examples
javaandroidandroid-layoutandroid-widgetandroid-appwidget

Android: AppWidget design and layouts


I would like to have an AppWidget that designed like this one.

Image:

enter image description here

I have searched the web for assitance, but couldn't find any.

Particularly: I want an appwidget wich consist of an imageButton, and a textView that will be placed in front of it (like in the picture above).

The closest solution I have found so far is by relativeLayout but it still doesn't place the textView on the imageButton.

Will be happy to get any help for designing AppWidgets like that one.

Thanks Advanced, Gal.


Solution

  • Used this answer to solve it, (Linked by alextsc in the comments).

    A relative layout is indeed used, I managed to achieve the desired effect by using this configurations:

     <RelativeLayout android:id="@+id/relativeLayout1" android:layout_width="wrap_content" android:layout_height="72dp">
            <ImageButton android:background="@null" android:layout_width="fill_parent" android:src="@drawable/phone_draw" android:layout_height="wrap_content" android:id="@+id/call" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_alignParentBottom="true"></ImageButton>
            <TextView android:textColor="@color/green" android:textAppearance="?android:attr/textAppearanceMedium" android:id="@+id/missedCalls" android:layout_width="wrap_content" android:textStyle="bold" android:background="@drawable/missed_call_bg" android:text="3" android:gravity="center_vertical|center_horizontal" android:typeface="sans" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true"></TextView>
     </RelativeLayout>
    

    Where the image button is the big icon, and the TextView is the little counter icon.

    Hope it will help you too! =]