Widgets

Widgets are additional layout objects that can provide 'at-a-glance' views and additional functionality to just application icons.

Overview

The BlueFletch Launcher configuration allows placement of different kinds of widgets on the home screen for the user. Like applications and shortcuts, these can configured to be role-based, such that front-line workers may see widgets related to pending or pickup orders, while managers may see high level metrics about the current store operations.

Unlike other Launchers, the BlueFletch Launcher allows the administrator to pre-define the widget configuration and not have to rely on the user to place the widgets themselves.

Configuring a Widget

Widgets are just another layout object to be included in the layouts section of the launcher configuration file. Each widget layout object consists of the following:

Field	Description
widgetId	string a unique string identifier for this widget. This must be unique across all widgets in the configuration file, and is also used to send data updates to a widget.
widgetType	string describes the type of widget to render. Current available values are: app, list, text, login, session, toolbar, bannerLarge, webview
columnSpan	number the number of columns this widget will occupy. This is based on the number of columns specified in the layoutSettings configuration.
rowSpan	number the number of rows this widget will occupy. Each row is one icon high.
widgetParams	object this is a JSON object that contains additional parameters to configure the widget. This object changes based on the widgetType specified above. Available starting in Launcher version 3.22.x.

widgetParams values also support configuration and session replacement values.

Launcher has the ability to host different kinds of widgets. The Launcher can host native application widgets (e.g. widgets that are built into an application). Launcher has other pre-built widgets designed specifically for shared device use.

Native Application Widgets

These are widgets built into applications that follow the App Widget SDK guidelines from Android as defined in https://developer.android.com/develop/ui/views/appwidgets/overview.

Launcher displaying the Digital Clock Widget

To configure an application widget, use the widgetType = app and define the widgetParams as follows:

{
    "widgetId" : "digital-clock",
    "widgetType" : "app",
    "columnSpan" : 3,
    "rowSpan" : 1,
    "widgetParams" : {
        "package" : "com.google.android.deskclock"
    }
}

The widgetParams object for type app consists of the following:

Field	Description
package	string the package name of the application containing the widget.
componentName	string (optional) the full component name of the widget inside the application. This is not required if there is only one widget in the application. If an application has multiple available widgets, specify the full component name here, otherwise the Launcher will use the first enumerated widget.

Below is an example of the clock widget, specifying the analog clock widget provider (instead of the digital clock):

{
    "widgetId" : "analog-clock",
    "widgetType" : "app",
    "columnSpan" : 2,
    "rowSpan" : 2,
    "widgetParams" : {
        "package" : "com.google.android.deskclock",
        "componentName" : "com.google.android.alarmclock.AnalogAppWidgetProvider"
    }
}

Custom Launcher Widgets

These are widgets that are built into the Launcher to allow you to take advantage of widgets without requiring additional native development of widgets into your applications, with several that can be updated by a simple broadcast intent. The following custom Launcher widgets are currently available:

Text Widget

This widget can be used to display text or a simple value/text combination or an icon/text combination, and can run a custom intent when the widget is tapped.

Launcher displaying three Text-type widgets (Pending Orders, For Pickup) and as a Message text.

To display a simple text in a widget, specify the title in the widget params:

{
    "widgetId" : "simple-text-1",
    "widgetType" : "text",
    "columnSpan" : 4,
    "rowSpan" : 1,
    "widgetParams" : {
        "defaultTitle" : "Cycle count is due for Aisle 5",
        "onItemClick" : {
            .. Custom Intent Object ..
        }
    }
}

To display a simple value/text in a widget, specify the value in the widget params as well as the command to launch the BOPIS application when tapped:

{
    "widgetId" : "simple-text-1",
    "widgetType" : "text",
    "columnSpan" : 2,
    "rowSpan" : 1,
    "widgetParams" : {
        "defaultValue": "23"
        "defaultTitle" : "Pending Orders",
        "onItemClick" : {
            "typeIntent" : "a",
            "package" : "com.mycompany.fulfillmentapp"
        }
    }
}

The widgetParams object for type text consists of the following:

