Developers of Open Source Software, Open Hardware, Open Knowledge in Asia
Creating a Widget for your Android App
Having a widget for your app, not only helps it to stand out among its alternatives but also provides user information on the go without having to open the app.
Keeping this thought in mind, I decided to make a widget for my GSoC project.
Do you want to know how to do it?
Hang around and I’ll guide you through the steps involved.
Step 1 :
Creating a new widget from Android Studio.
Open up your project for which you need a widget and navigate to the project’s java source.
Create a new sub-package there named widget.
Right click on the newly created sub-package and select the New->Widget option from there.
Follow the instructions on the next screen.
After doing this and running the app in your device, you will be able to see a widget for your app in the widget picker.
Well, that’s it then? :p
Just kidding, this was the easy part, off to more harder things now!
Step 2 :
Populating the widget with data.
Now, there can be 2 broad type of widgets Information Widgets and Collection Widgets.
Information widgets are simple widgets that are used to display an information that changes with time, for example Weather Widget or a Clock Widget.
Whereas, collection widgets are widgets which display a collection of data, for example the GMail widget is a collection widget.
These are relatively complex and harder than the Information Widgets.
In this post, we will focus on making a Collection Widget.
For Collection widgets, we need two layout files, one for the widget and one for each item in the widget collection.
Go ahead and create the two layout files.
The wizard automatically generates the widget_layout.xml for you, you just need to edit it up.
Next up, having a look at the modified files, we can see that the Widget creation wizard added some stuff into out AndroidManifest.xml and created a new java file.
Upon taking a closer look at the manifest, we can see that the widget’s java class has been registered as a <receiver/>
Next, opening up the NewAppWidget.java, we will see that it extends AppWidgetProvider and some methods are already overridden for you.
Time to edit up this file to reference to the layouts we have just created.
Now, create a WidgetDataProvider which will provide us with data to be displayed inside the widget.
You can use a static data for now (like a prefilled ArrayList, but make sure that this data should be dynamic for making the widget meaningful)
Let’s also create a service that invokes the WidgetDataProvider after a fixed interval
Phew.. almost done with this now.
Finally edit up the widget_info.xml located inside /res/values/xml/ of your project.
Edit it to reference the time after which your widget will be updated, the preview image which should show up in the widget picker and minimum width and height of the widget.
Well, once this is done, go ahead and fire up your app.
You will be able to see the newly created and updated widget in your homescreen.
Pretty awesome right!
Congratulations on making your first widget.
For now the app only opens a specific activity on clicking it, but you can read up a bit on how to execute a separate task on clicking each item on the list by using a pendingIntent.
Well, that’s it for this week.
Thank you for going through this post and leave your suggestions and queries in the comments.