效果图
开始上代码
滚动字幕的原理是用timer定时器间隔一定的时间来驱动scrollView上的内容偏移，来实现滚动的效果，原理比较简单，关键是有些细节需要处理好，实现流畅效果的同时要考虑到性能优化
这里是.h文件的接口方法及属性，可适应大部分自定义场景
/*初始化*/
-(instancetype)initWithFrame:(CGRect)frame textArray:(NSArray *)textArray colorArray:(NSArray *)textColorArray;
//滚动字幕数组
@property(nonatomic,strong) NSArray<NSString *> *textArray;
//字幕颜色数组
@property(nonatomic,strong) NSArray<UIColor *> *textColorArray;
//字幕背景颜色
@property(nonatomic,strong) UIColor *backgroundColorOfCanvas;
//标签背景图片
@property(nonatomic,strong) UIImage *backgroundImageOfCanvas;
//字体大小
@property(nonatomic,assign) CGFloat fontOfSize;
//定时器
@property(nonatomic,strong) NSTimer *timer;
实现滚动字幕的思路和无限轮播图相似，这里用了一点小技巧即可实现字幕的收尾连续相接：将同样的字幕内容复制一份拼接到后面就可以了，当字幕的scrollView滚动到复制的那份内容开头时，将contentOffset偏移量设置到原始内容的开头，这样就可以实现无缝的连续循环滚动了
#pragma mark - 创建scrollView内容
-(void)createContentOfScrollView{
//创建contentView
self.contentSize=CGSizeMake(0, self.bounds.size.height);
//偏移量初值设为0
self.contentOffset=CGPointMake(0, 0);
//关闭指示条
self.showsHorizontalScrollIndicator=NO;
//创建label
CGFloat labelY=0;
CGFloat labelW=200;
CGFloat labelH=self.bounds.size.height;
//添加两次一样的内容，无限循环使用
for (int j=0; j<2;j++ ) {
for (int i=0; i<self.textArray.count; i++) {
UILabel *textLabel=[[UILabel alloc] initWithFrame:CGRectMake(self.contentSize.width, labelY, labelW, labelH)];
//******标签背景******
UIImageView *labelBackGroundView=[[UIImageView alloc] initWithFrame:textLabel.frame];
//标签背景图片
labelBackGroundView.image=self.backgroundImageOfCanvas;
//*****label文字******
if (i<self.textArray.count) {
textLabel.text=self.textArray[i];
}else{
textLabel.text=@"----";
}
//label文字颜色(判断文字颜色数组是否存有对应的颜色，没有则使用默认颜色)
if (i<self.textColorArray.count) {
textLabel.textColor=self.textColorArray[i];
}else{
//默认颜色
textLabel.textColor=[UIColor blackColor];
}
//******字体大小********
textLabel.font=[UIFont systemFontOfSize:self.fontOfSize];
//label标签tag值
textLabel.tag=LABEL_TAG_INIT + i + 100 * j;
//每创建一个label在contenSize上加上一个label的宽度
self.contentSize=CGSizeMake(self.contentSize.width+labelW, self.bounds.size.height);
[self addSubview:labelBackGroundView];
[self addSubview:textLabel];
}
}
}
