Программируем мобильный справочник (Часть 1, Макеты)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, но картинка будет втрое уже. Пример такого слоя:
И наш экран. Кода очень мало, поэтому сразу покажу что получилось:
И наконец последний экран - Описание. В него будут загружаться данные, которые будут поступать из того пункта меню, на который вы нажмете.
Например - для кафе "Черный раб" надо загрузить номер телефона, адрес, координаты с карт, плюс какое нибудь описание. Может, отзывы.
Но этот экран я показывать вам не буду, так как без данных он будет абсолютно пустым. Так что пока смотреть там нечего.
Все это мы с вами будем рассматривать во второй части нашего разговора - Наполнение. Тогда же и узнаем, какой город будет опубликован в первую очередь.
Спасибо тем, кто выдержал и дочитал! Пока без ссылок на программку (что вы там делать будете..). Предлагайте интересные моменты, выносите объективную критику.