RecyclerView 、ScrollView滚动条长宽设置

简介: RecyclerView 、ScrollView滚动条长宽设置

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%左右,并带有圆角效果。

相关文章
|
XML Java Android开发
Android 中ScrollView垂直滚动视图之隐藏滚动条的三种方法
Android 中ScrollView垂直滚动视图之隐藏滚动条的三种方法
146 0
|
Android开发 容器
ScrollView(滚动条)
本节带来的是Android基本UI控件中的第十个:ScrollView(滚动条),或者我们应该叫他 竖直滚动条,对应的另外一个水平方向上的滚动条:HorizontalScrollView,先来一发官方文档 的链接:ScrollView,我们可以看到类的结构如下
148 0
解决Toolbar 和状态栏重叠,并且设置Toolbar 的颜色渐变效果
解决Toolbar 和状态栏重叠,并且设置Toolbar 的颜色渐变效果
UIScrollView滑动选页
UIScrollView滑动选页
76 0
RecyclerView的item宽度不能全屏显示
RecyclerView的item宽度不能全屏显示
217 0
|
Android开发
如何去掉listview滑动时的阴影
如何去掉listview滑动时的阴影
如何去掉listview滑动时的阴影
|
Android开发
Android隐藏Listview和RecyclerView 滑动边界的阴影,去除滚动条加分隔线等
Android隐藏Listview和RecyclerView 滑动边界的阴影,去除滚动条加分隔线等
198 0
|
Android开发
TextView未绘制情况下获取其宽高
/** * 注:StaticLayout是android中处理文字换行的一个类,TextView源码中也是通过这个类实现换行的,使用这个类可以 * 在不进行TextView绘制的前提下得到TextView的宽高,这里我们只需要获取到高度即可,这个高度当然也可以通过post * 在run中获取,但是这样做会有一个问题,界面是先绘制显示然后再计算高度根据我们的逻辑来收缩TextView的高度,在列表中 * 会出现闪烁的问题。
2590 0
|
Android开发 容器 Java
Android取消RecyclerView、ListView、ScrollView、HorizontalScrollView滑动到边缘闪现灰白色水波纹动画
Android取消RecyclerView、ListView、ScrollView、HorizontalScrollView滑动到边缘闪现灰白色水波纹动画 标准的Android RecyclerView、ListView、ScrollView、HorizontalScrollView滑动到边缘,会闪现灰白色水波纹动画,以这样大的动画效果提示用户已经滑动到边缘,没法再滑动了。
3015 0