Toolbar android studio fragment

Fragment Toolbar.

Manage it better.

Introduction

Since I started work commercially I met an opinion that working with Fragments is not always intuitive, at least not as much as working with Activities. Especially after watching this video your mindset in context of Fragments might change significantly. Complicated lifecycle, hard management will not change the way of thinking about it.

Few weeks ago I had to deal with really big thing. I’ve moved big app built in 95% on Activities to Fragments. I was very long way, very hard one. I’ve learnt a lot, so wanted to share this knowledge with you.

Toolbar for Fragment. What is wrong with it ?

Let’s assume that we have only one Activity with bottom navigation and the rest of views are Fragments. Normally on every Fragment change toolbar is set as supportActionBar which gives you possibilities to use methods to create, prepare, manage toolbar options menu. It looks simple, doesn’t it?
But it also creates some problems:

  • Before creating new toolbar on another Fragment you need to clear the old one.
  • If you are clearing it, indeed you are losing state and all data.
  • When you are going back to previous Fragments you have to recreate whole action bar.

As you can see it is a very inconvenient process, hard to maintain and generates a lot of boilerplate code. Especially if you are using searchView all those disadvantages mentioned above are unacceptable.

What is the solution ?

Assuming that we have few types of toolbar in app, you can build it using Builder Pattern and handle all cases in one place. All work comes down to choosing options for your Toolbar.

Starting point is to select one of two possible solutions. First one suggests to create one Toolbar and add it from code to your views. The second, which I have chosen is to implement toolbar in every Fragment’s .xml file. Basically, it was much easier for me because it was already done (refactoring code from Activities), so code below will match the second option.

Lets create FragmentToolbar Builder which contains all options we need in our app. I’m using Kotlin to achieve it, but my Fragments are still in Java, so I had to use implementation readable for Java.

Nothing revealing, let’s add those options to our toolbar.

Create BaseFragment which will be inherited by every Fragment.

Finally we are prepared to create Toolbars for our Fragments! Now every Fragment must specify which options will be used or if the Toolbar should even exist. Following the simple example:

To more complex:

Summary

Everyone knows how much time we spend on adding menu options and how many lines in code we need to write or copy/paste. This solution saves your time and keeps code clean. No need to set toolbar as supportActionBar. You don’t have to worry about keeping state and data for menu when Fragment changes (it lives as long as your Fragment). To sum up, management is as simple as possible and fragmentManager backstack changes (adding / removing Fragments) has no effect on toolbar at all.

Читайте также:  Перехват данных wifi для андроид

Personally I feel better when I’m dealing with Activities. Working with Fragments pushed me to simplify this process. So when you’ll be in the same situation — don’t fight with it, just do it by your own.

If you like my work hit clap button and let me know what you think in comments!

Источник

Создание ToolBar в Fragment

Создаю активити на нем фрагмент, а в фрагменте должен быть ToolBar! Но его нет! Делаю так

высоту/ширену задаю в стилях !

Вроде все так! Может что-то пропустил? Подскажите в чем ошибка моя !! Спасибо!

Обновление fragment из другого fragment
Добрый вечер всем!! Подскажите пожалуйста как обновить один фрагмент из другого (а именно TextView.

Создание Toolbar’ а
Необходимо создать Toolbar с 3-я кнопками, по нажатию которых будут вызваны диалоги: a) открытие.

Создание Toolbar
Привет! Столкнулся с проблемой, нужно сделать Toolbar ( как VS Windows Form или QT creator).

Создание Toolbar
Нужно из имеющего изображения кнопок создать панель инструментов. Делаю все, как описано на MSDN.

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

если нужно делать свое меню для каждого фрагмента то можно почитать тут

Решение

Создание ToolBar: CreateToolbarEx()
Здравствуйте! Не получается создать ToolBar. На мой взгляд все правильно, но вылазит ошибка .

Создание кнопок на ToolBar-е
Создаю Win32 Application, в оконной процедуре главного окна пишу (WM_CREATE): DWORD dwStyle;.

Создание toolbar для ie 6+ на C#
Необходимо создать с 0 toolbar для ie 6++ на c#. Был бы благодарен за любую информацию, литературу.

Динамическая форма — Создание ToolBar
Доброго времени суток, Уважаемые спецы! Столкнулся с необходимостью создания нового ToolBar в окне.

Источник

Material Design. Динамический Toolbar на живом примере

Уверен, что те, кто следят за изменениями в мире Android, заметили, что Toolbar начинает играть в приложениях всё более значимую роль. Например в последней версии Gmail клиента в Toolbar вынесен почти весь функционал по работе с почтой, а в новом Google Chrome Toolbar отвечает за работу с текстом страниц.

