如何在 RecyclerView 中使用 fastScrollEnabled？

Question

我是 RecyclerView 的新手，我想在 RecyclerView 中实现快速滚动功能，如谷歌联系人应用程序和互联网搜索，我发现现在 Android 为 RecyclerView 正式提供了新的 fastScrollEnabled 布尔标志。所以我的问题是有人可以提供它的示例实现。

这里是google的官方文档 https://developer.android.com/topic/libraries/support-library/revisions.html#26-0-0

Answer 1

使用 Support Library 26，我们可以轻松地为 RecyclerView 启用快速滚动。让我们开始吧！

让我们一个一个地检查每个属性：

1. fastScrollEnabled : 启用快速滚动的布尔值。将此设置为 true 将需要我们提供以下四个 属性。
2. fastScrollHorizo​​ntalThumbDrawable ：一个 StateListDrawable 将用于绘制可以拖过 水平轴。
3. fastScrollHorizo​​ntalTrackDrawable ：一个 StateListDrawable 用于绘制代表滚动条的线条 水平轴。
4. fastScrollVerticalThumbDrawable：一个 StateListDrawable，用于绘制可在垂直轴上拖动的拇指。
5. fastScrollVerticalTrackDrawable ：一个 StateListDrawable 用于绘制代表滚动条的线条 纵轴。

在 build.gradle 中添加

    dependencies {
    ....
    compile 'com.android.support:design:26.0.1'
    compile 'com.android.support:recyclerview-v7:26.0.1'
    ....
}

由于 Support Library 26 现在已移至 Google 的 maven 存储库，让我们将其包含在我们的项目级别 build.gradle

allprojects {
    repositories {
        jcenter()
        maven {
            url "https://maven.google.com"
        }
    }
}

activity_main.xml

<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:fastScrollEnabled="true"
    app:fastScrollHorizontalThumbDrawable="@drawable/thumb_drawable"
    app:fastScrollHorizontalTrackDrawable="@drawable/line_drawable"
    app:fastScrollVerticalThumbDrawable="@drawable/thumb_drawable"
    app:fastScrollVerticalTrackDrawable="@drawable/line_drawable">

 </android.support.v7.widget.RecyclerView>

在你的drawable文件夹中添加以下四个xml文件，

line_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_pressed="true"
        android:drawable="@drawable/line"/>

    <item
        android:drawable="@drawable/line"/>
</selector>

line.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">

    <solid android:color="@android:color/darker_gray" />

    <padding
        android:top="10dp"
        android:left="10dp"
        android:right="10dp"
        android:bottom="10dp"/>
</shape>

thumb_drawable.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_pressed="true"
        android:drawable="@drawable/thumb"/>

    <item
        android:drawable="@drawable/thumb"/>
</selector>

thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">

    <corners
        android:topLeftRadius="44dp"
        android:topRightRadius="44dp"
        android:bottomLeftRadius="44dp" />

    <padding
        android:paddingLeft="22dp"
        android:paddingRight="22dp" />

    <solid android:color="@color/colorPrimaryDark" />

</shape>

Answer 2

将属性添加到布局文件中的RecyclerView 标记中：

<android.support.v7.widget.RecyclerView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    ...
    app:fastScrollEnabled="true"
    app:fastScrollHorizontalThumbDrawable="@drawable/fast_scroll_thumb"
    app:fastScrollHorizontalTrackDrawable="@drawable/fast_scroll_track"
    app:fastScrollVerticalThumbDrawable="@drawable/fast_scroll_thumb"
    app:fastScrollVerticalTrackDrawable="@drawable/fast_scroll_track"
/>

制作两个drawable。 “track”drawable 可以是任何drawable，但“thumb”drawable 必须是状态列表drawable。

示例drawable/fast_scroll_track.xml 文件：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#80ffffff" />
</shape>

示例drawable/fast_scroll_thumb.xml 文件：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#ff0" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#fff" />
        </shape>
    </item>
</selector>

Answer 3

如您所知，RecyclerView 在支持库 26.0.0 中支持“快速滚动”。

注意：但请记住它只是 XML。

Answer 4

对于眼睛糖果滚动条拇指（圆形边框）：

   <android.support.v7.widget.RecyclerView
                android:id="@+id/netflixVideoGridView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                app:fastScrollEnabled="true"
                app:fastScrollHorizontalThumbDrawable="@drawable/fast_scroll_thumb"
                app:fastScrollHorizontalTrackDrawable="@drawable/fast_scroll_track"
                app:fastScrollVerticalThumbDrawable="@drawable/fast_scroll_thumb"
                app:fastScrollVerticalTrackDrawable="@drawable/fast_scroll_track"
                 />

fast_scroll_thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_pressed="true"
        android:drawable="@drawable/thumb"/>

    <item
        android:drawable="@drawable/thumb"/>
</selector>

thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <corners
        android:radius="50dp" />

    <padding
        android:paddingLeft="22dp"
        android:paddingRight="22dp" />

    <solid android:color="@color/colorPrimaryDark" />

    <stroke
        android:width="1dp"
        android:color="#69f0ae" />

</shape>

track.xml：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#80ffffff" />
    <padding
        android:padding="0dp"/>
</shape>

结果：