先看一个效果图:
一张图胜过千言万语,一张动态图更是胜过多张图。
看了动态效果图,看者也就应该猜到了本篇文章要说的大致内容了。
在开发中我们有时会有像效果图中这样的需求。比如我们常用的读书App,每本书都会有一个章节目录,如果一本书的章节目录过多有上千张章的话我们要滑动到后面的某一个张可能需要需要滑动很长时间,而如果有了我们效果中的那个右侧滑动控件则能很快地滑动到后面的某些章节。
实现思路:
1. 首先我们需要创建一个滑动控件,我们利用UISlider(最小值为0,最大值为1)来进行创建。
2. 我们都知道系统给UISlider是一个横向进度控件,这个我们需要先将该控件进行一个九十度的旋转,让其变成一个纵向进行控件,变成纵向进度控件之后再对其frame进行调整。
3. 创建一个UITableView,将UISlider的滑动和UITableView的滑动关联起来(在UISlider滑动的时候让UITableView也随着滑动,在UITableView滑动的时候UISlider也随着滑动)。
4. UITableView和UISlider的具体关联:
4.1 UISlider滑动的时候让UITableView跟着滑动:当UISlider滑动的时候UISlider的value值会发生变化,此时让(value值)乘以(UITableView的数据源总长度-1)获得一个数值,然后让UITableView滑动到该数值所对应的行上。
4.2 UITableView滑动的时候让UISlider跟着滑动:当UITableView滑动的时候记录下它的偏移量,(偏移量)除以(UITableView上所有cell的总高度)获得一个数值,然后将此数值赋值给UISlider的value即可。(注意:1. 当偏移量不小于0的时候改变UISlider的value值 2.当偏移量小于UITableView的高度的时候利用偏移量除以UITableView的总高度,当偏移量大于UITableView的高度的时候利用偏移量和UITableView的高度之和处以UITableView的总高度)。
注意:在滑动UISlider的时候此时UITableView也会滑动但不能再通过UITableView的滑动再去改变UISlider的值。
someone say:talk is sheep,show me your code
demo地址: https://gitee.com/liangsenliangsen/longitudinal_progress_bar.git
本篇文章到这里就结束了,愿大家加班不多工资多,男同胞都有女朋友,女同胞都有男朋友。😊