Byron Kiourtzoglou

About Byron Kiourtzoglou

Byron is a master software engineer working in the IT and Telecom domains. He is always fascinated by SOA, middleware services and mobile development. Byron is co-founder and Executive Editor at Java Code Geeks.

Creating an AppWidget for the home screen

In this tutorial we are going to see how can you create an AppWidget of your Android Application for the home screen of the device.

Since version 1.5, the Android SDK includes the AppWidget framework, a framework that allows developers to write “widgets” that people can drop onto their home screen and interact with. The use of widgets is very handy since it allows the user to add their favorite applications into their home screen and interact with them quickly and without having to launch the whole application.
 
 
 
 
To create an AppWidget for your home screen you should:

  • Create a an xml inside the res/xml folder of your project in which we provide information regarding the widget’s dimensions, its update interval etc
  • Create a new layout file that describes how the widget will be rendered
  • update the res/values/styles.xml file
  • register a special BroadcastReceiver in the AndroidManifest.xml file
  • create a new class that extends AppWidgetProvider
package com.javacodegeeks.android.apps.moviesearchapp.widget;

import android.app.PendingIntent;
import android.app.Service;
import android.appwidget.AppWidgetManager;
import android.appwidget.AppWidgetProvider;
import android.content.ComponentName;
import android.content.Context;
import android.content.Intent;
import android.net.Uri;
import android.os.IBinder;
import android.widget.RemoteViews;

import com.javacodegeeks.android.apps.moviesearchapp.R;
import com.javacodegeeks.android.apps.moviesearchapp.model.Movie;
import com.javacodegeeks.android.apps.moviesearchapp.services.MovieSeeker;

public class MovieSearchWidget extends AppWidgetProvider {

   private static final String IMDB_BASE_URL = "http://m.imdb.com/title/";

   @Override
    public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {

  // To prevent any ANR timeouts, we perform the update in a service

  context.startService(new Intent(context, UpdateService.class));
    }

    public static class UpdateService extends Service {

 private MovieSeeker movieSeeker = new MovieSeeker();

  @Override

  public void onStart(Intent intent, int startId) {

// Build the widget update for today

RemoteViews updateViews = buildUpdate(this);

// Push update for this widget to the home screen

ComponentName thisWidget = new ComponentName(this, MovieSearchWidget.class);

AppWidgetManager manager = AppWidgetManager.getInstance(this);

manager.updateAppWidget(thisWidget, updateViews);

  }

public RemoteViews buildUpdate(Context context) {

   Movie movie = movieSeeker.findLatest();

   String imdbUrl = IMDB_BASE_URL + movie.imdbId;

   // Build an update that holds the updated widget contents

   RemoteViews updateViews = new RemoteViews(context.getPackageName(), R.layout.widget_layout);

   updateViews.setTextViewText(R.id.app_name, getString(R.string.app_name));

   updateViews.setTextViewText(R.id.movie_name, movie.name);

   Intent intent = new Intent();

   intent.setAction("android.intent.action.VIEW");

   intent.addCategory("android.intent.category.BROWSABLE");

   intent.setData(Uri.parse(imdbUrl));

   PendingIntent pendingIntent = 

PendingIntent.getActivity(context, 0, intent, PendingIntent.FLAG_UPDATE_CURRENT);

   updateViews.setOnClickPendingIntent(R.id.movie_name, pendingIntent);

   return updateViews;

}

  @Override

  public IBinder onBind(Intent intent) {

// We don't need to bind to this service

return null;

  }

    }

}

movie_search_widget.xml

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

<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
    android:minWidth="146dip"
    android:minHeight="72dip"
    android:updatePeriodMillis="10000"
    android:initialLayout="@layout/widget_layout"
/>

/res/layout/widget_layout.xml

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/widget"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:focusable="true"
    style="@style/WidgetBackground">

    <TextView

  android:id="@+id/app_name"

  android:layout_width="wrap_content" 

  android:layout_height="wrap_content"

  android:layout_marginTop="14dip"

  android:layout_marginBottom="1dip"

  android:includeFontPadding="false"

  android:singleLine="true"

  android:ellipsize="end"

  style="@style/Text.WordTitle" />

    <TextView  

  android:id="@+id/movie_name"

  android:layout_width="fill_parent" 

  android:layout_height="wrap_content"

  android:layout_below="@id/app_name"

  android:paddingRight="5dip"

  android:paddingBottom="4dip"

  android:includeFontPadding="false"

  android:lineSpacingMultiplier="0.9"

  android:maxLines="4"

  android:fadingEdge="vertical"

  style="@style/Text.Movie" />

</RelativeLayout>

res/values/styles.xml

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

<resources>

    <style name="WidgetBackground">

  <item name="android:background">@drawable/widget_bg</item>
    </style>

    <style name="Text">
    </style>

    <style name="Text.Title">

  <item name="android:textSize">16sp</item>

  <item name="android:textStyle">bold</item>

  <item name="android:textColor">@android:color/black</item>
    </style>

    <style name="Text.Movie">

  <item name="android:textSize">13sp</item>

  <item name="android:textColor">@android:color/black</item>
    </style>

</resources>

AndroidManifest.xml

<application android:icon="@drawable/icon" android:label="@string/app_name">
...     

  <!-- Broadcast Receiver that will process AppWidget updates -->

  <receiver android:name=".widget.MovieSearchWidget" android:label="@string/widget_name">

<intent-filter>

    <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />

</intent-filter>

<meta-data android:name="android.appwidget.provider" android:resource="@xml/movie_search_widget" />

  </receiver>

  <!-- Service to perform web API queries -->

  <service android:name=".widget.MovieSearchWidget$UpdateService" />

...
</application>

 
This was an example of how to create AppWidget of your Android Application for the home screen of the device.

Related Article:

Related Whitepaper:

Beginning Android Application Development (Free Sample Chapter)

Create must-have applications for the latest Android OS!

The Android OS is a popular and flexible platform for many of today's most in-demand mobile devices. This full-color guide offers you a hands-on introduction to creating Android applications for the latest mobile devices. Veteran author Wei Meng Lee accompanies each lesson with real-world examples to drive home the content he covers. Beginning with an overview of core Android features and tools, he moves at a steady pace while teaching everything you need to know to successfully develop your own Android applications.

Get it Now!  

Examples Java Code Geeks and all content copyright © 2010-2014, Exelixis Media Ltd | Terms of Use | Privacy Policy
All trademarks and registered trademarks appearing on Examples Java Code Geeks are the property of their respective owners.
Java is a trademark or registered trademark of Oracle Corporation in the United States and other countries.
Examples Java Code Geeks is not connected to Oracle Corporation and is not sponsored by Oracle Corporation.
Do you want to know how to develop your skillset and become a ...
Java Rockstar?

Subscribe to our newsletter to start Rocking right now!

To get you started we give you two of our best selling eBooks for FREE!

Get ready to Rock!
You can download the complementary eBooks using the links below:
Close