В данной статье я постараюсь рассказать о создании динамического Toolbar, который позволит пользователю работать с контентом четырьмя различными способами в рамках одного Activity. Мы рассмотрим весь процесс разработки Toolbar-a начиная с xml файлов стилей и заканчивая анимацией иконок, а в конце статьи я оставлю ссылку на GitHub репозиторий с примером полностью рабочего приложения.

Начнём с постановки задачи

Мы будем разрабатывать Toolbar для приложения, которое позволит пользователю следить за изменениями цен на акции. На главном экране будет расположен список всех акций, за которыми следит пользователь, мы также должны реализовать базовый функционал: удаление, поиск и сортировку акций. Вот так я реализовал этот функционал с помощью динамического Toolbar-a:

Стандартный режим Режим поиска Режим удаления Режим сортировки

Создаём xml файлы конфигураций

Итак, в первую очередь нам нужно создать xml файл самого Toolbar-a. Я советую сделать это в отдельном файле, так как в будущем мы скорее всего захотим использовать один и тот же (или похожий) Toolbar во всех Activity нашего приложения.

Теперь мы можем добавить toolbar.xml в xml Activity следующим образом:
res/layout/activity_main.xml

Поскольку в нашем Toolbar будет располагаться виджет поиска, мы можем настроить его внешний в вид в файле styles.xml нашего приложения. В 21 версии Android SDK появилось гораздо больше возможностей для кастомизации виджета поиска (SearchView Widget), вы можете посмотреть полный список атрибутов по этой ссылке: AppCompat v21 — Material Design for Pre-Lollipop Devices! В этом же файле мы зададим цвет нашего Toolbar.

Читайте также:  Among us closed beta android

И наконец создадим файл со списком всех элементов нашего Toolbar-а. Тут у нас есть несколько вариантов:

  • В начале создать только те элементы, которые будут видны в стандартном режиме, а затем в коде добавлять или удалять элементы при переходе между режимами.
  • Сразу создать все существующие элементы в xml файле, а в коде просто управлять их видимостью.

Я выбрал второй вариант так как у нас не так много элементов внутри Toolbar и нам нет смысла экономить память храня в ней только видимые элементы.

