Home Screen Widget step-by-step - custom background shape of Widget

It's part of the Home Screen Widgets step-by-step series.

To custom background shape of Home Screen Widget, we can create custom background shape XML file, then apply it to the widget layout. (Actually it's same as define custom background in normal layouts.)

Create /res/drawable/round_rect.xml to define custom background shape.

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="5dp"
        android:color="#000000"/>
    <padding 
        android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp"/>
    <corners 
        android:radius="10dp"/>
</shape>

Modify the widget layout, /res/layout/widget_layout.xml, to apply android:background="@drawable/round_rect".

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/round_rect">
    <TextView
        android:id="@+id/widget_id"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:background="#F06030"
        android:textColor="#101010"
        android:textSize="30sp"
        android:text="id"/>
    <TextView
        android:id="@+id/widget_status"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/background_dark"
        android:textColor="@android:color/white"
        android:textSize="30sp"
        android:text="status"/>
</LinearLayout>

Tweet