【IOS】自定义可点击的多文本跑马灯YFRollingLabel
需求
项目中需要用到跑马灯来仅展示一条消息，长度合适则不滚动，过长则循环滚动。
虽然不是我写的，但看了看代码，是在一个UIView里面放入两个UILabel，
在前一个快结束的时候，另一个显示。然而点击处理的 确是UIView的点击事件。
然而看到比如地铁、公交里面的跑马灯是分了很多段显示的。虽然说可以将多段合并为一段来显示，
但是如果各个需要点击事件又该如何处理呢？于是我来自己实现可点击的多段跑马灯。
所以这篇随笔我要实现的跑马灯包含下面这种效果:（图中有5段 点击不同文本可触发相应的事件）
弯路
还记得上一篇随笔【IOS】将字体大小不同的文字底部对齐 么？
虽然不能够做到多个UILabel的底部对齐，但是我们可以通过继承UILabel来改变文本竖直方向的位置。
所以呢，我最初的想法是继承UILabel,可以保持其继承性, 通过NSTimer来直接慢慢移动UILable里面的文本。
这里出现了两个问题：（以@"这是自定义跑马灯里面要移动的文本"为例）
1.移动是可以移动，但是在文本左移至快要看不见(只剩下"移动的文本")的时候, 如何让@"这是.."开始从右侧出现呢？
2.文本过长的时候，看不见的部分将被截断，所以在移动的时候，只有部分文本了。
第一种好像没有办法，UILabel只存在一个文本的bounds, 不可能让他一部分在左边, 一部分在右边。
第二种就因为存在默认的属性NSLineBreakMode:NSLineBreakByWordWrapping,就算不截断文本也只会变为省略号。
所以这种方法作罢。。。。
实现
首先要明确的是本跑马灯继承了UIView且需要两个UILabel、定时器NSTimer。
在初始化时，传入字符串数组，并计算各个字符串的自适应大小
CGRect textRect = [((NSString *)_textArray[i]) boundingRectWithSize:maxSize options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:kFont} context:nil];
[_textRectArray addObject:[NSValue valueWithCGRect:textRect]];
如果传入的字符串数组个数为1且自适应宽度<UIView宽度，则不会滚动。重新写一个UILabel用于显示就行了
其他情况下，就是可以滚动的, 在此实例化两个UILabel，并打开定时器了:
定时器相关:
_timer = [NSTimer scheduledTimerWithTimeInterval:0.02 target:self selector:@selector(timerAction:) userInfo:nil repeats:YES]; [[NSRunLoop mainRunLoop] addTimer:_timer forMode:NSRunLoopCommonModes];
//为什么要将定时器起放入LOOP中呢?
//如果此RunLoop正在执行一个连续性的运算，timer就会被延时出发。
//也就是说，如果你将跑马灯放入scrollview上，当滑动scrollview的时候，定时器就不会动了
//相关方法:
//[_timer setFireDate:[NSDate date]]; 开始 //[_timer setFireDate:[NSDate distantFuture]]; 暂停
//取消定时器
//[_timer invalidate]; //_timer = nil; //防止野指针
//定时器执行事件：
-(void)timerAction:(NSTimer *)timer{}
现在我们要做的 就是在每次进入该方法的时候来设置两个UILabel。
好了，现在假设传入了4个字符串@[@"这个是第0个字符串",@"这个是第1个字符串",@"这个是第2个字符串",@"这个是第3个字符串"];
只有两个Label, 不管向右滚动还是向左滚动，我们将最初显示的定为Labels[0], 后来显示的定位Labels[1]
定义一个变量，实时的存放前一个UILabel的origin.X值，从0开始
1.每次前一个UILabel暂未完全隐藏前，后一个UIlabel就已经出现 （两者间有一个固定的距离 internalWidth）
还需要根据speed的值更改Labels[0]的大小的增减来控制Labels[0]的位置（更改offsetX值)。
通过这个距离和前一个的位置则可以实时的计算后一个UILabel的位置（origin.X值）。
2.每次前一个UILabel完全隐藏时就需要重新设置一个值， 此时刻在每次前一个UILabel完全看不到后只进入一次
同时将左右两个UILabel变换一下位置。 往左滚动: A<--B，A消失后，A跑到B右边去了; 成为B<--A，B消失后，又要到A右边去。
所以只需要设置offsetX = _labels[1].frame.origin.x;//A消失后，将后面的B位置作为下一个将消失的label的位置，A变为后面一个，
//其位置根据B的位置实时计算出来。每次前一个消失后，如此循环的更换。
但是这样只更改了位置，文本以及大小却没有变换，见3.
3.对于只有一个文本来说，AB的内容都是一样的。但是对于传入的四个字符串而言，每次重新设置值的时候，需要更改AB内容。
同时，对于长度不等的字符串，需要根据不同的文本大小来设置相应AB的Frame。
所以需将四个字符串文本大小，文本内容在之前保存为一个数组。定义一个始终记录当前正准备消失的（前一个）UIlabel的位置：_currentIndex
在步骤1中： 从两个数组中分别获取用于显示在A.B里的文本数组：labelTextArray frame数组:labelArray（从中取得宽和高）
每次AB位置交换的时候，需将currentIndex+1 : 即_currentIndex = (_currentIndex + 1) % _textArray.count;以供交换后使用。
之后分别取得当前以及下一个的Text和frame 分别保存到长度为2的数组 以便使用
上面太多、太乱。。。。。。我不想看我不想看我不想看。。。。。。
这里有图: 看完上面还完全不懂的请看这个吧。
再次解释
<===============左移==================
================右移=================>
现在只看颜色 从图中看可以到 无论左滚右滚 绿色始终是Labels[0](将要消失的Label) 红色始终是Label[1]
正常滚动情况下:
绿色的offsetX值随着speed而变 : self.offsetX = self.offsetX - sign * self.speed;
红色的X值会随着绿色的offsetX和固定间距的关系而变 : CGFloat nextOffX = self.offsetX + sign * (((self.orientation == RollingOrientationLeft)? firstRect.size.width : lastRect.size.width) + self.internalWidth);
通过_currentIndex值从保存到的数据中获取到红色、绿色的内容和大小后赋值:
当绿色消失的一瞬间:
本该是在右边的红色一下子吓绿了 : self.offsetX = _labels[1].frame.origin.x;
消失的绿色又将会按照正常滚动的情况下变为红色
_currentIndex指得始终是绿色内容的索引: _currentIndex = (_currentIndex + 1) % _textArray.count;
通过这个值又将会获取按照正常滚动的情况下 红色、绿色的大小和文本内容
(两个又将会进行的流程将会在"正常滚动情况下"的蓝色部分操作)
}
好了 解释到此结束 看着好累。。。。 慢着 还有点击事件没写完
点击事件：在给UILabel添加了Tap手势后进行处理
-(void)labelTap:(UITapGestureRecognizer *)gesture{ NSInteger tag = ((UILabel *)[gesture view]).tag - 100; NSInteger index; if(tag == 0){ //如果是(Labels[0])绿色 index = _currentIndex; }else if (tag == 1){ //如果是(Labels[1])红色 就是当前点击的后一个 index = (_currentIndex + 1) % _textArray.count; }else{ index = _currentIndex; }
if(self.labelClickBlock){ self.labelClickBlock(index); } }
终点
代码见GitHub: ====> YFRollingLabel PS：源码以及GitHub文档都是用蹩脚的英语写的，也不知道会不会有人看。。
另外说明记录存在的问题：
对于放入的文本数组 长度不能太短 因为里面只有两个UILabel 如果长度太短的话 并且间距也小的情况下
在绿色刚消失后， 又会立马变为红色，出现在目前的绿色右边，而不是慢慢的移动出现。
文本太长太长的话(几百个中文，正常情况下不会设置这么多吧), 会导致获取的文本宽度过长，UILabel宽度过长，文本直接就不显示了，但点击事件还是有的 说明了还存在。。。这就搞不懂。。。
好了，终于写完了，Windows 10 Mobile 万岁！！！
PS:新的知识点:CADisplayLink
CADisplayLink是一个能让我们以和屏幕刷新率相同的频率（每秒60次）将内容画到屏幕上的定时器。
但如果调用的方法比较耗时，超过了屏幕刷新周期，就会导致跳过若干次回调调用机会。
//创建 CADisplayLink displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(doSomeThing:)]; [displayLink addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSDefaultRunLoopMode]; //设置是否停止 displayLink.Pause = NO/YES; //释放 [displayLink invalidate]; displayLink = nil;
