如果移动端访问不佳,请使用–>GitHub版

背景

设计师给的设计图完全依照 IOS 的标准来的,导致很多细节的控件都得自己重写,最近的设计图中有显示滚动条,Android 默认的滚动条样式(带描边)和设计图格格不入,无奈,只好研究下自定义 Scrollbar 样式。这里稍微整理下。

知识点

ListView/ScrollView/RecyclerView中添加属性:

<!-- 情况A :垂直滚动条-->
android:scrollbars="vertical"
android:scrollbarTrackVertical="@drawable/xxx_vertical_track"
android:scrollbarThumbVertical="@drawable/xxx_vertical_thumb"
<!-- 情况B :水平滚动条-->
android:scrollbars="horizontal"
android:scrollbarTrackHorizontal="@drawable/xxx_horizontal_track"
android:scrollbarThumbHorizontal="@drawable/xxx_horizontal_thumb" <!-- 其他通用的属性 -->
<!-- 1.定义滚动条的样式和位置 -->
android:scrollbarStyle="outsideInset"
<!-- 2.定义滚动条的大小,垂直时指宽度,水平时指高度 -->
android:scrollbarSize="4dp"
属性 效果
scrollbarThumbVertical[Horizontal] 短条
scrollbarTrackVertical[Horizontal] 长条,即背景

scrollbaTrackxxxscrollbarThumbxxx自定义的 xml 文件,放在Drawable中,track是指长条,thumb是指短条,然后再 xml 中定义短条和长条的样式。

需要注意

其中,scrollbaTrackxxxscrollbarThumbxxx可以使用

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

不可以直接使用#xxxxxx颜色值

android:scrollbarStyle

android:scrollbarStyle可以定义滚动条的样式和位置,可选值有insideOverlayinsideInsetoutsideOverlayoutsideInset四种。

其中insideoutside分别表示是否在 view 的 padding 区域内,overlayinset表示覆盖在 view 上或是插在 view 后面,所以四种值分别表示:

属性值 效果
insideOverlay 默认值,表示在padding区域内并且覆盖在view上
insideInset 表示在padding区域内并且插入在view后面
outsideOverlay 表示在padding区域外并且覆盖在view上
outsideInset 表示在padding区域外并且插入在view后面

Demo

下面是两个Demo:

color:

<color name="red_square">#CCFF6464</color>
<color name="transparent">#00000000</color>

drawable:scrollbar_vertical_thumb

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 填充 -->
<solid android:color="#66000000"/>
<!-- 圆角 -->
<corners android:radius="1dp" />
</shape>

Demo 1

layout:

android:scrollbarStyle="outsideOverlay"
android:scrollbarThumbVertical="@drawable/scrollbar_vertical_thumb"
<!--
scrollbarTrackVertical设为透明或者直接不设置即可
android:scrollbarTrackVertical="@color/transparent"
再次强调:scrollbarThumbVertical、scrollbarTrackVertical 不可以直接设置为颜色值,但可以使用@color的方式使用颜色值
-->
android:scrollbarSize="3dp"
android:scrollbars="vertical"

Demo 2

layout:

android:scrollbarStyle="outsideOverlay"
android:scrollbarThumbVertical="@color/red_square"
android:scrollbarSize="3dp"
android:scrollbars="vertical"

效果图

默认样式 :

Demo 1 :

Demo 2:

总结

在查资料的过程中,发现滚动条也可以使用代码来画,这里不做过多介绍,有兴趣的可以研究一下。

PS:

你可以关注的我GithubCSDN微博

