Android creates desktop component Widget - building application widgets (1)

Android creates desktop component Widget - building application widgets (1)

Effect picture:
Create a widget that can change the size, including a Button and a TextView, click the button to jump to the specified Activity.

overview

Widgets are an important aspect of customizing your home screen. You can think of widgets as "at-a-glance" views that put the most important app data and functionality at a glance, accessible from the user's home screen. Users can move widgets between panels on their home screen and, if supported by the system, resize widgets to tailor the amount of information in them to their preferences.

widget type

Information Widget

Information widgets typically display some key information elements that are important to the user and track changes in that information over time . Informational widgets such as weather widgets, clock widgets, or sports score trackers are good examples. Tapping an info widget usually launches the associated app and opens a detailed view of the widget's info.

collection widget

Collection widgets are designed to display many elements of the same type , such as a series of images in a gallery app, a series of stories in a news app, or a series of emails/messages in a communication app. Collection widgets typically focus on two use cases: one to browse a collection, and one to open a collection's elements to their detail view for consumption. Collection widgets can be scrolled vertically.

control widget

The main purpose of the control widget is to display commonly used functions that users can trigger directly from the home screen without having to open the app first. You can think of the control widget as your app's remote control. A typical example is the music app widget, a control widget that allows users to play, pause, or skip music tracks outside of the actual music app.

Interaction with the control widget may not necessarily lead to the associated detail view, depending on whether the control widget's functionality generated a dataset (for example, when using a search widget).

hybrid widget

While all widgets tend to fall into one of the three types above, many widgets are actually hybrid widgets that combine elements of different types .

When planning a widget, keep it centered around a base type and add elements of other types as needed.

The music player widget is primarily a control widget, but also informs the user of the currently playing track. It essentially combines control widgets with information widget type elements.

Build App Widgets

basic knowledge

To create an application widget, you need to use the following classes:

1. AppWidgetProviderInfoObject

Metadata describing the app widget, such as the app widget's layout, update frequency, and AppWidgetProvider class. This object should be defined in XML.

2. AppWidgetProviderClass implementation

Defines the basic methods that allow you to programmatically interface with app widgets based on broadcast events. It allows you to receive broadcasts when app widgets are updated, enabled, disabled, and deleted.

view layout

Defines the initial layout of the app widget, defined in XML. In addition, you can also implement the application widget configuration Activity. This is an optional activity that starts when a user adds your app widget and allows the user to modify the settings of your app widget at creation time.

create widget

1. Declare the app widget in the manifest

Declare the AppWidgetProvider class in the application's AndroidManifest.xml file. For example:

    <receiver android:name="ExampleAppWidgetProvider" >
        <intent-filter>
            <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
        </intent-filter>
        <meta-data android:name="android.appwidget.provider"
                   android:resource="@xml/example_appwidget_info" />
    </receiver>

2. Add AppWidgetProviderInfo metadata

AppWidgetProviderInfoDefines the basic characteristics of the app widget, such as the app widget's minimum layout size, the app widget's initial layout resources, the app widget's update frequency, and (optionally) the configuration that starts when the app widget is created Activity. You can define it in an XML resource using a single <appwidget-provider> element AppWidgetProviderInfo 对象and save it in the project's res/xml/folder .

    <appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
        android:minWidth="40dp"
        android:minHeight="40dp"
        android:updatePeriodMillis="86400000"
        android:previewImage="@drawable/preview"
        android:initialLayout="@layout/example_appwidget"
        android:configure="com.example.android.ExampleAppWidgetConfigure"
        android:resizeMode="horizontal|vertical"
        android:widgetCategory="home_screen">
    </appwidget-provider>

3. Create app widget layout

App widget layouts are based on RemoteViewsand not every layout or view widget is supported by it. RemoteViews Objects (and thus app widgets) can support the following layout classes: FrameLayout, LinearLayout, RelativeLayout, GridLayout. and the following widget classes: AnalogClock, Button, Chronometer, ImageButton, ImageView, ProgressBar, TextView, ViewFlipper, ListView, GridView, StackView, AdapterViewFlipper, but subclasses of these classes are not supported.
RemoteViewsAlso supported ViewStub, is an invisible view with zero size that you can use to lazily inflate layout resources at runtime.

3.1 Adding margins to app widgets

Widgets should generally not extend to the edge of the screen, nor should they be visually flush with other widgets, so you should add margins around the widget frame.

1. Set your app's targetSdkVersion to 14 or higher.
2. Create a layout like the following, referencing size resources for its margins:

    <FrameLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:padding="@dimen/widget_margin">

      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:background="@drawable/my_widget_background">
        …
      </LinearLayout>

    </FrameLayout>

3. Create two size resources: one in res/values/, which provides custom margins for widgets on platforms lower than Android 4.0, and one in res/values-v14/, which does not provide for Android 4.0 platforms Widgets on provide additional padding:

res/values/dimens.xml：

<dimen name="widget_margin">8dp</dimen>

res/values-v14/dimens.xml：

<dimen name="widget_margin">0dp</dimen>

Reference:
https://developer.android.google.cn/guide/practices/ui_guidelines/widget_design
https://developer.android.google.cn/guide/topics/appwidgets#collection_sample