What is an android phone widget

What is a widget?

What is a widget? In Android, the word widget is a generic term for a bit of self-contained code that displays a program, or a piece of a program, that is also (usually) a shortcut to a larger application. We see them every day on web pages, on our computer desktop and on our smartphones, but we never give too much thought into how great they are. Widgets first appeared in Android in version 1.5, and really gained traction thanks to HTC’s Sense-flavored version of the operating system. Prior to the release of the HTC Hero and our first taste of HTC Sense, widgets were functional, but pretty bland in appearance. Since then, the people making our phoines and independent developers alike have done some marvelous things with widgets, and it’s hard to imagine using Android without them.

Android widgets come in all shapes and sizes and range from the utilitarian 1-by-1 shortcut style to full-page widgets that blow us away with the eye-candy. Both types are very useful, and it’s pretty common to see a widget or two on the home screen of any Android phone. A full-page widget, like HTC’s weather widget for late-model Android phones, tells you everything you need to know about the current conditions, and is also a quick gateway to the weather application where you can see things like forecasts and weather data for other cities. At the other end of the spectrum, a 1×1 WiFi widget simply opens the WiFi settings when pressed. Both are very handy, and add a lot to the Android experience.

Most Android phones come with a handful of built-in widgets. Some manufacturer versions of Android offer more than others, but the basics like a clock, calendar, or bookmarks widget are usually well represented. This is just the tip of the iceberg though. A quick trip into the Android Market will dazzle you with the huge catalog of third-party widgets available, with something that suits almost every taste. As newer and better APIs are added to Android with each release, there will always be space for the widget.

Samsung needs to bring back its iPod competitor

I don’t want to buy an iPod Touch. Since I want a reasonably priced PMP with acceptable audio hardware that can install a few crucial apps, I might have to.

VoLTE: How to use it and why you should care

VoLTE — or Voice over LTE — is the new standard for calling throughout the U.S., Canada, and parts of Europe. Not only does it facilitate much higher call quality between cell phones, but it allows devices to stay connected to LTE while on a call, improving data speeds for everyone.

PlayStation reportedly planning service to compete with Xbox Game Pass

Sony is planning to create a service similar to Xbox Game Pass, according to a new report. The service could launch as early as sometime in the spring of 2022, with multiple tiers.

These are the best rugged Android phones

Living the rough and tumble life? Get yourself a smartphone that can handle everything you throw at it — or throw your phone at.

Источник

Android Widgets

This article covers a complete tutorial about how to add Android Widgets into your application. Understanding the logic and depth diving into Android Widgets with 4 sample projects. You will learn how to code your widget from scratch to advanced. Afterward, at the end article we are going to see what the common mistakes.

Before getting started, what is an Android Widget?

Widgets are an essential aspect of home screen customization. You can imagine them as “at-a-glance” views of an app’s most important data and functionality that is accessible right from the user’s home screen.

You can also read this article in Chinese(中文) .

So what we are going to achieved?

  • Widget Creation Steps with a basic example (‘Simple Widget’ — Opening a website on widget clicked)
  • Broadcast Widget Example (‘Broadcast Widget’ — Counting clicks on widget)
  • Configurable Widget Example (‘Configurable Widget’ — Getting data before creation and using the data when it’s clicked)
  • Updating Widget by a Service (‘Updating Widget’ — Updating every minute brings random numbers on widget)

Widget Creation Steps :

  1. create layout for the widget.
  2. create XML for defining the widget properties.
  3. create class for the widget actions.
  4. add all these to AndroidManifest.xml file.

With that knowledge, our first example is a widget that will be opening a website on widget clicks.

Step 1: Creating a very simple layout for a widget.

This layout is displayed as a widget on user’s home-screen.

Step 2: create an XML that defines widget properties.

In res folder create a new XML folder.

Quick look for these properties

  • initialLayout: reference for the widget layout(that we already created).
  • minHeight and minWidth: Every 60dp means 1 cell in android home-screen. For this example, the widget takes min 1×1 cell(s).
  • previewImage: The image that will be shown on android’s widget select screen. We can not draw a layout for preview. We have to set an image.
  • resizeMode: The configuration for resizing the widget.
  • updatePeriodMillis: The widget’s update method is called when the specified time is reached in a millisecond.
  • widgetCategory: home_screen or keyguard.
