自定义View实现水平滚动控件

      前几天项目中需要使用到一个水平可滚动的选择条,类似下图效果(图片是从简书上一位作者那儿找来的,本篇也是在这位作者的文章的基础上修改的,站在大神的肩膀上,哈哈,由于原文没有提供demo,而且实现的效果跟我要的不一样(原文不是自定义控件,怎么说自己也是偷懒吧,所以直接封装一下,跟原文代码差别还是很大的),所以进行了一些修改,原文地址:思路来源 )。

这个滚动选择条主要基于RecyclerView实现,实现的功能如下:

1. 滚动选择   2.点击选择   3.选中项目居中高亮显示

效果图如下:

效果图


思路原文描述的非常清楚,我在原有基础上做了修改,都在代码中有注释。

介绍下我的这个demo的使用,非常简单:

1.在xml中加入自定义的布局

写入自定义view的包名全路径,设置一下其他基本属性,完事。

2.在MainActivity中设置使用

    (1)找到自定义的view和其中的RecyclerView

    (2)准备数据

    (3)添加监听器

             这个监听器主要是为了获取RecyclerView的宽度,因为在onCreate执行的时候,视图还没有绘制出来,直接getMeasureWidth()等方法获取的都是0,这个监听器给视图添加一个回调,在视图绘制的瞬间就可以获得视图宽度。

    (4)调用自定义View公开的方法,设置数据,初始化适配器。

第一次在简书写文章,有不足之处欢迎指出,好让我可以改进,当然也欢迎多多鼓励小弟,有动力继续写下去哈~~~最后附上demo下载地址,有需要的同学欢迎使用~~开源万岁~~Demo地址

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏腾讯NEXT学位

使用 CSS 追踪用户

3609
来自专栏程序员的知识天地

移动端上拉加载和下拉刷新的vue插件

npm install --save mescroll.js //不要使用cnpm安装

1.6K2
来自专栏数据小魔方

图表搬家

来这里找志同道合的小伙伴! 今天给大家聊一聊Excel图表的输出! 我们日常所做的图表,如果不是专门用做Excel报表的话,大部分还是要以图片的形式导出。 通...

3388
来自专栏速成应用小程序开发平台

新手教程|速成应用教你如何制作搭建自己的微信小程序

微信小程序已经迈入了爆发阶段,很多中小企业和商户正在不断涌入这个市场。但是很多不懂技术不懂代码的小白却不知道去哪里制作微信小程序,现在就以可视化小程序开发工具「...

2.2K5
来自专栏前端新视界

jQuery 图片查看插件 Magnify 开发简介(仿 Windows 照片查看器)

前言 因为一些特殊的业务需求,经过一个多月的蛰伏及思考,我开发了这款 jQuery 图片查看器插件 Magnify,它实现了 Windows 照片查看器的所有功...

3389
来自专栏前端说吧

flag - 4-5月份预整理总结的文章目录

1243
来自专栏司想君

HTML5.2新特性解读

不到一个月之前,W3C官方发布 HTML5.2,并成为官方推荐使用标准。这意味着作为web开发者,我们可以愉快地使用5.2中的新特性了。 W3C在HTML5.2...

3745
来自专栏小白鼠

Ionic3 高德Web定位

高德提供了Web平台定位的JS API,同样需要用到 APP_Key,并且需要注意是使用Web端的Key,如下图所示。必须是Web端的,其它平台的无效。 ht...

1702
来自专栏更流畅、简洁的软件开发方式

【分享】 纯 js 表单控件 —— 让 “增改查” 更轻松!

  我们在做增删改查的时候,必可避免的要做表单,那么表单是怎么弄出来的呢?拖拽控件、手写、js创建还是第三方控件(包括js版)? 以前用服务器控件写了一套表单控...

4028
来自专栏DeveWork

为WordPress 评论框添加HTML5 表单验证

WordPress 中最常用到的表单莫过于评论框了,但现在不少的WordPress 主题(包括WordPress官方的主题),其表单验证其实是借助javascr...

38710

扫码关注云+社区

领取腾讯云代金券