RecyclerView 滚动条 长宽设置

RecyclerView Scrollbar

记录滚动条相关属性，本文主要内容：

1，scrollbar 样式设置

2，scrollbar 背景以及滚动条 长宽设置

属性	效果
android:scrollbars	设置滚动条水平 horizontal / 或垂直 vertical
scrollbarThumbVertical[Horizontal]	设置滑块（短条）
scrollbarTrackVertical[Horizontal]	设置背景（长条）
android:scrollbarStyle                 滚动条的样式和位置	insideOverlay （默认值，表示在padding区域内并且覆盖在view上）
	insideInset （表示在padding区域内并且插入在view后面）
	outsideOverlay（表示在padding区域外并且覆盖在view上）
	outsideInset（表示在padding区域外并且插入在view后面）
scrollbarSize	设置滚动条的大小，垂直时指宽度，水平时指高度
overScrollMode	（never）设置滑动到边缘时无效果模式
scrollbars	（none）设置滚动条不显示

 

 

 

 

 

 

 

 

 

 

 

一，样式设置：

在styles.xml 文件中添加一个 style标签

    <style name="ZoomItemRecyclerView_style">
        <item name="android:scrollbarThumbVertical">@color/blue_color_008ee3</item>
        <item name="android:scrollbarTrackVertical">@color/white_5</item>
        <item name="android:layout_marginRight">@dimen/dpi_10px</item>
        <item name="android:layout_marginLeft">@dimen/dpi_10px</item>
        <item name="android:scrollbarSize">@dimen/dpi_5px</item>
        <item name="android:overScrollMode">never</item>
        <item name="android:scrollbars">vertical</item>
        <item name="android:scrollbarStyle">insideOverlay</item>
    </style>

注意：滚动条的 背景和滑块设置

• Shape自定义 Drawable
• 图片
• .9.png 
• @color/xxx 的方式使用颜色值

此处设置一个 垂直的滚动条，然后在xml中引用该样式

        <cn.sh.changxing.onlineradio.aa_activity.view.ZoomItemRecyclerView
            android:id="@+id/fragment_recommend_list"
            style="@style/ZoomItemRecyclerView_style"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

效果图如下

   

最简单的一个效果出来了，但是这里可以看到，有两个现象

1，滚动条起始位置（这里就是指背景高度）是撑满整个列表的

2，当列表数据越多的时候，滑块长度越小

如果我滚动条长度要求只占80%，或指定高度，滑块长度维持不变，那这明显不行

二，背景以及滚动条 长宽设置

稍微修改下，背景跟滑块 使用两张自定义图片

        <item name="android:scrollbarThumbVertical">@drawable/aa_scrollbar</item>
        <item name="android:scrollbarTrackVertical">@drawable/aa_scrollbar_bg</item>

aa_scrollbar.xml 滑块图片

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:height="@dimen/dpi_80px"
        android:bottom="@dimen/dpi_20px"
        android:top="@dimen/dpi_20px">
        <shape>
            <corners android:radius="@dimen/dpi_2px" />
            <solid android:color="?attr/Theme_color" />
        </shape>
    </item>

</layer-list>

android:height    指定高度

android:bottom  距离底部

android:top         距离顶部

corners 圆角

solid 填充颜色

aa_scrollbar_bg.xml 背景图片

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:bottom="@dimen/dpi_20px"
        android:top="@dimen/dpi_20px">
        <shape>
            <corners android:radius="@dimen/dpi_2px" />
            <solid android:color="@color/scrollbar_bg" />
        </shape>
    </item>
</layer-list>

背景图片仅少了指定高度

效果如下：

高亮滑块 长度固定， 滚动条总长度占整个高度的80%左右，并带有圆角效果。

记录一下