Читайте также:  Html5 плеер для андроида

Android Studio has an amazing interface for creating widgets.

Step 3: Create a class for the widget lifecycle.

AppWidgetProvider extends BroadcastReceiver. SimpleAppWidget is indirectly a child of BroadcastReceiver. So our widget class is a receiver class.

Step 4: Adding into AndroidManifest as a receiver.

Yay! You have implemented a widget for your app 🙂

Let’s take it to the next level.

RemoteView

Let’s continue with learning RemoteView.

A class that describes a view hierarchy that can be displayed in another process. The hierarchy is inflated from a layout resource file, and this class provides some basic operations for modifying the content of the inflated hierarchy.

RemoteView supports only these layouts:

RemoteView supports only these views:

If you use another view, RemoteView has no operation for the view.

Let’s add some codes to our widget class.

As we can see there is an override method onUpdate which is called every updatePeriodMillis has reached.

This example is basic and fast dive for the widget.

Understanding Override Methods

Before going to the next example, we need to understand widget classes that override the following methods.

  • onUpdate(): This is called to update the App Widget at intervals defined by the updatePeriodMillis attribute.
  • onAppWidgetOptionsChanged() : This is called when the widget is first placed and also whenever the widget is resized.
  • onDeleted(Context, int[]): This is called every time an App Widget is deleted from the App Widget host.
  • onEnabled(Context): This is called when an instance the App Widget is created for the first time.
  • onDisabled(Context): This is called when the last instance of your App Widget is deleted from the App Widget host.
  • onReceive(Context, Intent): This is called for every broadcast and before each of the above callback methods.

Confused? No problem. Below video shows you when these methods will calls.

Let’s see these fellas in action.

This knowledge gives you full control of on your widget.

Broadcast Widget

We have learned all steps of widget creation. We will not be repeating these steps.

Every click on the widget will send a broadcast and onReceive increases the counter.

In previous example we used .getActivity() , this time we are going to use .getBroadcast() .

BroadcastWidget is our widget class. Let’s see what is inside?

Using static fields with widgets is not recommended. But I am trying to make the example as simple as possible. You can use SharedPreferences instead of static fields.

Here is the result.

You can send whatever you want with broadcast and you can catch the broadcast wherever you want.

Configurable Widgets

Some widgets can be configurable at creation. In this example, we are getting a link from the user and whenever it’s clicked we open this link on the browser.

Create ConfigureActivity for user configuration.

The Basic layout for activity.

In activity’s onCreate method, the first thing we do is setting setResult(RESULT_CANCELED) . Why? Android triggers the configure activity that belongs to your widget and awaits result data. If the user did not configure as we expected, let’s say she pressed back button without entering a data, we don’t need to create a widget.

The last thing we do is modify the XML of the widget. With that modification, the Android Operating System will know this widget has configuration activity. So before creating the widget, it will trigger the activity.

As you notice we didn’t talk about widget class yet. We do not need to add any code for widget class because all actions done by ConfigurableWidgetConfigureActivity . But we have to create anyway.

Here is the result.

Updated By a Service Widget Example

This project will generate random numbers in every minute and displays it on a widget. First of all, we need a service to generate random numbers.

And we have to add this to AndroidManifest.

Service does not start by itself. We need to start the service(in every minute for this example).

But why we do not just use ‘ updatePeriodMillis ’?

If the device is asleep when it is time for an update (as defined by updatePeriodMillis ), then the device will wake up in order to perform the update. If you don’t update more than once per hour, this probably won’t cause significant problems for the battery life. If, however, you need to update more frequently and/or you do not need to update while the device is asleep, then you can instead perform updates based on an alarm that will not wake the device. To do so, set an alarm with an Intent that your AppWidgetProvider receives, using the AlarmManager . Set the alarm type to either ELAPSED_REALTIME or RTC , which will only deliver the alarm when the device is awake. Then set updatePeriodMillis to zero ( «0» ).

In Previous examples, we used .getActivity() and .getBroadcast() methods. This time we are going to use .getService() method.

The minimum interval time is 60000 millis for AlarmManager. If you need to call your service less than 60 sec with an alarm manager, there are some workarounds like this. But I have to warn you, this action drains the battery and makes users delete your app.

Here is the result. I cropped the video to not keep you wait 2 minutes.

Common questions / mistakes about Widgets

Question:

Programmatically update widget from activity or service

Answer:

Simple, you have to reach your widgets. Afterwards send broadcast that has information about your widgets. See the code below,

Читайте также:  Как снять скрин экрана андроид

Question:

Every widget instances not doing their job? or doing same job?

Answer:

PendingIntent operations(.getActivity, .getBroadcast etc.) need a parameter requestCode for identification.

You have to set the requestCode with your appW idgetId. With that way, your pending intent becomes unique. Every instance of your widget will use their PendingIntent.

More about Widgets

How the material design should be on widget?

Read further? Helpful links

If you made it at this far, personally thank you for reading. Here is the promised Github link includes whole projects in this article. And feel free for pull requests.

To help others to reach the article don’t forget to recommend 💚 . It means a lot to me.

Источник

Виджеты на Android. Редкая фича, в которой придется разобраться

Привет, Хабр! Меня зовут Александр Хакимов, я android-разработчик в компании FINCH.

У вас бывало такое, что ваш дизайн был под iOS, а вам приходится адаптировать его под android? Если да, то часто ли ваши дизайнеры используют виджеты? К сожалению, виджет — редкий кейс для многих разработчиков, потому что с ним редко кто работает,

В статье я подробно расскажу как создать виджет, на что стоит обратить внимание и поделюсь своим кейсом.

Создание виджета

Для создания виджета нужно знать:

  1. Особенности компонентов виджета.
  2. Особенности отображения виджета в сетке экрана.
  3. Особенности обновления виджета.

Разберем каждый пункт отдельно.

Особенности компонентов виджета

С этим пунктом знаком любой разработчик, который хоть раз работал с RemoteViews. Если вы из таких, смело переходите к следующему пункту.

RemoteViews предназначен для описания и управления иерархиями Views, которые принадлежат процессу другого приложения. С помощью управления иерархиями можно изменять свойства или вызывать методы, принадлежащие View, которое выступает частью другого приложения. В RemoteViews входит ограниченный набор компонентов стандартной библиотеки компонентов android.widget.

View внутри виджетов работают в отдельном процессе (как правило, это домашний экран), поэтому для изменения UI виджета используется расширение BroadcastReceiver — AppWidgetProvider, работающий в нашем приложении.

Особенности отображения виджета в «сетке» экрана

Each widget must define a minWidth and minHeight, indicating the minimum amount of space it should consume by default. When users add a widget to their Home screen, it will generally occupy more than the minimum width and height you specify. Android Home screens offer users a grid of available spaces into which they can place widgets and icons. This grid can vary by a device; for example, many handsets offer a 4×4 grid, and tablets can offer a larger, 8×7 grid.

Переводя на русский: каждый виджет должен задать свои минимальную ширину и высоту, чтобы обозначить минимальное пространство, которое будет им занято по умолчанию.


Пример настроек виджета при создании в Android Studio

Виджет, который добавили на на Home screen, обычно займет больше места чем минимальные ширина и высота экрана, которые вы задали. Android Home screens предоставляет пользователям сетку доступного пространств, в которых могут быть расположены виджеты и иконки. Эта сетка может отличаться в зависимости от устройства; например, многие телефоны предлагают сетку 4х4, а планшеты могут предложить большие сетки 8х7.

Из этого становится понятно, что сетка устройства может быть какой угодно, а размер ячеек может отличаться, в зависимости от размера сетки. Соответственно, контент виджета должен быть спроектирован с учетом этих особенностей.

Минимальные ширину и высоту виджета для заданного количества столбцов и строк можно вычислить по формуле:

minSideSizeDp = 70 × n − 30, где n —количество строк или столбцов

На текущий момент максимальный минимум сетки, которую вы можете задать это 4х4. Это гарантирует, что ваш виджет будет отображаться на всех девайсах.

Особенности обновления виджета

Так как AppWidgetProvider по своей сути является расширением BroadcastReceiver-а, с ним можно делать все то же самое, что и с обычным BroadcastReceiver. AppWidgetProvider просто парсит соответствующие поля из Intent, полученного в onReceive и вызывает методы перехвата с полученными extras.

Сложность возникла с частотой обновления контента — все дело в разнице внутренней работы виджетов на iOS и Android. Дело в том, что данные на iOS-виджетах обновляются тогда, когда виджет становится виден пользователю. В Android, такого события не существует. Мы не можем узнать, когда пользователь видит виджет.

