前言

跑马灯的应用场景：

  1. iOS 抽奖轮盘边框动画

 原理： 用NSTimer无限替换背景图片1和背景图片2，达到跑马灯的效果


- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{

    [self rotate:_rotaryTable];

}

/**

 iOS翻牌效果

 */
- (void)rotate:(id)sender {

[UIView beginAnimations:@"View Filp" context:nil];
[UIView setAnimationDelay:0.25];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:sender
                          cache:NO];
[UIView commitAnimations];

}


iOS跑马灯控件的应用_iOS


  1. 在待办界面或者工作台界面，往往需要应用到跑马灯的地方


原理：利用QMUIMarqueeLabel 进行cell封装简易的跑马灯 label 控件


iOS跑马灯控件的应用_iOS_02 如用户登陆未绑定手机号，进行提示。


简易的跑马灯 label 控件，在文字超过 label 可视区域时会自动开启跑马灯效果展示文字，文字滚动时是首尾连接的效果 iOS跑马灯控件的应用_iOS_03


I iOS 抽奖轮盘边框动画

原理： 用NSTimer无限替换UIImageView的Image为互为错位的bg_horse_race_lamp_1或者bg_horse_race_lamp_2，达到跑马灯的效果

II 跑马灯label控件实现案例

利用QMUIKit的 QMUIMarqueeLabel进行界面的搭建

升级QMUIKit:​​git:(develop) ✗ pod update QMUIKit --verbose --repo-update ​​

2.1 右侧按钮，右侧跑马灯文字

iOS跑马灯控件的应用_ico_04

  1. 用法


CRMWorkNoteModel模型构建


@interface CRMWorkNoteModel : NSObject
/**
 文字信息
 */
@property (nonatomic,copy) NSString *tiptext;
/**
 icon
 */
@property (nonatomic,copy) NSString *TipiconName;


@property(nonatomic,assign)        NSTextAlignment    textAlignment;   // default is NSTextAlignmentNatural (before iOS 9, the default was NSTextAlignmentLeft)



@property(nonatomic,assign)        BOOL    isNeedChangetextAlignment;   // default is NSTextAlignmentNatural (before iOS 9, the default was NSTextAlignmentLeft)

/**
 cell的高度
 */
@property(nonatomic,assign)        CGFloat    HeightForV;
self.WorkNoteModel = [CRMWorkNoteModel new];

    self.WorkNoteModel.tiptext = @"用户未绑定手机，请至\"我的\">>\"安全管理\"绑定手机号！";
    self.WorkNoteModel.TipiconName = @"icon_shanghu_jinghao_small_24";
  • cell的初始化
switch (indexPath.section) {
        case CRMRisk_merchant_List_VSection4Note:
        {


            CRMWorkNoteCellTableViewCell *cell = [CRMWorkNoteCellTableViewCell tableViewCellWithTableView:tableView block:^(id  sender) {




            } models:self.viewModel.WorkNoteModel];

            return cell;

        }
            break;
  1. cell视图CRMWorkNoteV的构建


CRMWorkNoteV.h


#import <UIKit/UIKit.h>
#import "CRMWorkNoteModel.h"

NS_ASSUME_NONNULL_BEGIN

@interface CRMWorkNoteV : UIView
@property (nonatomic, strong) CRMWorkNoteModel* models;

@property (nonatomic,weak) UIButton *btn;
@property (nonatomic,weak) QMUIMarqueeLabel *titleLable;





@end
  • ​​CRMWorkNoteV.m ​​
//
//  CRMWorkNoteV.m
//  Housekeeper
//
//  Created by mac on 2020/5/20.
//  Copyright © 2020 QCT. All rights reserved.
//

#import "CRMWorkNoteV.h"

@implementation CRMWorkNoteV


- (instancetype)init {
    self = [super init];
    if (self) {////既然nil解析成NO，所以没有必要在条件语句比较。不要拿某样东西直接与YES比较，因为YES被定义为1
        // ...
        [self btn];
        [self titleLable];

    }
    return self;
}

- (UIButton *)btn{
    if (_btn == nil
        ) {
        UIButton *tmp  = [UIButton new];

        [tmp setImage:[UIImage imageNamed:@"icon_shanghu_jinghao_small_24"] forState: UIControlStateNormal];

        _btn = tmp;
        __weak __typeof__(self) weakSelf = self;
        [self addSubview:tmp];

        [_btn mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.equalTo(weakSelf);
            make.height.width.mas_equalTo(kAdjustRatio(15));
            make.left.equalTo(weakSelf).offset(kAdjustRatio(16));
        }];

    }
    return _btn;
}


- (UILabel *)titleLable{
    if (nil == _titleLable) {
        QMUIMarqueeLabel *tmpView = [[QMUIMarqueeLabel alloc]init];
        _titleLable = tmpView;
        tmpView.textAlignment = NSTextAlignmentCenter;// 跑马灯文字一般都是居中显示，所以 Demo 里默认使用 center

//        tmpView.shouldFadeAtEdge = NO;// 关闭渐隐遮罩
//        tmpView.speed = 1.5;// 调节滚动速度

        tmpView.textStartAfterFade = YES;// 文字停靠在遮罩的右边




        [self addSubview:_titleLable];
        __weak __typeof__(self) weakSelf = self;

        [_titleLable mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.equalTo(weakSelf);

            make.left.equalTo(weakSelf.btn.mas_right).offset(kAdjustRatio(6));

            make.right.offset(kAdjustRatio(-10));


        }];
    }
    return _titleLable;
}


- (void)setModels:(CRMWorkNoteModel *)models{
    _models = models;

    [self.btn setImage:[UIImage imageNamed:models.TipiconName] forState:UIControlStateNormal];

    [self setuptitle:models.tiptext];

}

- (void)setuptitle:(NSString*)text{

//     = title;


    NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:text];//_label.text




    [attributedString addAttribute:NSFontAttributeName  value:kPingFangFont(11)  range:NSMakeRange(0, text.length)];


    [attributedString addAttribute:NSForegroundColorAttributeName value:[UIColor colorWithRed:255.0f/255.0f green:162.0f/255.0f blue:29.0f/255.0f alpha:1.0f] range:NSMakeRange(0, text.length)];


    self.titleLable.attributedText = attributedString;

}



@end
  1. cell的封装

由于篇幅原因，完整内容请看​​这里​​

see also

更多内容请关注 #小程序：iOS逆向,只为你呈现有价值的信息，专注于移动端技术研究领域；更多服务和咨询请关注#公众号：iOS逆向。