При работе с огромным списком данных часто бывает удобно быстро просмотреть список с помощью полосы прокрутки. Фактически, при чтении самой статьи вы можете увидеть полосу прокрутки в правой части страницы, которую вы можете использовать для быстрого перехода к концу страницы.
Этот шаблон проектирования довольно распространен, и Android не является исключением, поскольку мы легко можем найти множество примеров полос прокрутки, особенно когда контент отображается в виде списка. Вы можете увидеть несколько примеров этого ниже:
Работая над AfterShoot, я заметил, что часто количество изображений на устройстве пользователя может превышать несколько тысяч, поэтому мне стало крайне важно реализовать аналогичный механизм, позволяющий пользователям быстро перемещаться по своим изображениям.
В этом блоге мы рассмотрим, как я добавил поддержку быстрой прокрутки в RecyclerView, который отображает список изображений в AfterShoot. Прочитав этот пост, у вас будет достаточно знаний, чтобы сделать это в собственном приложении!
Быстрая прокрутка в ListViews
Если вы используете ListView в своем приложении для отображения большого количества контента, то добавить быструю прокрутку относительно просто. Вы можете просто добавить следующий тег атрибута в свой xml-тег ListView и покончить с этим!
android:fastScrollEnabled="true"
Вы можете дополнительно настроить внешний вид получившейся полосы прокрутки. Чтобы узнать об этом больше, загляните сюда:
Быстрая прокрутка в RecyclerView
Учитывая тот факт, что ListViews давно были заменены на RecyclerViews (благодаря лучшей производительности и настраиваемости последнего), давайте посмотрим, как реализовать быструю прокрутку в том же самом.
Шаг 1. Добавьте и настройте RecyclerView в своем приложении
Это наиболее очевидный шаг. Вам нужно добавить RecyclerView в свое приложение и убедиться, что оно заполнено некоторыми данными.
Шаг 2. Добавьте тег FastScroll в XML-макет.
Следующим шагом будет установка флага fastScrollEnabled в значение true в нашей записи xml макета RecyclerView’s:
app:fastScrollEnabled="true"
Если мы попытаемся запустить приложение сейчас, оно выйдет из строя со следующим сообщением об ошибке:
Caused by: java.lang.IllegalArgumentException: Trying to set fast scroller without both required drawables. androidx.recyclerview.widget.RecyclerView{29bc43e VFED..... ......I. 0,0-0,0 #7f0800ca app:id/rvBadPics}, adapter:null, layout:null, context:com.aftershoot.declutter.ui.activities.ResultActivity@ea4aaea
at androidx.recyclerview.widget.RecyclerView.initFastScroller(RecyclerView.java:11513)
2020-01-20 19:36:11.707 3991-3991/com.aftershoot.declutter E/AndroidRuntime: at androidx.recyclerview.widget.RecyclerView.<init>(RecyclerView.java:705)
at androidx.recyclerview.widget.RecyclerView.<init>(RecyclerView.java:650)
По сути, эта ошибка означает, что перед тем, как мы установим fastScroll на наш RecyclerView, нам нужно определить чертежи (или изображения), которые будут использоваться для быстрой прокрутки. Другими словами, нам нужно определить, как это будет выглядеть, прежде чем мы попытаемся включить его для нашего RecyclerView.
Шаг 3. Определите чертежи для полосы прокрутки
Далее нам нужно определить, как будет выглядеть scrollBar. Для этого нам нужно определить 4 свойства в XML-файле нашего RecyclerView. Это можно сделать следующим образом:
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rvBadPics"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbarSize="18dp"
app:fastScrollHorizontalThumbDrawable="@drawable/thumb_drawable"
app:fastScrollHorizontalTrackDrawable="@drawable/line_drawable"
app:fastScrollVerticalThumbDrawable="@drawable/thumb_drawable"
app:fastScrollVerticalTrackDrawable="@drawable/line_drawable"
app:fastScrollEnabled="true" />
Объяснения этих свойств следующие:
fastScrollHorizontalThumbDrawable: объект для рисования, который будет использоваться для рисования значка, который можно перетаскивать по горизонтальной оси.fastScrollHorizontalTrackDrawable: объект для рисования, который будет использоваться для рисования линии, которая будет представлять полосу прокрутки на горизонтальной оси.fastScrollVerticalThumbDrawable: объект для рисования, который будет использоваться для рисования значка, который можно перетаскивать по вертикальной оси.fastScrollVerticalTrackDrawable: объект для рисования, который будет использоваться для рисования линии, которая будет представлять полосу прокрутки на вертикальной оси.
Предоставлено: https://stackoverflow.com/questions/45370246/how-to-use-fastscrollenabled-in-recyclerview
Для каждого из этих свойств у нас есть чертеж. Вы можете найти чертеж, который я использовал здесь:
Не стесняйтесь изменять их по своему вкусу или требованиям.
Шаг 4. Запустите приложение, чтобы увидеть быструю прокрутку в действии.
Вот и все! Если вы запустите приложение сейчас, вы увидите значок быстрой прокрутки в правой части экрана. Нажатие на большой палец (синий значок) должно позволить вам быстро прокручивать список вверх и вниз:
Шаг 5 (необязательно): исправьте большое количество элементов
Если ваш RecyclerView содержит большое количество элементов, вы можете заметить, что ползунок быстрой прокрутки очень маленький и недоступен. Это известная проблема с RecyclerView, которая уже отмечена в системе отслеживания проблем AOSP здесь:
Пока мы ждем исправления, рекомендуется вместо этого использовать стороннюю библиотеку, которая позволяет сделать то же самое с минимальными усилиями в процессе.
RecyclerView-FastScroll - одна из таких библиотек:
Если вы хотите увидеть всю реализацию, перейдите в репозиторий GitHub для приложения AfterShoot:
Спасибо за внимание! Если вам понравилась эта история, пожалуйста, нажмите 👏 кнопку и поделитесь ею, чтобы помочь другим найти ее! Не стесняйтесь оставлять комментарии 💬 ниже.
Есть отзывы? Подключим в Twitter.
Примечание редактора. Heartbeat - это онлайн-публикация и сообщество, созданное авторами и посвященное предоставлению первоклассных образовательных ресурсов для специалистов по науке о данных, машинному обучению и глубокому обучению. Мы стремимся поддерживать и вдохновлять разработчиков и инженеров из всех слоев общества.
Независимая редакция, Heartbeat спонсируется и публикуется Comet, платформой MLOps, которая позволяет специалистам по обработке данных и группам машинного обучения отслеживать, сравнивать, объяснять и оптимизировать свои эксперименты. Мы платим участникам и не продаем рекламу.
Если вы хотите внести свой вклад, отправляйтесь на наш призыв к участникам. Вы также можете подписаться на наши еженедельные информационные бюллетени (Deep Learning Weekly и Comet Newsletter), присоединиться к нам в » «Slack и подписаться на Comet в Twitter и LinkedIn для получения ресурсов, событий и гораздо больше, что поможет вам быстрее и лучше строить лучшие модели машинного обучения.