Также существует два способа создания элементов Toolbar:

    Создавать элементы внутри меню (Menu), как экземпляры класса MenuItem. Этот способ использовался в предыдущих версиях Анрдроид (API Level

Источник

Урок 13. Работа с Toolbar и menu на примере UserInfoActivity

Код начала урока:

Знакомство с элементом Toolbar

Элемент Toolbar предназначен для быстрого и удобного доступа пользователя к часто используемым функциям. Создать его можно используя как упрощённый вариант, в котором о многом уже позаботились разработчики системы Android , так и полностью управляя всеми внутренними компонентами. В данном уроке мы рассмотрим упрощённый вариант.

На главном экране приложения с детальной информацией о пользователе нам необходимо создать такой toolbar :

Здесь у нас находится только один элемент: кнопка поиска, которая должна перенаправлять нас на экран для поиска других пользователей.

В ранних версиях Android использовался элемент ActionBar , теперь же его функцию выполняет Toolbar . Важно, использовать Toolbar из пакета android.support.v7.widget , чтобы у нас была совместимость со старыми устройствами (версия Android ниже 5.0).

Поэтому сперва нам необходимо позаботиться о том, чтобы наши экраны не содержали элемент ActionBar по умолчанию. Для этого нам нужно унаследовать главный стиль приложения (находится в файле styles.xml ) от необходимого нам Theme.AppCompat.Light.NoActionBar :

Теперь необходимо добавить элемент Toolbar в xml -файл activity_user_info.xml . Для этого добавим Toolbar над контейнером RelativeLayout , в котором находится вся информация о пользователе. Также добавим стиль для тулбара, чтобы переиспользовать его на других экранах.

Атрибуты элемента Toolbar

Остановимся на некоторых атрибутах:

  • «android:layout_height»>?attr/actionBarSize . Здесь мы указываем высоту тулбара. Таким синтаксисом мы можем получить доступ к значению высоты, которая применяется в атрибутах темы. По умолчанию, если мы не переопределяем значение, оно берётся из системного пакета темы support . Это значение лучше использовать, т.к. оно соответствует гайдам дизайна от Google . Подробнее можете изучить на сайте официальной документации.
  • theme>@style/ThemeOverlay.AppCompat.Dark.ActionBar . Мы пока закомментировали этот атрибут. Объясним его чуть позже более наглядно.

Таким образом, мы добавили в нашу Activity тулбар. Но этого мало. Нам нужно сообщить ей, что мы используем его в качестве замены элемента ActionBar . Это необходимо, чтобы на устройствах со старой версией Android (ниже Android 5.0 (API 21)) наш интерфейс выглядел также, как и на устройства с новой версией. Для этого нам просто нужно вызвать метод Activity setSupportActionBar(Toolbar toolbar) :

Важно, чтобы импорт вашего тулбара выглядел так: import android.support.v7.widget.Toolbar; . Именно тулбар из этого пакета нам и нужен.

Давайте запустим приложение и посмотрим, что получилось:

Видим, что текст в нашем тулбаре отображается тёмным цветом. Это потому что наше приложение по умолчанию использует Light тему Theme.AppCompat.Light.NoActionBar . Эта тема означает, что фоновый цвет будет светлым, а текст – тёмным.

Давайте раскомментируем атрибут тулбара, который указывает, что все его вложенные элементы должны использовать тему Dark . В тёмной теме весь текст будет отображать светлым цветом, а фоновый цвет – тёмным. Помним, что фоновый цвет тулбара мы тоже переопределяем, используя атрибут android:background .

Читайте также:  Создание по под android

Запустим приложение, посмотрим, что получилось:

Отлично, двигаемся дальше.

Осталось наполнить наш toolbar содержимым. Т.к. нашему тулбару необходима всего одна кнопка поиска, то мы можем обойтись стандартным способом добавления элементов в тулбар: при помощи Menu (помимо примера ниже также можете ознакомиться с данным уроком).

Скачивание png иконки

Давайте вначале скачаем иконку поиска, которая будет отображаться в menu . Как правило, для создания приложения достаточно пользоваться ресурсами, которые уже для разработчиков подготовил Google. Например, такая ситуация с иконками, которые рекомендует использовать Google. Их можно найти на этом сайте. В данном случае нам необходима иконка поиска, поэтому попробуем её найти, введя в поле поиска search :

Нашли подходящую иконку, выбрали в выпадающем списке тип Android и цвет, а теперь можем скачать .png -файлы. В первую очередь извлекаем архив для удобной работы с файлами. После извлечения архива видим, что в папке res содержится иконка промасштабированная для различных разрешений экранов, поэтому в зависимости от разрешения экрана устройство самостоятельно будет использовать наиболее подходящий ресурс для отображения.

Наша задача – обеспечить приложение иконками для разных разрешений. Подробнее об этом можно почитать в официальной документации.

Таким образом выделяем все папки внутри res ( drawable-hdpi , drawable-xhdpi и т.д.), копируем их, потом заходим в проект и вставляем их в папку res нашего приложения. После добавления иконок структура проекта выглядит так:

Т.е. мы скопировали несколько иконок для разных размеров экранов.

Если поменяем тип отображения файлов с Android на Project , то увидим, что физически создалось несколько папок, в каждой из которых лежит png для разного разрешения экрана.

Создание menu

Как мы с вами помним, для создания папки ресурсов menu необходимо нажать правой кнопкой по папке res и выбрать New -> Android resource directory . В появившемся диалоговом окне выбираем Resource type – menu . Все остальные поля заполнятся автоматически такими же значениями:

Нажимаем OK и видим, что папка создалась.

Затем создадим новый файл меню. Для этого правой кнопкой кликаем по папке menu и выбираем варианты New -> Menu resource file . Вводим имя user_info_menu.xml :

Из данного xml -файла можно увидеть, что наша иконка поиска будет всегда видна пользователю ( app:showAsAction=»always» ). Видим, что мы ссылаемся на иконку, которую только что добавили в проект ( android:icon=»@drawable/ic_search_white_24dp» ).

Теперь мы можем наполнить содержимым наш Toolbar , переопределив метод onCreateOptionsMenu в Activity . Это стало возможным благодаря тому, что мы вызвали метод setSupportActionBar(toolbar) .

Чтобы переопределить какой-то из методов мы можем нажать комбинацию клавиш Ctrl + O . После этого появится окно со всеми методами. Мы можем ввести название метода onCreateOptionsMenu . И выбрать его:

Давайте добавим в метод использование user_info_menu :

Отлично, дело за малым: выполнить необходимое нам действие по клику на кнопку – перейти на экран для поиска пользователей:

Единственная вещь, о которой ещё стоит упомянуть – это установка заголовка нашего экрана, отображающегося в тулбаре. Мы хотим устанавливать имя пользователя динамически в методе displayUserInfo . Для этого достаточно вызвать в необходимом месте метод тулбара setTitle(CharSequence title) . Помните, что мы вызывали строку setSupportActionBar(toolbar) . Также в Activity есть метод getSupportActionBar , который используется для совместимости со старыми устройствами. Его мы и будем использовать. Давайте добавим эту логику в метод displayUserInfo() :

AndroidStudio может подчёркивать вызов getSupportActionBar().setTitle , сообщая, что объект может быть null . Но мы помним, что мы вызвали метод setSupportActionBar(toolbar) , поэтому можем пока игнорировать это замечание.

Запустим приложение и посмотрим на результат:

В результате данного урока мы узнали:

  • что такое элемент Toolbar ;
  • что такое Menu и как его использловать с элементом Toolbar ;
  • каким образом наполнить Toolbar пользовательскими элементами.

Источник

Оцените статью