Программируем приложение Pikabu для Android (Часть 5, Дизайн)⁠⁠

Привет, пикабушник!

Предыдущие части рассказа ищи в моем профиле.

А я напомню, что мы программируем мобильное приложение для просмотра ресурса Pikabu. 

ДОМОХОЗЯКИ, ВНИМАНИЕ! РАССКАЗЫВАЮ МНОГО НЕПОНЯТНОГО ВЕЩЕЙ! 

Итак, сегодня займемся дизайном. 

Хоть я и не являюсь пользователем с суперсовременной версией ОС Ведроид на телефоне, у приложения должны быть хоть какие то отсылки на стиль. Недаром же анонсировали плоский дизайн, кнопки и сиськи. 

Сегодня мы будем максимально возможно внедрять Material Design в свое приложение, попутно я расскажу какие фичи заменяют устаревшие, и что они дополнительно требуют.

1) ЦВЕТ

Если судить гайдлайнам от Гугл Инкорпорэйтед Энд Лимитед, для различных экранов программы можно (и нужно) задавать различные цветовые палитры, комбинируя их в различных вариациях. Окей. Нарисуем для каждого экрана свою палитру. Открываем стили:

Как можно судить по картинке, у каждого стиля появились собственные цвета. Например, Главный экран приложения теперь использует палитру Green, активность с настройками Purple, и так далее. Выглядят палитры следующим образом:

Это пример стандартной цветовой палитры.

Что из этого надо уяснить? Теперь, для ActionBar рекомендуют использовать производный цвет (например DeepPurple 500, а для статус бара брать цвет из той же палитры, но на 1-2 оттенка глубже (DeepPurple 600-700). Хорошо, мы так и сделали, смотрим.

Хорошо, начало положено. Идем дальше.

2) ВЫЕЗЖАЮЩИЙ СПИСОК

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

Она упрощает навигацию по приложению (если много пунктов и подпуктов) и обычно используется на стартовом экране. Я до последнего буду против добавления этой фичи, так как в нашем приложении она почти не нужна. Но, так как в современном маркете нужно соответствовать стандартам, будем делать. Пилим:

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

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

Красиво? Красиво. Пригодится ли это в нашем приложении? Время покажет. Двигаемся дальше.

3) НАСЛЕДОВАНИЕ АКТИВНОСТЕЙ

Давайте сперва разберемся, что это за наследование, и для чего оно призвано. 

Как сказано (в тех же гайдлайнах), каждая активность, которая взаимодействует с другой, должна быть четко упорядочена (это касается стека, и распределения в целом). Вторая активность наследуется от Первой, Третья от Второй и так далее. Это добавляет логику в приложение, и возможность настраивать дополнительные возможности в программе. Пример:

Представим, что это наша первая активность. Она чем то похожа (только тут какая то херня), и из этой активности можно переходить куда то еще.

Это вторая активность. Она наследуется от первой (обратите внимание на появление стрелочки), и если логически предположить, то нам надо нажать на стрелку назад, чтобы выйти обратно. 

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

В нашей активности мы изменили представление некоторых элементов (появился toolbar), и добавили одну строчку кода:

setDisplayHomeAsUpEnabled - этот метод как раз и позволяет выводить в баре заветную стрелку, но чтобы она заработала, надо унаследовать активность в главном файле приложения - манифесте:

Два условия в meta-data как раз указывают, откуда эта активность наследуется. Все, остальное компилятор сделает за нас.

Нам лишь остается повторить эту процедуру для всех активностей, которые у нас есть, и мы тоже получим такой же результат:

4) УВЕДОМЛЕНИЯ

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

Теперь им на смену приходят снекбары:

Это такие же уведомления, они прилеплены к одному из слоев, и отображают небольшое информативное сообщение.

Что из плюсов?

- Можно закрыть такое уведомление, смахнув пальцем слева-направо

- Можно добавить дополнительные кнопки

С кнопками будет выглядеть как то так:

Из минусов - такие уведомления пока нельзя запихивать во все места сразу (из за их привязки). Но думаю это поправят со временем.

Пока на данном этапе были заменены все доступные уведомления на новые снекбары. Можете оценить их удобство.

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

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

https://play.google.com/store/apps/details?id=xyz.oneclickst...

http://4pda.ru/forum/index.php?showtopic=720038

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

Спасибо, за то что дочитал до конца, всем бобра =)