Field	Description
defaultTitle	string the text to display at the bottom of the widget.
defaultValue	string (optional) if specified, will display the value in large font above the widget. if not specified or blank, the value will be hidden.
icon	string (optional) URL, file path or asset name of the icon image to display. If specified will display the icon above the title. If not specified or blank, the icon will be hidden.
iconSize	string (optional) Size in dp for the icon, if specified. Note that the icon shall always be rendered in a square container.
onItemClick	object A custom intent object that will be triggered when the user taps on the widget. For more information on a configuring a custom intent, refer to this link.

Note that you can use replacement values for each of the widget params.

Webview Widget

This widget allows you to display a webpage directly on the Launcher home screen.

A webview type widget displaying the BlueFletch about page.

You can display a webview widget using the configuration below, by specifying the type webview

{
    "widgetId" : "web-widget",
    "widgetType" : "webview",
    "columnSpan" : 4,
    "rowSpan" : 3,
    "widgetParams" : {
        "url" : "https://bluefletch.com",
        "allowInteraction" : true,
        "onItemClick" : {
            "typeIntent" : "a",
            "package" : "com.mycompany.fulfillmentapp"
        }
    }
}

The widgetParams object for type webview consists of the following:

Field	Description
url	string The URL of the webpage to be displayed in the webview
allowInteraction	boolean If set to true, will allow the user to interact with the page like a normal browser, e.g. scroll and tap within the page. Default is false.
onItemClick	object A custom intent object that will be triggered when the user taps on the widget. If using this function, allowInteractions must be set to false. For more information on a configuring a custom intent, refer to this link.

Open Zone Banner Widget

This widget replaces the current fixed header with a widget and comes standard with your default Launcher installation. Beginning Launcher 3.22.x, you can now specify a widget as the header for the open zone by defining a widget within the "header" array at the base level of the launcher configuration.

Large Banner widget for Open Zone

This is configured in Launcher using the following widget configuration, which includes criteria to check that there is no user session:

"header": [
   {
      "id": "default_openzone",
      "layout": {
         "widgetId": "openzone-banner",
         "widgetType": "bannerLarge",
         "columnSpan": 1,
         "rowSpan": 1,
         "widgetParams": {
             "bannerText" : "${launcherState.formattedText}",
             "bannerImage" : "${launcherState.theme.logo}",
             "buttonColor" : "${launcherState.theme.accentColor}",
             "isAuthPresent" : "${launcherState.isAuthPresent}"
         },
         "criteria_OR": [
           {
             "field": "_${session.userId}",
             "pattern": "^_$"
           }
         ]
      }
   }
   ...
]

The widgetParams object for type bannerLarge consists of the following:

Field	Description
bannerImage	string A URL, filepath or asset for the image logo
bannerText	string (optional) The text to display between the logo and the Login button. You can use replacement variables here to be able to display dynamic information like site, serial number, etc.
useDarkText	boolean If set to true, will render the bannerText in dark text to contrast a white wallpaper, otherwise will render the bannerText in light text.
buttonColor	string Hexidecimal representation of a color for the button. The button text will automatically change color based on the appropriate contrast level.
backgroundColor	string Hexadecimal representation of the background. To change the background opacity, add the alpha value as the first two values in the hex string, e.g. #50FFFFFF
isAuthPresent	boolean If true, the login button is present in the header; if false, login button is hidden. By using a launcherState variable, Launcher will dynamically set the boolean value based on installation status of the Auth app. Introduced in Launcher version 3.24.11.

Session Widget

This widget can display your current session information, along with a button to be able to log out or exit your current session. You are able to specify one headline and two additional sub-text under the headline.

Session Widget as Header

This widget can be configured in Launcher using criteria to check for a current user session, and is represented by the following widget configuration:

"header": [
    ...
    {
        "id": "default_authorized",
        "layout": {
              "widgetId": "session-banner",
              "widgetType": "session",
              "columnSpan": 1,
              "rowSpan": 1,
              "widgetParams": {
                  "heading" : "${session.userName}",
                  "subtitle1" : "${launcherState.formattedText}",
                  "subtitle2" : "",
                  "exitButtonText" : "${res.launcher_base_launcher_button_logout}",
                  "exitButtonColor" : "${launcherState.theme.accentColor}"
              },
              "criteria_OR": [
                {
                  "field": "_${session.userId}",
                  "pattern": "^_.+$"
                }
              ]
         }
     }
 ]