Android必知必会-自定义Scrollbar样式的更多相关文章

  1. Android必知必会-使用okhttp的PUT方式上传文件

    注:如果移动端排版有问题,请看 简书版 (<-点击左边),希望CSDN能更好的支持移动端. 背景 公司的文件上传接口使用PUT协议,之前一直用的都是老项目中的上传类,现在项目中使用了okhttp ...

  2. Android必知必会-获取视频文件的截图、缩略图

    背景 公司最近要求给我负责的APP加上视频录制和发布的功能,我简单的完成了基本的录制和视频压缩功能,后来发现发布接口需要上传视频的截图,网上搜索了一下资料,在这里整理一下. 代码实现 /** * 获取 ...

  3. Android程序员必知必会的网络通信传输层协议——UDP和TCP

    1.点评 互联网发展至今已经高度发达,而对于互联网应用(尤其即时通讯技术这一块)的开发者来说,网络编程是基础中的基础,只有更好地理解相关基础知识,对于应用层的开发才能做到游刃有余. 对于Android ...

  4. 迈向高阶:优秀Android程序员必知必会的网络基础

    1.前言 网络通信一直是Android项目里比较重要的一个模块,Android开源项目上出现过很多优秀的网络框架,从一开始只是一些对HttpClient和HttpUrlConnection简易封装使用 ...

  5. RecyclerView 必知必会(转)

    [腾讯Bugly干货分享]RecyclerView 必知必会 本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com ...

  6. 2015 前端[JS]工程师必知必会

    2015 前端[JS]工程师必知必会 本文摘自:http://zhuanlan.zhihu.com/FrontendMagazine/20002850 ,因为好东东西暂时没看懂,所以暂时保留下来,供以 ...

  7. [ 学习路线 ] 2015 前端(JS)工程师必知必会 (2)

    http://segmentfault.com/a/1190000002678515?utm_source=Weibo&utm_medium=shareLink&utm_campaig ...

  8. 脑残式网络编程入门(三):HTTP协议必知必会的一些知识

    本文原作者:“竹千代”,原文由“玉刚说”写作平台提供写作赞助,原文版权归“玉刚说”微信公众号所有,即时通讯网收录时有改动. 1.前言 无论是即时通讯应用还是传统的信息系统,Http协议都是我们最常打交 ...

  9. H5系列之History(必知必会)

    H5系列之History(必知必会)   目录 概念 兼容性 属性 方法 H5方法       概念     理解History Api的使用方式 目的是为了解决哪些问题   作用:ajax获取数据时 ...

随机推荐

  1. codesforces 671D Roads in Yusland

    Mayor of Yusland just won the lottery and decided to spent money on something good for town. For exa ...

  2. 【Codeforces Round 418】An impassioned circulation of affection DP

                                                            C. An impassioned circulation of affection   ...

  3. bzoj 4025: 二分图

    Description 神犇有一个n个节点的图.因为神犇是神犇,所以在T时间内一些边会出现后消失.神犇要求出每一时间段内这个图是否是二分图.这么简单的问题神犇当然会做了,于是他想考考你. 解题报告: ...

  4. hdu5666 BestCoder Round #80

    Segment  Accepts: 418  Submissions: 2020  Time Limit: 2000/1000 MS (Java/Others)  Memory Limit: 6553 ...

  5. QSDK下驱动AR8035

    0 概述 QSDK平台中,我所接触到的版本,能支持MIPS架构的,是基于Openwrt AA版本:虽然CC版本上就已经能很好地支持AR8035了,可是AA版本它本身是不支持的,于是不断有人要求提供补丁 ...

  6. Unique-paths (动态规划)

    题目描述 A robot is located at the top-left corner of a m x n grid (marked 'Start' in the diagram below) ...

  7. C语言预备作业

    一.关于师生关系 第一种:我认为师生关系不是仅仅的餐馆与食客的关系,因为食客可以给餐馆评分,也可以选择是否继续在这里吃,但是学生却不可以选择老师,因为老师是传授知识的,无法由自己来选择.而学生是需要完 ...

  8. js延迟函数

    正确写法: setTimeout(function (){ alert("delay!"); },5000); 错误写法: setTimeout( alert("dela ...

  9. JQuery when() done() then()

    jQuery.when(deferreds) 参数deferreds,一个或多个延时对象或JS对象,我们初略的认为它就是一个或多个异步请求. 例如:$.when($.ajax("page1. ...

  10. Python开发——排队问题随机模拟分析

    案例:主要是基于"蒙特卡罗思想",求解排队等待时间问题 场景:厕所排队问题 1.两场电影结束时间相隔较长,互不影响: 2.每场电影结束之后会有20个人想上厕所: 3.这20个人会在 ...