实现跑马等效果,如果想要实现,头部跟尾部同时出现在一个屏幕中的话,应该使用两个 Label 比较好实现,于是有了以下思路.
@interface JDMarqueeView ()
@property (nonatomic,copy) NSString *msg; //需要展示的消息
@property (nonatomic,assign) CGFloat textW; //文字长度
@property (nonatomic,retain) UILabel *firstLabel; //跑马灯的两个 label
@property (nonatomic,retain) UILabel *secondLabel;
@end
@implementation JDMarqueeView
- (instancetype)initWithFrame:(CGRect)frame andMessage:(NSString *)message
{
self = [super initWithFrame:frame];
if (self) {
self.clipsToBounds =YES;
//为了两个 label 不至于文字连在一起
_msg = [NSString stringWithFormat:@" %@ ",message];
[self createUI];
}
return self;
}
- (void)createUI {
_firstLabel =[JDUtils createLabelWithFrame:CGRectZero Font:14 Text:_msg];
_firstLabel.textAlignment =NSTextAlignmentLeft;
[_firstLabel sizeToFit];
//设置居中
_firstLabel.centerY =self.sizeHeight/2;
[self addSubview:_firstLabel];
_textW = _firstLabel.sizeWidth;
//如果文字长度大于控件宽度,则开始滚动
if (_textW>self.sizeWidth) {
_secondLabel =[JDUtils createLabelWithFrame:_firstLabel.frame Font:14 Text:_msg];
_secondLabel.textAlignment =NSTextAlignmentLeft;
_secondLabel.originX =CGRectGetMaxX(_firstLabel.frame);
[_secondLabel sizeToFit];
[self addSubview:_secondLabel];
[self startAnimation];
}
}
- (void)startAnimation
{
//计算走完一次需要的时间
NSInteger time = _msg.length / num;
[UIView animateWithDuration:time delay:0 options:UIViewAnimationOptionCurveLinear|UIViewAnimationOptionRepeat animations:^{
_firstLabel.originX =-_textW;
_secondLabel.originX = 0;
} completion:nil];
}
@end
虽然这个跑马灯实现简单,但是有几点缺点
1.文字滚动初始位置必须是从View左侧开始.
2.文字无法暂停
Demo地址:https://github.com/yuying2012/WJDStudyLibrary
这是一个大工程,请从工程中寻找相关模块代码.