【移动应用开发技术】Android 基于RecyclerView实现的歌词滚动自定义控件

【移动应用开发技术】Android基于RecyclerView实现的歌词滚动自定义控件

本文介绍了Android基于RecyclerView实现的歌词滚动自定义控件，分享给大家，具体如下：先来几张效果图：这几天打算做一个控件，来让自己复习一下自定义view的知识以及事件分发机制的原理与应用。对于这个控件，我已经封装好了，只要调用就可以了。本来是想放上gitHub和添加依赖的。但是提交github出了问题一直不会弄，所以就只能先等等了。（(；′⌒`)）接下来说一下实现原理：该控件分为以下几个部分：接下来我一个一个大概讲述一下思路。1.对于滚动，我们可以调用RecyclerView.smoothScrollBy()方法，相对于ScrollBy()方法，该方法能够实现平滑滑动。我设置了总共显示九句歌词。而且因为我想在歌词前面和后面留一些空白，这些看起来会好看些。所以，在歌词列表里面我加多了一些空白。由于歌词的滚自动滚动是根据歌词时间来进行移动的。所以我们需要需要使用Runable来执行滚动操作。而且为了避免内存泄漏。将Runable实现类修饰为static。所以歌词列表索引位置有所变化。2.对于歌词的高亮显示，我们可以调用notifyItemChange(intposition)方法，这个方法调用会重新去绘制特定position上的viewHolder。hightLightItem()在这个方法中设置我们想要改变viewHolder的位置,并调用notifyItemChange(intposition)。然后在onBindViewHolder()中的设置可以判断当前是否需要高亮显示。3.对于歌词自动移动到当前语句：本身我的想法就是多设置一个变量还是在这个Runable()里面进行操作。但是一个很严重的问题，导致我连续几天一直想不到对策方法。由于手指离开屏幕的时候我使用postDelayed()方法有可能跟里面Runable里面使用的postDelayed(）时间上可能会相互冲突，事件的执行情况就很有可能变得跟你想不一样。所以我们应该重新写一个Runable（）来控制它的自动移动到当前位置。这样子的话各做各的事情，在写逻辑的时候会比较容易理顺。（当时没想好害我调了好久，一直都不对，哈哈）.对于点击屏幕时就重写onTouchEvent（）方法，在down事件中，设置变量让Runable()事件中不滚动。而对于歌词在离开屏幕后的一段时间后自动回到该位置。同样的，还是需要使用smoothScrollBy()方法移动。而移动多少呢？这是个问题。这个要分为四种情况：第一种：当前歌词在屏幕之外：由于我是打算将歌词移动到屏幕中的第四个位置。那么我就需要找到屏幕中的第一个位置，还有当前显示的是哪一句歌词。由于我是想要让他显示在屏幕的第四行，所以是相差currentWord+5-firstPosition个位置。第二种：当歌词在第四行之前但是在第一行之后。第三种：当歌词在第四行之后但是在最后一行之前。第四种：当歌词在最后一行之后。其实我们就根据自己想要在显示在第几行来判断需要移动多少个位置。我就不详说啦，具体看代码：4.显示中间线条以及显示该歌词时间中间的view不可能镶嵌在RecyclerView中。所以我们要自定义一个布局来放自定义RecyclerView和中间的view。这个是整个的xml文件。中间线的逻辑是当点击屏幕的时候显示出中间的线，离开屏幕的时候过一小段时间消失。也就是需要处理down事件和up事件。但是我们在RecyclerView中是处理了点击事件的，而且本身RecyclerView就已经重写了拦截了该事件的。而且一般是父View是不拦截事件的。那我们要怎么在里面设置down时间和up事件呢？我们怎么能让父View接收到事件处理了一下同时最后又是子view处理事件呢？在此，我推荐一篇博客，里面很详细地介绍了事件分发处理机制的流程。/article/103134.htm

/article/103141.htm我先说一下结论吧。就是重写dispatchTouchEvent()。因为假如我们重写onTouchEvent的话，由于RecyclerView处理了事件。是不会处理这个方法的。而对于dispatchTouchEvent()方法，如果你是在子view中处理事件。那么每次事件都会从dispatchTouchEvent()往下传递。具体原理可以看一下源码。对于显示歌词的时间，由于线条是在最中间的部分，我想要的是中间的线在哪一个item里面显示该item对应时间。对于最原先的做法，我是通过firstPosition第一个看到的item变化时便变化时间。但是如果只是靠第一个可视化位置的话，由于中间线的位置，这样会导致恰好在中间的位置往上移动一点和往下移动一点是两个不同的时间变化。但是此时都是在同一item中。所以我做的是去第二个可视化位置，判断该位置离top与item/2的距离的比较。从而解决问题。最开始只是根据第一个可视化位置而显示的时间，但是显示时间变化的位置不对。改了思路根据第二个可视化位置之后根据位移来判断。点击歌词跳转并且返回时间点击歌词的时候改变高亮的位置和恢复原先的高亮的位置，并且通过回调返回时间。5.点击进度条跳转到相应位置先调用seekBar的onSeekBarChangeListener()中监听方法，获取当前时间，根据时间获得当前应该所处的索引。然后调用自动移动滚动方法和高亮方法。这次做一个自定义View控件，让我有好几点感触，我记录一下，一方面是希望告诫自己，一方面也算是分享给他人吧。当你要做某个控件或项目的时候，不要着急着动笔。要先想好整个流程和框架。这方面先考虑清楚在动笔写。你的逻辑一定要现在白纸上实现一遍后才开始敲代码。就像我之前做的项目还有这次这个控件，我都比较着急写。等到开始运行的时候，出现了跟我想的不太一样。那我又根据结果去改代码，但是这可能只是代表着某一个方面而已，下次有可能其他方面出问题了。这样你就会被问题牵着走，而