Navigation Drawer Activity в Android Studio — структура шаблона, пример | Дизайн андроид приложений

Автор Alla Bessonova
Navigation Drawer Activity в Android Studio — структура шаблона, пример | Дизайн андроид приложений

я.

Приветствую всех на канале startandroid здесь. Виталий непочатов и сегодня очередной урок по дизайну android-приложений мы продолжаем рассматривать готовые шаблоны проекта добавленная в Android Studio после обновления до версии 1.4 и сегодня мы рассмотрим шаблон Navigation drawer Activity — это шаблон в который встроена панель навигации синдрово мы создадим проект его помощью рассмотрим его структуру и создадим простой пример работы с панелью навигации и так в Android студии при создании нового выбираем шаблон Navigation drawer Activity Park Way Out проекта видео макетов — это Activity Main макет главного экрана в котором мы видим всю структуру навигейшн драйвера посмотрим код в текстовом виде здесь мы видим корневой drawerlayout из библиотеки поддержки support V4 видим здесь component include стул баром и component Navigation View — это и есть Navigation drawer или панель навигации далее перейдем к макету, а бармен в нём корневой элемент — это координатор layout и поддержки дизайна дочерними элементами которого являются оборзел со встроенным табором, а также здесь мы видим Floating Action Button плавающую кнопку 3 Way Out макет контент Main xml мы рассматривать не будем там нет ничего сложного макет экрана с корневым релятивная утром и текстом Hello World 4 макет — это нам header Main — это хейтер панели навигации земленыр. Я тут, а также здесь имеется живу и два textview в качестве background.

А здесь установлен xml файл с описанием градиента и текстом.

Я думаю всё понятно. Это изображение и подписи которая обычно отображается v-navigation-drawer. Давайте теперь посмотрим код mainactivity греет у нас инициализируется компоненты такие коктейль-бар Floating Action Button drawerlayout, а также actionbardrawertoggle который реализует слушатель состояние Navigation drawer открытое и закрытое состояние также здесь есть navigationview который реализует слушатель нажатии пунктов новейшие драйвера самое интересное здесь метод. Для нас — это метод он навигейшн selected здесь с помощью конструкции If else можно установить действие на нажатие пунктов меню навигейшн товара определяются нажатая пункты меню по котором. Давайте посмотрим куда они ведут нажимаем клавишу Control и выбираем любой идентификатор и попадаем файл ресурсов minidriver находится он в папке меню и здесь мы видим описание всех элементов списка навигейшн драйвера — это все пункты навигейшн товара они обозначены здесь тегами айтом и. Каждый атом содержит идентификатор, а также ссылку на и заголовок заголовки здесь прописан и просто текстом. Давайте создадим строковые константы для заголовков они нам пригодятся в будущем чтобы создать строковый ресурс достаточно стать на само слово и нажать комбинацию Alt Enter открывается диалог экстракт ресурс. Где мой прописываем имя для стокового ресурса теперь для того чтобы создать нам работающий пример предложения с навигейшн дрова нам нужно реализовать переход по пунктам меню куда бы то ни было то есть открытые каких-то окон используя для этого фрагменты для этого мы создадим несколько фрагментов по количеству пунктов в меню в. Норвегии шатавари и просто для демонстрации в каждом фрагменте пропишем текст аналогичные соответствующего пункта v-navigation-drawer. Для этого нам и нужны были строковые ресурсы здесь главным пакете нашего проекта создадим пэкидж фрагмент из в нём несколько фрагментов название каждого фрагмента у нас будет начинаться со слова фрагмент и дальше будет идти название пункта списка при создание фрагментов также создаются и файлы макетов для них в них уже есть компонент текст в котором мы меняем ссылку на строковый ресурс, а также увеличить текста. Да лучше читабельности и так. Мы создали 6 фрагментов по количеству пунктов списка Navigation drawer. А теперь переходим Class mainactivity и в методе он клеит инициализируем все фрагменты поскольку фрагменты у нас будут отображаться в mainactivity. При этом они прозрачны тут который содержится у нас в компоненте textview макета контент. Мейкер — это текст хелд будет сквозь фрагмент таким образом будет эффект наложения текста. Давайте удалим тексту из макета главного Activity также здесь. Нам нужен контейнер для фрагментов контейнером может быть любой файл компоновки. Но больше всего для этого подходит фрейму. Я давайте преобразуем корневой layout File Content Main и добавим ему идентификатор контейнер теперь в mainactivity в методе он навигейшн item selected создаем объект класса fragmenttransaction который будет вставлять наши фрагмента в активити и заменять их друг другом с помощью метода replace более подробно о работе с фрагментами вы посмотреть по ссылке которую вы видите на экране или можете найти в описании к видео методу replace на вход мы. Передаем идентификатор контейнера фрагмента которые нужно вставить в этот контейнер. Так здесь у нас метод replace не видит фрагмент поскольку в методе он клеит моих инициализированы, но не объявил их на уровне класса. Давайте исправим эту ошибку. Теперь всё в порядке записываем нашу конструкцию ефлс для того чтобы наши фрагменты отображались в конце нам нужно добавить метод commit. Давайте теперь. Запусти приложение и посмотрим как оно работает наше приложение стартовала открываем Navigation drawer. Давайте попробуем выбрать один из пунктов приложение выпадает с ошибкой. Давайте посмотрим в консоли, что — это за ошибка выберем уровень.

0 комментариев
0

Читайте также