Для виджетов на Android рекомендуемым способом обновления является обновление по таймеру. Настройки таймера задаются параметром виджета updatePeriodMillis. К сожалению, эта настройка не позволяет обновлять виджет чаще чем раз в 30 минут. Ниже я расскажу об этом подробнее.

Кейс создания виджета

Дальше речь пойдет о кейсе который был у нас в FINCH в крупном лотерейном приложении с приложением «Столото» для участия в государственных лотереях.

Задача приложения – упростить и сделать прозрачным для пользователя выбор лотереи и покупку билета. Поэтому требуемая функциональность виджета довольно проста: показывать пользователю рекомендуемые игры для покупки и по тапу переходить к соответствующей. Список игр определяется на сервере и регулярно обновляется.

В нашем кейсе дизайн виджета предусматривал два состояния:

  • Для авторизованного пользователя
  • Для неавторизованного пользователя

Авторизованному пользователю нужно показывать данные его профиля: состояние внутреннего кошелька, количество билетов ожидающих розыгрыша и сумму неполученных выигрышей. Для каждого из этих элементов предусмотрен, отличный от других, переход на экран внутри приложения.

Как вы могли заметить, еще одной особенностью для авторизованного пользователя является кнопка «обновить», но об этом позже.

Для реализации отображения двух состояний, с учетом дизайна, я использовал RemoteAdapter в виде реализации RemoteViewsService, чтобы генерировать карточки контента.

А теперь немного кода и того, как все работает внутри. Если у вас уже был опыт работы с виджетом, то вы знаете, что любое обновление данных виджета начинается с метода onUpdate:

Пишем апдейт для каждого инстанса нашего виджета.

Пишем реализацию нашего сервиса. В нем нам важно указать, какую реализацию интерфейса RemoteViewsService.RemoteViewsFactory использовать, чтобы генерировать контент.

Читайте также:  Квадратный радар cleo android

Фактически это тонкий wrapper над Adapter. Благодаря ему, мы можем связывать наши данные с remote collection view. RemoteViewsFactory предоставляет методы генерации RemoteViews для каждого элемента в наборе данных. У конструктора нет никаких требований — все что я делаю, это передаю в нем контекст.

Далее будет пару слов об основных методах:

  1. onCreate – создание адаптера.
  2. getLoadingView – метод предлагает возвращать View, которое система будет показывать вместо пунктов списка, пока они создаются. Если ничего здесь не создавать, то система использует некое дефолтное View.
  3. getViewAt – метод предлагает создать пункты списка. Здесь идет стандартное использование RemoteViews.
  4. onDataSetChanged вызывается, когда поступил запрос на обновление данных в списке. Т.е. в этом методе мы подготавливаем данные для списка. Метод заточен под выполнение тяжелого, долгого кода.
  5. onDestroy вызывается при удалении последнего списка, который использовал адаптер (один адаптер может использоваться несколькими списками).
  6. RemoteViewsFactory живет пока все инстансы списка живы, поэтому мы можем хранить в нем текущие данные, например, список текущих айтемов.

Определяем список данных, который будем показывать:

При создании адаптера начинаем загружать данные. Здесь спокойно можно выполнять любые тяжелые задачи, в том числе спокойно ходить в сеть блокируя поток.

При вызове команды на обновление данных, так же вызываем updateDataSync()

Внутри updateDataSync тоже все просто. Очищаем текущий список item-ов. Загружаем данные профиля и игры.

Здесь уже поинтереснее

Так как нам важно показывать профиль только авторизованному пользователю, то и информацию профиля нам нужно загружать только в этом случае:

Модель WidgetProfile собирается из разных источников, поэтому логика их получения и её дефолтные значения устроены таким образом, что отрицательное значение кошелька говорит о некорректных данных или проблемах с их получением.

Для бизнес логики отсутствие данных кошелька является критичным, поэтому, в случае некорректного кошелька, модель профиля не будет создана и добавлена в список item-ов.

Метод updateGamesSync() использует getWidgetGamesInteractor и добавляет в список widgetItems набор актуальных для виджета игр.

Прежде чем перейти к генерации карточек, рассмотрим подробнее модель WidgetItem. Она реализована через kotlin sealed class, что делает модель более гибкой, а работу с ней более удобной.

