1) Создание
2) Дополнительное
3) Базовый класс
4) Запуск
5) Парсинг
6) Обработка нажатий
В данной статье поговорим о создании виджетов на платформе Android.
Виджет, это достаточно удобная вещь, позволяющая не запуская основную программу, выводить необходимую информацию прямо на рабочем столе.
Что касается создания собственного виджета, то это очень просто.
Создание
Для начал придумаем идею виджета, что он будет содержать и как размещать элементы. В принципе по первой картинке можно догадаться, что будем создавать виджет собирающий информацию о стоимости крипто-монеты Bitcoin.
1. Создадим пустой проект и назовем его например CrypBTC.
2. Создадим в папке с макетами(res/layout), макет самого виджета, и назовем его widget.
3. В папке drawable (res/drawable), создаем drawable resource file и называем его back_widg.
4. В файле back_widg прописываем задний фон виджета, чтобы он выглядел стильно.
5. Теперь вернемся к созданному макету widget, и перейдя в режим редактирования страницы через код (кнопка "Code"), меняем нынешний шаблон разметки, на RelativeLayout. Так же добавив пару новых параметров.
6. В режиме Design, добавим кнопку и текстовое поле.
Для кнопки, указываем layout_width - 120dp, layout_height - 35dp, layout_alignParentStart - true, layout_alignParentEnd - true, textColor - @color/white, textSize - 10sp, а текст - "Обновить".
Для текстового поля, указываем layout_height и layout_width - match_parent, gravity - center, textSize - 20sp, textColor - @color/white, marginTop - 2dp, layout_below - @+id/button.
7. Создадим дизайн кнопки, для этого создадим в папке drawable (res/drawable), drawable resource file и называем его btn_back.
8. В созданном файле напишем немного кода.
9. Теперь для кнопки в файле widget, укажем background - @drawable/btn_back.
Дополнительное
Для того чтобы указать нашему приложению наличие в нем виджета, создадим метаданные.
1. В папке res/xml, создадим "XML Resource File" и назовем его widget_metadata.
2. Пропишем код (кнопка Code) в созданном файле widget_metadata.
Базовый класс
1. Теперь создадим JavaClass, для работы с виджетом, и назовем его Widget. Напишем небольшой код.
public class Widget extends AppWidgetProvider {
final String LOG_TAG = "myLog";
@Override
public void onEnabled(Context context) {
super.onEnabled(context);
Log.d(LOG_TAG, "onEnabled");
}
@Override
public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {
super.onUpdate(context, appWidgetManager, appWidgetIds);
Log.d(LOG_TAG, "onUpdate " + Arrays.toString(appWidgetIds));
}
@Override
public void onDeleted(Context context, int[] appWidgetIds) {
super.onDeleted(context, appWidgetIds);
Log.d(LOG_TAG, "onDeleted " + Arrays.toString(appWidgetIds));
}
@Override
public void onDisabled(Context context) {
super.onDisabled(context);
Log.d(LOG_TAG, "onDisabled");
}
}
2. Переходим в файл AndroidManifest и дописываем пару строчек кода.
Параметр name - указывает на JavaClass виджета, icon - можно указывать иконку виджета, label - указываем название виджета.
Запуск
Теперь можно посмотреть что получилось. Билдим проект, устанавливаем на телефон или на виртуальную машину и запускаем.
Так же если посмотреть в консоль, то там видны вызываемые функции которые мы указывали в Log.d.
Парсинг
Теперь переходим к парсингу сайта, для того чтобы брать непосредственно с сайта, курс монеты.
Для парсинга нам потребуется библиотека Jsoup.
1. Открываем структуру проекта, переходим на вкладку Dependencies и добавляем библиотеку (Library Dependency). Вводим в поле поиска org.Jsoup и добавляем библиотеку.
2. Переходим в класс с виджетом (Widget), и прописываем переменные. (URL = https://myfin.by/crypto-rates/bitcoin-usd)
3. Создадим функцию создания потока для парсинга. Здесь довольно просто. При вызове функции init(), мы передаем в нее Context который мы получаем выше, далее в переменную runable присваиваем новый экземпляр класса Runnable, в котором мы вызываем функцию getPars() для парсинга.
Ниже мы проверяем есть ли у нас уже созданный поток, если же нет то попросту создаем его передавая runable и запуская его.
4. Создадим функцию getPars(). Весь парсинг выполняется непосредственно тут. Вызывая функцию Jsoup.connect(), мы создаем соединение к сайту указанному в переменной. Функция get() у модуля Jsoup, отвечает за получения страницы.
5. Переходим на сайт, который я указал в переменной https://myfin.by/crypto-rates/bitcoin-usd . В нем включаем режим просмотра кода. Теперь смотрим название блока и класса, который отвечает за вывод курса. В данном сайте за вывод отвечает блок div с классом birzha_info_head_rates.
6. Указываем новую переменную в которую мы получаем все элементы с классом birzha_info_head_rates.
В переменную elem мы получим список элементов, который в дальнейшем мы сможет вывести.
7. Можем проверить количество полученных элементов, и вывести первый из них.
8. В файле AndroidManifest добавим permission, доступ в Интернет.
9. Теперь мы можем вызвать функцию init() в любой из части кода, например при создании виджета (onEnabled())
10. Запускаем и проверяем работоспособность. Теперь когда мы только создаем на рабочем столе виджет, мы парсим сайт и выводим параметры в консоль.
Обработка нажатий
Теперь напишем код, который позволит нам при нажатии на кнопку виджета обновлять данные и выводить их.
1. Напишем функцию getintent, с помощью которой мы сможем задавать действия, передав в нее контекст виджета и название действия.
2. Теперь добавим немного строчек кода в функцию onEnabled(). Так же, не забываем создать переменную SYNC_CLICKED.
Элемент RemoteViews , позволяет взаимодействовать с элементами через контекст переданный ему. В ComponentName мы попросту передаем контекст и экземпляр класса нашего виджета. Функция setOnClickPendingIntent у элемента RemoteViews позволяет назначить действие при нажатии. А функция updateAppWidget позволяет обновить все элементы виджета.
3. Необходимо создать функцию onReceive(), для обработки наших действий.
Тут довольно просто, если действие которое мы хотим сделать совпадает с назначенным, то попросту выполняем ниже код. (функцию init() мы создавали выше для парсинга сайта).
4. Стоит добавить в функцию getPars() элементы которые смогут менять текст в виджете.
Теперь появилась еще одна функция в RemoteViews, setTextViewText, которая позволяет вставить текст в TextView.
5. Собираем и запускаем проект. Уаля! Теперь при создании виджета и нажатия на кнопку будет выводится курс BTC.