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/xmlfolder 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
BroadcastReceiverin theAndroidManifest.xmlfile - 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:
