How to Create a Dynamic Widget of an Android App?

Prerequisites: How to Create a Basic Widget of an Android App?

Widgets are the UI elements provided by an application for accessing some of its features remotely either from Home Screens or Lock Screens. Widgets can be Static or Dynamic meaning that the display elements don’t change (Static) or change (Dynamic) with time. Through this article, let’s demonstrate the implementation of a Dynamic widget. In our case, we shall change the display with respect to time using a Thread. Here is a preview of the same:

Steps for Creating Dynamic Widget

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.

Step 2: Add the App Widget to the Project

• Right-Click on the app, move the cursor to new, find the “Widget” option at the end, select it.

• Specify the required properties for the widget such as min.width and height, config file and preferred language, etc, and proceed. Files are automatically generated.

Step 3: What to program? Where to program?

1. In our application, since we wish to display two messages “Just do it” & “You are awesome” (the users may choose their own messages) one after the other simultaneously, we would be implementing a thread for generating a pause (of 1 second) in between.
2. The entire programming (back-end) is done in the newly created NewAppWidget.kt, Kotlin Class File in the Main Source Folder.

Changes made only to NewAppWidget.kt file

NewAppWidget.kt

package org.geeksforgeeks.widget_dynamic

import android.appwidget.AppWidgetManager
import android.appwidget.AppWidgetProvider
import android.content.Context
import android.content.Intent
import android.widget.RemoteViews

// Implementation of App Widget functionality
class NewAppWidget : AppWidgetProvider() {
    override fun onUpdate(
        context: Context,
        appWidgetManager: AppWidgetManager,
        appWidgetIds: IntArray
    ) {
        // There may be multiple widgets active, so update all of them
        for (appWidgetId in appWidgetIds) {
            updateAppWidget(context, appWidgetManager, appWidgetId)
        }
    }

    // Enter relevant functionality for
      // when the first widget is created
    override fun onEnabled(context: Context) {

    }

    // Enter relevant functionality for
    // when the last widget is disabled
    override fun onDisabled(context: Context) {

    }
}


internal fun updateAppWidget(
    context: Context,
    appWidgetManager: AppWidgetManager,
    appWidgetId: Int
)
/////////////////////////Add functionality here ///////////////////////////////
{
    Thread(Runnable {
        while(true){
                // Construct the RemoteViews object
                val views = RemoteViews(context.packageName, R.layout.new_app_widget)
                views.setTextViewText(R.id.appwidget_text, "Just do it")
                // Instruct the widget manager to update the widget
                appWidgetManager.updateAppWidget(appWidgetId, views)
                Thread.sleep(1000)

                // Construct the RemoteViews object
                views.setTextViewText(R.id.appwidget_text, "You are awesome")
                // Instruct the widget manager to update the widget
                appWidgetManager.updateAppWidget(appWidgetId, views)
                Thread.sleep(1000)
        }
    }).start()
}
////////////////////////////////////////////////////////////////////////////////////

That’s it, run the code and you will see this widget in the Widgets list, bring it to Home Screen.

Output: Run on Emulator