【IOS】最简单方式实现跑马灯文字效果

实现跑马等效果,如果想要实现,头部跟尾部同时出现在一个屏幕中的话,应该使用两个 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
这是一个大工程,请从工程中寻找相关模块代码.