Создание виджета для рабочего стола

AppWidget, или просто «виджет» — один из самых эффектных и удобных элементов пользовательского интерфейса в операционной системе Android, который можно добавить на рабочий стол для быстрого доступа к тем или иным функциям соответствующего приложения. В данной статье мы разберемся, как собственноручно создать свой виджет.

Что виджет представляет из себя конструктивно? Виджет нужен для отображения той или иной информации, связанной с приложением, к которому он относится, или же для оперативного взаимодействия с данным приложением напрямую через рабочий стол. Самый простой пример – часы на рабочем столе. Естественно, виджеты без труда можно добавлять или удалять с рабочих столов.

Качественно выполненные виджеты заметно оптимизируют взаимодействие с устройством. Более того, очень часто самые удобные виджеты занимают на рабочем столе минимум пространства, и при этом наиболее информативны. Практически любой пользователь будет стараться разместить на рабочих столах своего Android-гаджета максимальное количество информации, и важный момент заключается в том, что пространство ограничено.

Начнем создание виджета мы с дизайна. Благо, компания Google предоставила весьма полезные UI Guidelines для разработчиков программного обеспечения, где подробно описан процесс создания дизайна и основные принципы эргономичности. Есть также и отдельная официальная инструкция для создания виджетов, с которой можно ознакомиться по ссылке: //developer.android.com/guide/practices/ui_guidelines/widget_design.html.

Виджет, занимающий одну «клетку» на рабочем столе, имеет разрешение 80х100 точек, соответственно, для создания продолговатый виджет длиной в 4 клетки и высотой в одну, то нужно, соответственно, 320х100 пикселей. Такой размер мы и возьмем за основу создаваемого нами виджета.

Теперь виджет нужно нарисовать. В принципе, виджет вполне может и не иметь никакой графической части, и отображать только текст или элементы управления, без фона и рамки, но, естественно, красивый и приятный глазу виджет просто обязан иметь качественный дизайн. Поэтому нарисуем фон. За основу возьмем фон из упомянутого выше UI Guideline. Открываем доступную нам заготовку в Photoshop или другом графическом редакторе и делаем всё, что заблагорассудится, после чего сохраняем полученное изображение в формате .png. Нужный нам формат PNG-24, с 8-битным цветом и прозрачным фоном. Вот и готова основа для нашего виджета.

Теперь перейдем к созданию программной части. Виджет может не иметь программной части. Проще говоря, в меню добавления виджетов он будет, но в основном меню приложений – нет. Мы создадим виджет именно такого типа. Создаем новый проект, и называем его для удобства так, чтобы основной класс имел имя widget.java.

Редактируем AndroidManifest.xml. Объявляем наш виджет:

            <?xml version=»1.0″ encoding=»utf-8″?>

<manifest xmlns:android=»//schemas.android.com/apk/res/android»

      package=»com.example.widget»

      android:versionCode=»1″

      android:versionName=»1.0″>

    <application android:icon=»@drawable/icon» android:label=»@string/app_name»>

        <receiver android:name=»widget» >

                            <intent-filter>

                                <action android:name=»android.appwidget.action.APPWIDGET_UPDATE» />

                            </intent-filter>

                            <meta-data android:name=»android.appwidget.provider»

                                       android:resource=»@xml/widget_info» />

            </receiver>

    </application>

</manifest> 

            Теперь редактируем widget.java. Тут необходимо описать, как будет реагировать виджет на различные условия. Класс AppWidgetProvider имеет такие методы:

onUpdate – метод вызывается при создании виджета, а также по истечении заданного времени. Время задается в конфигурационном файле данного виджета. Отметим, что используется чаще всего.

onDeleted – метод выполняется при удалении виджета с рабочего стола.

onEnabled – метод вызывается при первой активации виджета. Но если добавляется еще один точно такой же виджет, данный метод уже не выполняется.

onDisabled – метод выполняется тогда, когда удаляется последняя копия виджета с рабочего стола. Соответственно, данный метод является обратным onEnabled.

onReceive – метод вызывается одновременно со всеми остальными. Зачастую не используется вообще.

Сильно углубляться в программную часть виджета мы не будем, а потому не будем переполнять наш пример какими-либо обработчиками, а просто реализуем весь функционал посредством Layouts. Необходимо следующим образом объявить класс AppWidgetProvider:

            package com.example.widget; 

import android.appwidget.AppWidgetProvider; 

public class widget extends AppWidgetProvider{ 

} 

Далее, описываем наш виджет – это нужно для того, чтобы мобильный аппарат понимал, с чем имеет дело. Для этого нужно создать папку xml в папке res. В ней создаем файл с именем widget_info.xml. Открываем созданный файл и прописываем в него вот такой код:

            <?xml version=»1.0″ encoding=»UTF-8″?>

<appwidget-provider xmlns:android=»//schemas.android.com/apk/res/android»

    android:minWidth=»294dp»

    android:minHeight=»72dp»

    android:updatePeriodMillis=»0″

    android:initialLayout=»@layout/widget»>

</appwidget-provider> 

Приведем краткое описание заданных параметров:

minWidth – минимальная необходимая для работы виджета ширина.

minHeight – минимальная необходимая для работы виджета высота.

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

initialLayout – параметр указывает на ресурс с описанием интерфейса нашего виджета.

Формула подсчета размеров виджета имеет такой вид: (количество клеток * 74) — 2.

Приступим к описанию интерфейса создаваемого нами виджета. Здесь-то нам и пригодится созданный ранее фон. Импортируем рисунок фона в папку dwawable (или во всех три папки drawable для разных разрешений экрана). В папке layout создаем файл с именем widget.xml. Интерфейс описывается как для обычных Activity, но есть некоторые ограничения. Допустимы для использования такие элементы:

LinearLayout

FrameLayout

RelativeLayout

AnalogClock

Button

Chronometer

ImageButton

ImageView

ProgressBar

TextView

Создадим LinearLayout, к которому применим созданную картинку-фон и добавим для примера AnalogClock. Сами часы в рамку не влезут, но как наглядный пример вполне сгодятся. Итак:

<?xml version=»1.0″ encoding=»utf-8″?>

<LinearLayout xmlns:android=»//schemas.android.com/apk/res/android»

            android:id=»@+id/Widget»

    android:layout_width=»fill_parent»

    android:layout_height=»fill_parent»

    android:orientation=»horizontal»

    android:gravity=»center_vertical»

    android:background=»@drawable/frame»> 

     <AnalogClock

        android:layout_width=»fill_parent»

        android:layout_height=»wrap_content»/> 

</LinearLayout> 

Вот, в принципе, и всё. После установки виджета на Android-девайс или на эмулятор, его можно установить на один из рабочих столов. После добавления будем созерцать следующее: