Программируем мобильный справочник (Часть 1, Макеты)⁠⁠

Привет, пипл!

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

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

- Каталог мест и услуг

- Карта (может кто заблудился)

- Расписание общественного транспорта

- Погодный виджет (кто вообще не в теме)

- По ходу программирования можно добавить еще полезняшек, кто что предложит

Начинать будем с макетов, и понимания того, как приложение должно функционировать. Поехали!

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

Для этого я подготовил небольшую зарисовочку:

На картинке накалякано нарисовано четыре экрана (заставка не в счет). Коротко о каждом.

Главный экран - Собственно он на то и главный. В нем будет присутствовать:

1) Информация о погоде

2) Кнопка (для перехода в каталог как я планирую)

3) Небольшой бокс (что то типа часто используемых ссылок)

4) Еще один бокс для рекомендованных приложений (например, чтобы посмотреть какое то место на карте, понадобится приложение карты)

Плюс я добавляю стандартные инструменты (выезжающее меню Navigation Drawer) + графические элементы из Android 5.0 (Collapsing Layout + Coordinator Layout)

Чтобы вы имели представление этих непонятных букв - вот вам пример Collapsing Layout + Coordinator Layout:

Теперь рисуем на нашем устройстве:

После написания огромного количества букв (описывать не буду этот ужас) у нас появились почти все элементы. Но так как для них не написан код, это будет просто пустое пространство.

При запуске активности изображение полностью развернуто:

Обычным жестом вверх меню сворачивается, и заменяется стандартным цветом.

Далее. Экран категорий. Чтобы объяснить на языке домохозяек максимально просто, наши категории - это список, со вложенными изображениями + текст. 

А оригинальное название - CardView. Фишка добавлена также из Android 5.0, так что наша программка будет моднячей изначально. Смотрим пример из гайдов:

Теперь пишем для нашей программы. 

Medium Text в дальнейшем будет заменятся на название категории, картинка - соответственно тоже.

Теперь категория. 

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

К примеру, в категории Развлечения возможен вложенный список из ресторанов, кафе и кинотеатров. 

На этом экране точно также реализуется метод Collapsing Layout, но картинка будет втрое уже. Пример такого слоя:

И наш экран. Кода очень мало, поэтому сразу покажу что получилось:

И наконец последний экран - Описание. В него будут загружаться данные, которые будут поступать из того пункта меню, на который вы нажмете. 

Например - для кафе "Черный раб" надо загрузить номер телефона, адрес, координаты с карт, плюс какое нибудь описание. Может, отзывы.

Но этот экран я показывать вам не буду, так как без данных он будет абсолютно пустым. Так что пока смотреть там нечего.

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

Спасибо тем, кто выдержал и дочитал! Пока без ссылок на программку (что вы там делать будете..). Предлагайте интересные моменты, выносите объективную критику.