Создаем RemoteViews и определяем их отклик через FillInIntent

Метод setOnClickFillInIntent назначает указанной viewId intent, который будет объединен с родительским PendingIntent для определения поведения при клике на view с этим viewId. Таким образом, мы сможем реагировать на клики пользователей в нашем WidgetProvider.

Ручное обновление виджета

Для нашего виджета было установлено время обновления в полчаса. Можно обновлять его чаще, например, через танцы с WorkManager, но зачем грузить вашу сеть и аккумулятор? Такое поведение на первых этапах разработки казалось адекватным.

Все изменилось когда «бизнес» обратил внимание, что когда пользователь смотрит на виджет, на нем отображаются неактуальные данные: «Вот на моем iPhone, я открываю виджет и там САМЫЕ свежие данные моего профиля».

Ситуация банальна: iOS генерирует новые карточки при КАЖДОМ показе виджетов, ведь для этого у них отведен специальный экран, а Android не имеет подобных событий для виджета в принципе. Пришлось учесть, что некоторые лотереи проводятся раз в 15 минут, поэтому виджет должен давать актуальную информацию – ты хочешь поучаствовать в каком-то тираже, а он уже прошел.

Чтобы выйти из этой неприятной ситуации и как то решить проблему с обновлением данных, мной было предложено и реализовано проверенное временем решение — кнопка «обновить».

Добавляем эту кнопку в макет layout-a со списком и инициализируем её поведение при вызове updateWidget

Первые наработки показали грустную картину: от нажатия на кнопку «обновить» до фактического обновления, могло пройти несколько секунд. Хотя виджет и генерируется нашим приложением, он фактически находится во власти системы и общается с нашим приложением через broadcast-ы.

Т.е. при нажатии на кнопку «обновить» нашего виджета запускается цепочка:

  1. Получить Intent в onReceive провайдера action’ .
  2. AppWidgetManager.ACTION_APPWIDGET_UPDATE.
  3. Вызов onUpdate для всех указанных в intent-e widgetIds.
  4. Зайти в сеть за новыми данными.
  5. Обновить локальные данные и отобразить новые карточки списка.

В результате, обновление виджета выглядело не очень красиво, так как нажав на кнопку, мы пару секунд смотрели на тот же виджет. Было непонятно обновились ли данные. Как решить проблему визуального отклика?

Во-первых, я добавил флаг isWidgetLoading с глобальным доступом через интерактор. Роль этого параметра довольно проста — не показывать кнопку «обновить», пока идет загрузка данных виджета.

Во вторых, процесс загрузки данных в фабрике я разделил на три этапа:

START — начало загрузки. На этом этапе состояние всех вьюшек адаптера и глобального флага загрузки меняется на «загружается».

MIDDLE — этап основной загрузки данных. После их загрузки глобальный флаг загрузки переводится в состояние «загружено», а в адаптере отображаются загруженные данные.

END — конец загрузки. Адаптеру на этом шаге не требуется изменять данные адаптера. Этот шаг нужен чтобы корректно обработать этап обновления вьюшек в WidgetProvider.

Давайте посмотрим подробнее как теперь выглядит обновление кнопки в провайдере:

А теперь посмотрим на то, что происходит в адаптере:

  1. В конце этапов START и MIDDLE я вызываю метод updateWidgets для того, чтобы обновить состояние view управляемых провайдером.
  2. После выполнения шага START для пользователя визуально отображается «загрузка» в ячейках виджета, и начнется этап MIDDLE.
  3. Перед тем как вызвать обновление данных адаптера на шаге MIDDLE, провайдер скроет кнопку «обновить».
  4. После выполнения шага MIDDLE, для пользователя будет отображаются новые данные и начнется этап END.
  5. Перед тем как вызвать обновление данных адаптера, на шаге END, провайдер скроет кнопку «обновить». С точки зрения фабрики все данные будут актуальными, поэтому на шаге END меняем значение loadingStep на START.

С помощью подобной реализации я достиг компромисс между требованием «бизнеса» видеть на виджете актуальные данные и необходимостью «дергать» обновление слишком часто.

Надеюсь, что статья была для вас полезной. Если у вас был опыт создания виджетов для Android, то расскажите об этом в комментариях.

Источник

Оцените статью