Как сделать перелистывание страниц android
Если вам нужно создать приложение с многими экранами, которые красиво переключаются между собой, то это можно довольно легко сделать с помощью такого стандартного элемента Android интерфейса, как ViewPager. ViewPager довольно прост в использовании и выглядит довольно красиво. В этом уроке мы создадим приложение с использованием ViewPager, в котором программно будут создаваться 5 экранов, на каждом из которых будет находится номер страницы и собственная фоновая картинка, а также сделаем так, что при нажатии на каждый из экранов будет появляться Toast сообщение с номером нажатой страницы.
Для начала создадим новое приложение, выбираем Blank Activity. Открываем файл activity_main.xml и задаем там ViewPager:
На этом настройка пользовательского интерфейса закончена. Все остальное будет происходить в файле MainActivity.java.
Для работы ViewPager ему нужно настроить собственный адаптер, унаследованный от PagerAdapter. Поэтому, в файле MainActivity.java до метода onCreate () мы задаем используемые объекты:
Теперь в методе onCreate () делаем стандартный шаг инициализации используемых объектов и настраиваем адаптер к ViewPager:
Ну и последний и самый важный шаг — это настройка того самого адаптера. Вся остальная работа будет проделана именно в теле адаптера.
Итак, мы создаем адаптер под названием MyPagerAdapter, наследуем его от PagerAdapter. Задаем целое число страниц в адаптере — 5, используемые картинки и цвета для каждого из 5 экранов в качестве двух массивов с данными. А далее программно создаем LinearLayout, задаем его параметры и цвет фона из массива цветов, созданных выше, и в теле этого layout также программно создаем 2 элемента: TextView и ImageView. Текстовое поле будет служить местом, где будет отображаться число — номер страницы, а в ImageView будет отображаться соответственная каждому экрану фоновая картинка.
Все это в коде выглядит следующим образом:
Вот и все, можно преступать к тестированию приложения с использованием такой крутой штуки как ViewPager:
Замечательно, все переключается, отображается и Toast сообщение не подвело.
Источник
Перелистывание страниц и ViewPager2
ViewPager2 и разделение приложения на страницы
Нередко можно встретить приложения, которые реализуют систему перелистывания, а само приложение предстает в виде набора страниц, которые можно пролистывать влево и вправо. В приложении Android для создания подобного эффекта можно использовать элемент ViewPager2 из комплекта JetPack. Для создания эффекта страниц ViewPager2 использует фрагменты.
Итак, создадим новый проект. Добавим в папку res/layout файл разметки для фрагмента, который будет представлять страницу. Назовем его fragment_page.xml и определим в нем следующий код:
Фрагмент будет отображать текстовое поле с номером страницы.
Теперь добавим в проект сам класс фрагмента. Назовем его PageFragment :
Переменная pageNumber указывает на номер текущей страницы. Номер страницы будет передаваться извне через фабричный метод newInstance() . Передача номера происходит путем добавления значения в аргумент «num»
Затем при создании фрагмента в методе onCreate() этот номер будет извлекаться из аргумента «num» (если аргументы определены):
В методе onCreateView() полученный номер страницы будет отображаться в текстовом поле.
Сам по себе фрагмент еще не создает функциональность постраничной навигации. Для этого нам нужен один из классов PagerAdapter . Android SDK содержит ряд встроенных реализаций PagerAdapter, в частности, класс FragmentStateAdapter . Этот класс являются абстрактным, поэтому напрямую мы его использовать не можем, и нам нужно создать класс-наследник. Для этого добавим в проект новый класс, который назовем MyAdapter :
Класс FragmentStateAdapter определяет два метода:
int getItemCount() : возвращает количество страниц, которые будут в ViewPager2 (в нашем случае 10)
Fragment createFragment(int position) : по номеру страницы, передаваемому в качестве параметра position, возвращает объект фрагмента
Стоит отметить, что в качестве параметра конструктор FragmentStateAdapter принимает контекст выполнения — обычно это объект FragmentActivity, но также это может быть объект Fragment
В завершении установим в файле activity_main.xml элемент ViewPager2:
И также изменим код MainActivity :
Класс MainActivity наследуется от AppCompatActivity — класса, который в свою очередь наследуется от FragmentActivity, и поэтому ее текущий объект мы можем передать в качестве параметра в конструктор MyAdapter (а через него — в конструктор FragmentStateAdapter). Чтобы перелистывание заработало, для ViewPager2 устанавливается адаптер MyAdapter.
И запустив проект, мы сможем с помощью перелистывания перемещаться по страницам:
Источник
Слайдинг экранов с помощью ViewPager
Вступление
Предварительная настройка
Чтобы подключить библиотеку к проекту, выполняем следующие действия.
Идем в директорию, куда установлен Android SDK, запускаем SDK Manager и в списке доступных к установке компонентов выбираем Android Support package. Устанавливаем его. Все что нужно будет находиться в следующей директории: /extras/android/support/. В папке v4 будет лежать .jar файл, который и нужно подключить к проекту. Если вы работаете в Eclipse, то в Package Explorer щелкаем правым кликом по проекту, выбираем Build Path -> Add External Archives. В появившемся диалоговом окне переходим к скачанному .jar файлу, выбираем его и щелкаем OK. Всё, библиотека подключена к проекту и готова к использованию.
Хочется заметить, что могут возникнуть проблемы, если вы используете старую версию SDK Manager. У меня указанный Support Package не появлялся в списке доступных загрузок. После обновления SDK проблема решилась.
Разработка
Выполнив инструкции, приведенные по указанной выше ссылке, и установив библиотеку, можно приступать к реализации поставленной задачи.
ViewPager по принципу работы похож на ListView. Данные для отображения он берет из PagerAdapter. Нам потребуется унаследовать свой класс от PagerAdapter и реализовать в нем некоторые методы. Добавление и удаление экранов реализуется с помощью методов instantiateItem() и destroyItem() соответственно. View для отображения можно создавать прямо в адаптере. Такой подход хорош тем, что ViewPager можно настраивать так, чтобы в адаптере не хранились все экраны сразу. По умолчанию адаптер хранит текущий экран, и по одному слева и справа от него. Это может сэкономить память, если содержание экранов слишком сложное. Однако в данном примере создадим все экраны в activity приложения, добавим их в список, и передадим затем этот список адаптеру. Адаптер же не будет сам создавать view, а будет брать их их списка.
Код адаптера получился следующим.
В адаптере нам потребовалось определить свою реализацию для методов instantiateItem(), destroyItem(), getCount() и isViewFromObject(). Для остальных методов тела можно оставить пустыми.
Создадим файл разметки page.xml и опишем в нем содержимое экрана следующим образом:
В activity приложения, как было указано выше, создадим несколько View, которые и будут нашими экранами, добавим их в список и передадим список адаптеру. Затем создадим ViewPager и установим для него полученный адаптер.
Как видно из кода, мы создали три экрана. Для каждого из них мы указали какой он по счету. Установив адаптер для ViewPager, укажем что сейчас будет показываться экран с индексом 1, т.е. на котором написано «Страница 2».
Скриншот приложения, во время прокручивания экрана: 
Заключение
Как видно из примера, использовать ViewPager и PagerAdapter достаточно легко. При слайдинге экранов, изображения привязывается к положению пальца. Работает автоматическая доводка в какую либо из сторон. Нажатия на дочерние элементы (различные кнопки, элементы списка, если таковой присутствует) обрабатываются корректно.
И в заключение, ссылка на статью, в которой рассказывается о ViewPager.
Источник
Полный список
— разбираемся с ViewPager
ViewPager позволяет нам организовать удобный и красивый просмотр данных с возможностью перелистывания влево-вправо. Сам ViewPager отвечает за показ и прокрутку. Но ему нужен еще PagerAdapter, который отвечает за предоставление данных.
PagerAdapter – это базовый абстрактный класс, для которого разработчик дописывает реализацию так, как ему надо. Существует распространенная стандартная (частичная) реализация PagerAdapter, которая работает с фрагментами – это FragmentPagerAdapter. Разработчику остается только создать фрагмент и определить кол-во страниц.
Напишем простой пример и рассмотрим основные возможности ViewPager и FragmentPagerAdapter.
Project name: P1251_ViewPager
Build Target: Android 2.3.3
Application name: ViewPager
Package name: ru.startandroid.develop.p1251viewpager
Create Activity: MainActivity
В main.xml пишем:
Только компонент ViewPager.
Здесь только TextView, который будет показывать содержимое страницы.
Метод newInstance создает новый экземпляр фрагмента и записывает ему в атрибуты число, которое пришло на вход. Это число – номер страницы, которую хочет показать ViewPager. По нему фрагмент будет определять, какое содержимое создавать в фрагменте.
В onCreate читаем номер страницы из аргументов. Далее формируем цвет из рандомных компонентов. Он будет использоваться для фона страниц, чтобы визуально отличать одну страницу от другой.
В onCreateView создаем View, находим на нем TextView, пишем ему простой текст с номером страницы и ставим фоновый цвет.
Т.е. на вход у нас идет номер страницы, а на выходе получаем фрагмент, который отображает этот номер и имеет случайный фоновый цвет.
Фрагмент готов, пишем MainActivity.java:
В onCreate создаем адаптер и устанавливаем его для ViewPager. Также для ViewPager создаем обработчик событий. Он имеет три метода:
onPageSelected – дает номер текущей отображенной страницы
onPageScrolled – достаточно сложно объяснить на словах. Метод дает нам представление о текущем значении скроллера при пролистывании. Рекомендую поставить там запись в лог, полистать и посмотреть, что получается.
onPageScrollStateChanged – сообщает нам о состоянии, в котором находится скроллер (SCROLL_STATE_IDLE – ничего не скролится, SCROLL_STATE_DRAGGING – пользователь «тащит» страницу, SCROLL_STATE_SETTLING – скроллер долистывает страницу до конца)
Класс FragmentPagerAdapter — абстрактный. Нам надо реализовать в нем пару методов. Для этого создаем класс MyFragmentPagerAdapter. В нем реализуем методы:
getItem – по номеру страницы нам надо вернуть фрагмент, используем наш метод newInstance
getCount – здесь мы должны возвращать кол-во страниц, используем константу
Все сохраняем и запускаем приложение.
Полистаем страницы, в логах видим:
onPageSelected, position = 1
onPageSelected, position = 2
onPageSelected, position = 3
onPageSelected, position = 4
onPageSelected, position = 3
onPageSelected, position = 2
onPageSelected, position = 1
onPageSelected, position = 0
Срабатывает обработчик перелистываний.
PagerTitleStrip
К ViewPager можно прикрутить элемент, который будет показывать заголовки – PagerTitleStrip.
Помещаем PagerTitleStrip внутрь ViewPager.
А в коде адаптера надо добавить метод getPageTitle, чтобы PagerTitleStrip знал какой текст показывать в заголовке. В класс MyFragmentPagerAdapter в MainActivity.java дописываем:
Будем возвращать просто «Title» и номер страницы
Сверху появились заголовки.
PagerTabStrip
Заголовки могут участвовать в навигации. Для этого используется компонент PagerTabStrip. Это аналог PagerTitleStrip, но при нажатии на заголовок он перелистывает страницу. Его встраивание полностью аналогично только что рассмотренному PagerTitleStrip
Он также требует от адаптера метод getPageTitle, который у нас уже реализован в MyFragmentPagerAdapter.
Понажимайте на левый и правый заголовки, страницы будут перелистываться.
Lifecycle
Давайте подробнее рассмотрим, что происходит с фрагментами в моменты перелистывания. Для этого перепишем PageFragment.java:
В onCreate мы добавили запись в лог и попытку чтения сохраненного значения из savedInstanceState.
В onSaveInstanceState сохраняем номер страницы.
В onDestroy просто пишем лог.
Тем самым мы увидим, пересоздается ли фрагмент и может ли он при этом восстанавливать сохраненные значения.
Все сохраним, запустим приложение.
Создался фрагмент для нулевой и первой страницы. Хотя видна сейчас только нулевая. Адаптер разумно заранее создает следующую к показу страницу, чтобы при пролистывании не было тормозов. Фрагменты создаются первый раз, вытаскивать из savedInstanceState нечего, поэтому видим savedPageNumber = -1.
Перелистнем на первую страницу
onPageSelected, position = 1
onCreate: 2
savedPageNumber = -1
Первую показал, вторую заранее создал.
Перелистнем еще пару страниц
onPageSelected, position = 2
onCreate: 3
savedPageNumber = -1
onPageSelected, position = 3
onCreate: 4
savedPageNumber = -1
Все также и остается. Заметьте, что не срабатывает onDestroy. Т.е. все страницы не уничтожаются, а хранятся в памяти.
onPageSelected, position = 2
onPageSelected, position = 1
onPageSelected, position = 0
Т.к. не было никаких уничтожений, то нет и никаких созданий. Достает страницы-фрагменты из памяти и показывает.
Можно сделать вывод. Этот адаптер быстрый, т.к. не требует пересоздания. Но затратный, т.к. все держит в памяти. Т.е. подходит для небольшого количества страниц. Например, набор вкладок или визард.
Правда есть нюанс: хоть сами фрагменты и не уничтожаются, но уничтожается их View-структура и потом создается заново. Вставьте лог в метод onCreateView и убедитесь. Хранится структура только текущей страницы и по одной справа и слева. Это кол-во соседних страниц с сохраняемой View-структурой может быть настроено методом setOffscreenPageLimit.
FragmentStatePagerAdapter
Этот адаптер аналогичен FragmentPagerAdapter, он также работает с фрагментами. Но использует другие механизмы работы с страницами. Он не хранит страницы в памяти, а каждый раз создает их. Давайте используем его. Для этого надо в MainActivity.java просто заменить FragmentPagerAdapter на FragmentStatePagerAdapter в секции импорта и в описании класса MyFragmentPagerAdapter.
И все. Сохраняем, запускаем.
Открылась нулевая страница. В логах видим:
onCreate: 0
savedPageNumber = -1
onCreate: 1
savedPageNumber = -1
Перелистнем на первую страницу
onPageSelected, position = 1
onCreate: 2
savedPageNumber = -1
Пока что поведение не отличается от прошлого адаптера.
Перелистнем на вторую страницу.
onPageSelected, position = 2
onDestroy: 0
onCreate: 3
savedPageNumber = -1
Вот и отличие. Видим, что также открылась вторая страница, также создалась третья, но при этом уничтожилась нулевая.
Перелистнем на третью:
onPageSelected, position = 3
onDestroy: 1
onCreate: 4
savedPageNumber = -1
Та же ситуация: отобразилась третья, уничтожилась первая, создалась четвертая.
Перелистнем обратно на вторую:
onPageSelected, position = 2
onDestroy: 4
onCreate: 1
savedPageNumber = 1
Отобразилась вторая, уничтожилась четвертая, создалась первая (и прочла сохраненное значение из savedInstanceState).
Т.е. видно, что адаптер хранит только текущую страницу и по одной соседней (справа и слева), чтобы быстро можно было перелистнуть.
Можно сделать вывод. Этот адаптер не очень быстрый, он будет подтормаживать при многократном перелистывании в обе стороны, т.к. постоянно пересоздает страницы. Но при этом он требует минимум памяти. Т.е. он подходит для большого количества страниц. Например, просмотр писем, смс, страниц книги.
Используйте тот адаптер, который вам больше подходит в данной ситуации. Или наследуйте класс PagerAdapter и создавайте адаптер под свои нужды.
Программное перелистывание
Чтобы программно перелистнуть страницу ViewPager используйте метод setCurrentItem. А чтобы узнать текущую страницу — getCurrentItem.
Присоединяйтесь к нам в Telegram:
— в канале StartAndroid публикуются ссылки на новые статьи с сайта startandroid.ru и интересные материалы с хабра, medium.com и т.п.
— в чатах решаем возникающие вопросы и проблемы по различным темам: Android, Kotlin, RxJava, Dagger, Тестирование
— ну и если просто хочется поговорить с коллегами по разработке, то есть чат Флудильня
— новый чат Performance для обсуждения проблем производительности и для ваших пожеланий по содержанию курса по этой теме
Источник
