AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

iOS - 跑马灯、弹幕

2016-08-12 2192
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 1、跑马灯具体实现代码见 GitHub 源码 QExtensionQMarqueeView.h #pragma mark - QMarqueeViewDelegate /// 跑马灯内容点击处理协议 @protocol QMarqueeViewDelegate ...

1、跑马灯

  • 具体实现代码见 GitHub 源码 QExtension

  • QMarqueeView.h

        #pragma mark - QMarqueeViewDelegate

    /// 跑马灯内容点击处理协议
    @protocol QMarqueeViewDelegate <NSObject>

    - (void)didClickContentAtIndex:(NSInteger)index;

    @end


    #pragma mark - QMarqueeView

    /// 跑马灯滚动方向枚举
    typedef NS_ENUM(NSUInteger, QMarqueeViewDirection) {
        QMarqueeViewDirectionUp,
        QMarqueeViewDirectionDown,
        QMarqueeViewDirectionLeft,
        QMarqueeViewDirectionRight
    };

    @interface QMarqueeView : UIView

    /// 显示的文本内容
    @property (nonatomic, strong) NSArray *contentTexts;

    /// 显示的文本内容颜色，default is redColor
    @property (nonatomic, strong) UIColor *contentTextColor;

    /// 显示的文本内容字体，default is 15.0
    @property (nonatomic, strong) UIFont *contentTextFont;

    /// 显示的文本内容对齐方式，default is NSTextAlignmentLeft
    @property (nonatomic, assign) NSTextAlignment contentTextAlign;

    /// 显示的图标内容，可以为 nil 不显示图标
    @property (nonatomic, strong) UIImage *contentIcon;

    /// 动画方向，default is QMarqueeViewDirectionUp
    @property (nonatomic, assign) QMarqueeViewDirection animationDirection;

    /// 动画时间，等于 0 时不滚动
    @property (nonatomic, assign) NSTimeInterval animationDuration;

    /// 动画停顿时间，default is 1.0 秒
    @property (nonatomic, assign) NSTimeInterval animationDelay;

    /// 代理
    @property (nonatomic, weak) id<QMarqueeViewDelegate> delegate;

    /**
     *  开始动画
     */
    - (void)q_startAnimation;

    /**
     *  创建跑马灯视图控件，开始滚动
     *
     *  @param frame        跑马灯对象的 frame
     *  @param texts        显示的文本内容
     *  @param color        显示的文本内容颜色，default is redColor
     *  @param font         显示的文本内容字体，default is 15.0
     *  @param align        显示的文本内容对齐方式，default is NSTextAlignmentLeft
     *  @param icon         显示的图片内容
     *  @param direction    动画方向，default is QMarqueeViewDirectionUp
     *  @param duration     动画时间，等于 0 时不滚动
     *  @param delay        动画停顿时间，default is 1.0 秒
     *  @param target       代理
     *
     *  @return 跑马灯视图控件
     */
    + (instancetype)q_marqueeViewWithFrame:(CGRect)frame
                                     texts:(NSArray *)texts
                                     color:(nullable UIColor *)color
                                      font:(nullable UIFont *)font
                                     align:(NSTextAlignment)align
                                      icon:(nullable UIImage *)icon
                                 direction:(QMarqueeViewDirection)direction
                                  duration:(NSTimeInterval)duartion
                                     delay:(NSTimeInterval)delay
                                    target:(nullable id<QMarqueeViewDelegate>)target;

    @end

  • QMarqueeView.m

        #define SELF_WIDTH      self.frame.size.width
    #define SELF_HEIGHT     self.frame.size.height

    @interface QMarqueeView ()

    /// 两个 label 循环滚动
    @property (nonatomic, strong) UILabel *firstContentLabel;
    @property (nonatomic, strong) UILabel *secondContentLabel;

    /// 显示图片的视图
    @property (nonatomic, strong) UIImageView *imageView;

    /// 当前显示的行
    @property (nonatomic, assign) NSInteger currentIndex;

    /// 文本内容的起始位置、宽度、高度
    @property (nonatomic, assign) CGFloat contentX;
    @property (nonatomic, assign) CGFloat contentWidth;
    @property (nonatomic, assign) CGFloat contentHeight;

    @end

    @implementation QMarqueeView

    /// 创建跑马灯视图控件，开始滚动
    + (instancetype)q_marqueeViewWithFrame:(CGRect)frame
                                     texts:(NSArray *)texts
                                     color:(nullable UIColor *)color
                                      font:(nullable UIFont *)font
                                     align:(NSTextAlignment)align
                                      icon:(nullable UIImage *)icon
                                 direction:(QMarqueeViewDirection)direction
                                  duration:(NSTimeInterval)duartion
                                     delay:(NSTimeInterval)delay
                                    target:(nullable id<QMarqueeViewDelegate>)target {

        QMarqueeView *marqueeView = [[self alloc] initWithFrame:frame];

        marqueeView.contentTexts = texts;
        marqueeView.contentTextColor = color;
        marqueeView.contentTextFont = font;
        marqueeView.contentTextAlign = align;
        marqueeView.contentIcon = icon;
        marqueeView.animationDirection = direction;
        marqueeView.animationDuration = duartion;
        marqueeView.animationDelay = delay;
        marqueeView.delegate = target;

        [marqueeView q_startAnimation];

        return marqueeView;
    }

    /// 创建视图控件
    - (void)setupView {

        // 父视图裁剪
        self.clipsToBounds = YES;

        // 控件之间的间隔值
        CGFloat margin = 10;

        // 判断是否有图标
        if (self.contentIcon) {

            // 添加 Icon 视图
            CGRect iconBackFrame = CGRectMake(0, 0, margin + SELF_HEIGHT, SELF_HEIGHT);
            UIView *iconBackView = [[UIView alloc] initWithFrame:iconBackFrame];
            iconBackView.backgroundColor = [UIColor clearColor];
            [self addSubview:iconBackView];

            CGRect iconFrame = CGRectMake(margin, 0, SELF_HEIGHT, SELF_HEIGHT);
            self.imageView = [[UIImageView alloc] initWithFrame:iconFrame];
            self.imageView.backgroundColor = [UIColor clearColor];
            self.imageView.image = self.contentIcon;
            [iconBackView addSubview:self.imageView];

            // 计算 Texts 的 frame 值
            self.contentX = margin + SELF_HEIGHT;
            self.contentWidth = SELF_WIDTH - self.contentX - margin;

        } else {

            // 计算 Texts 的 frame 值
            self.contentX = margin;
            self.contentWidth = SELF_WIDTH - self.contentX - margin;
        }
        self.contentHeight = SELF_HEIGHT;

        // 创建第一个 label
        CGRect frame1 = CGRectMake(0, 0, self.contentWidth, self.contentHeight);
        self.firstContentLabel = [[UILabel alloc] initWithFrame:frame1];
        [self setLabel:self.firstContentLabel];

        // 创建第二个 label
        if (self.animationDirection <= 1) {

            CGRect frame2 = CGRectMake(0, SELF_HEIGHT, self.contentWidth, self.contentHeight);
            self.secondContentLabel = [[UILabel alloc] initWithFrame:frame2];
            [self setLabel:self.secondContentLabel];
        }
    }

    /// 设置 label 属性
    - (void)setLabel:(UILabel *)label {

        // 设置 label 背景视图
        CGRect frame;
        if (self.contentIcon == nil && self.animationDirection > 1) {
            frame = CGRectMake(0, 0, SELF_WIDTH, self.contentHeight);
        } else {
            frame = CGRectMake(self.contentX, 0, self.contentWidth, self.contentHeight);
        }
        UIView *textBackView = [[UIView alloc] initWithFrame:frame];
        textBackView.backgroundColor = [UIColor clearColor];
        textBackView.clipsToBounds = YES;
        [self addSubview:textBackView];

        // 设置默认值
        UIColor *textColor = self.contentTextColor ? : [UIColor redColor];
        UIFont *textFont = self.contentTextFont ? : [UIFont systemFontOfSize:15.0f];
        NSTextAlignment textAlign = self.contentTextAlign ? : NSTextAlignmentLeft;

        // 设置 label 属性
        label.backgroundColor = [UIColor clearColor];
        label.lineBreakMode = NSLineBreakByTruncatingTail;
        label.textColor = textColor;
        label.font = textFont;
        label.textAlignment = textAlign;
        label.userInteractionEnabled = YES;
        UITapGestureRecognizer *tap1 = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(contentClick)];
        [label addGestureRecognizer:tap1];
        [textBackView addSubview:label];
    }

    /// 开启滚动动画
    - (void)startLoopAnimation {

        // 设置默认值
        NSTimeInterval delay = 0;
        NSTimeInterval duration = 0;
        CGFloat currentContentWidth = self.contentWidth;

        // 设置第一个 label 显示的内容
        self.firstContentLabel.text = self.contentTexts[self.currentIndex];

        // 滚动时间为 0 时，停止滚动
        if (0 == self.animationDuration) {
            return;
        } else {
            if (self.animationDirection > 1) {  // 左右滚动

                // 不停顿
                delay = 0;

                // 计算文本内容长度
                currentContentWidth = [self.firstContentLabel.text sizeWithAttributes:@{NSFontAttributeName:(self.contentTextFont ? : 
                                                                                            [UIFont systemFontOfSize:15.0f])}].width;

                duration = self.animationDuration * currentContentWidth / 150;

            } else {    // 垂直滚动

                // 动画停顿时间，默认为 1.0 秒
                delay = self.animationDelay ? : 1.0f;

                duration = self.animationDuration;

                // 设置第二个 label 显示的内容
                NSInteger secondCurrentIndex  = self.currentIndex + 1;
                if (secondCurrentIndex > self.contentTexts.count - 1) {
                    secondCurrentIndex = 0;
                }
                self.secondContentLabel.text = self.contentTexts[secondCurrentIndex];
            }
        }

        CGFloat firstContentLastStartX = 0;
        CGFloat firstContentLastEndX = 0;

        CGFloat firstContentLastStartY = 0;
        CGFloat firstContentLastEndY = 0;
        CGFloat secondContentLastStartY = 0;
        CGFloat secondContentLastEndY = 0;

        // 判断滚动方向
        switch (self.animationDirection) {

            case QMarqueeViewDirectionUp: {

                firstContentLastStartY = 0;
                firstContentLastEndY = -SELF_HEIGHT;

                secondContentLastStartY = firstContentLastStartY + SELF_HEIGHT;
                secondContentLastEndY = firstContentLastEndY + SELF_HEIGHT;

                break;
            }

            case QMarqueeViewDirectionDown: {

                firstContentLastStartY = 0;
                firstContentLastEndY = SELF_HEIGHT;

                secondContentLastStartY = firstContentLastStartY - SELF_HEIGHT;
                secondContentLastEndY = firstContentLastEndY - SELF_HEIGHT;

                break;
            }

            case QMarqueeViewDirectionLeft: {

                firstContentLastStartX = self.contentWidth;
                firstContentLastEndX = -currentContentWidth;

                break;
            }

            case QMarqueeViewDirectionRight: {

                firstContentLastStartX = -currentContentWidth;
                firstContentLastEndX = self.contentWidth;

                break;
            }

            default:
                break;
        }

        // 设置开始时的 frame
        CGRect frame1;
        CGRect frame2;
        if (self.animationDirection > 1) {
            frame1 = CGRectMake(firstContentLastStartX, 0, currentContentWidth, self.contentHeight);
        } else {
            frame1 = CGRectMake(0, firstContentLastStartY, self.contentWidth, self.contentHeight);
            frame2 = CGRectMake(0, secondContentLastStartY, self.contentWidth, self.contentHeight);
        }
        self.firstContentLabel.frame = frame1;
        self.secondContentLabel.frame = frame2;

        // 开始一次滚动动画
        [UIView beginAnimations:@"" context:nil];
        [UIView setAnimationCurve:UIViewAnimationCurveLinear];
        [UIView setAnimationDuration:duration];
        [UIView setAnimationDelay:delay];
        [UIView setAnimationDelegate:self];
        [UIView setAnimationDidStopSelector:@selector(loopAnimationDidStop:finished:context:)];

        // 设置结束时的 frame
        CGRect frame3;
        CGRect frame4;
        if (self.animationDirection > 1) {
            frame3 = CGRectMake(firstContentLastEndX, 0, currentContentWidth, self.contentHeight);
        } else {
            frame3 = CGRectMake(0, firstContentLastEndY, self.contentWidth, self.contentHeight);
            frame4 = CGRectMake(0, secondContentLastEndY, self.contentWidth, self.contentHeight);
        }
        self.firstContentLabel.frame = frame3;
        self.secondContentLabel.frame = frame4;

        // 结束一次滚动动画
        [UIView commitAnimations];
    }

    /// 一次动画结束事件响应处理
    - (void)loopAnimationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {

        self.currentIndex++;
        if (self.currentIndex >= self.contentTexts.count) {
            self.currentIndex = 0;
        }

        // 重新开启滚动动画
        [self startLoopAnimation];
    }

    /// 开始滚动
    - (void)q_startAnimation {

        // 创建视图
        [self setupView];

        // 开启动画默认第一条信息
        self.currentIndex = 0;

        // 开始滚动动画
        [self startLoopAnimation];
    }

    /// 文本内容点击事件处理
    - (void)contentClick {

        if ([self.delegate respondsToSelector:@selector(didClickContentAtIndex:)]) {
            [self.delegate didClickContentAtIndex:self.currentIndex];
        }
    }

    @end

  • 使用

    • 1、初始化

      • QMarqueeView 继承自 UIView, 初始化和 UIView 一样

            // 创建跑马灯视图控件
    CGRect frame = CGRectMake(0, 50, self.view.bounds.size.width, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 常规设置，QMarqueeView 继承自 UIView, 设置和 UIView 一样
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [[UIColor grayColor] colorWithAlphaComponent:0.5];
    [self.view addSubview:marqueeView];

      • 也可以使用类方法一体式创建设置

            // 创建滚动视图，开始滚动
    CGRect frame = CGRectMake(30, 250, self.view.bounds.size.width - 100, 30);
    QMarqueeView *marqueeView = [QMarqueeView q_marqueeViewWithFrame:frame
                                                               texts:showList
                                                               color:[UIColor whiteColor]
                                                                font:nil
                                                               align:NSTextAlignmentLeft
                                                                icon:[UIImage imageNamed:@"waring1"]
                                                           direction:QMarqueeViewDirectionDown
                                                            duration:1.0
                                                               delay:0
                                                              target:self];
    [self.view addSubview:marqueeView];

    • 2、设置显示的文本内容

      • 文本内容存放到数组中设置

            // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    marqueeView.contentTexts = showList;

      • 文本内容可选属性设置，可以设置文本内容的颜色、字体、及对齐方式

            // 显示的文本内容颜色，default is redColor
    marqueeView.contentTextColor = [UIColor whiteColor];

    // 显示的文本内容字体，default is 15.0
    marqueeView.contentTextFont = [UIFont boldSystemFontOfSize:18];

    // 显示的文本内容对齐方式，default is NSTextAlignmentLeft
    marqueeView.contentTextAlign = NSTextAlignmentCenter;

    • 3、设置显示的图标内容

      • 除显示文本内容外，还可以可选设置显示左侧图标

            // 显示的图标内容，可以为 nil 不显示图标
    marqueeView.contentIcon = [UIImage imageNamed:@"waring1"];

    • 4、设置动画时间

      • 动画时间等于 0 时不进行滚动

            // 设置动画时间
    marqueeView.animationDuration = 5.0;

    • 5、设置动画方向

      • 不设置时默认向上滚动

            // 设置动画方向，default is QMarqueeViewDirectionUp
    marqueeView.animationDirection = QMarqueeViewDirectionRight;

    • 6、设置动画停顿时间

      • 一次动画滚动完成后可以设置停顿时间，不设置时默认为 1.0 秒

            // 设置动画停顿时间，default is 1.0 秒
    marqueeView.animationDelay = 2.0;

    • 7、设置点击回调代理

      • 点击显示的内容时可以可选设置响应代理

            // 设置代理，响应滚动视图点击
    marqueeView.delegate = self;

    • 8、开始滚动动画

      • 添加设置完成后，开启动画

            // 开始动画
    [marqueeView q_startAnimation];

1.1 垂直滚动

  • 1、垂直滚动，左侧对齐

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(0, 50, self.view.bounds.size.width, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];
    marqueeView.contentTextFont = [UIFont boldSystemFontOfSize:18];

    // 设置动画时间
    marqueeView.animationDuration = 0.2;

    // 常规设置
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label6

  • 2、垂直滚动，中间对齐

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(0, 50, self.view.bounds.size.width, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];
    marqueeView.contentTextFont = [UIFont boldSystemFontOfSize:18];

    // 设置动画时间
    marqueeView.animationDuration = 0.2;

    // 设置显示的内容对齐方式
    marqueeView.contentTextAlign = NSTextAlignmentCenter;

    // 常规设置
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label7

  • 3、垂直滚动，带图标

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(30, 150, self.view.bounds.size.width - 150, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"GitHub：QianChia"];
    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];

    // 设置显示的图标
    marqueeView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    marqueeView.animationDuration = 0.5;

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label8Label9

  • 4、垂直滚动，向下滚动

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(30, 200, self.view.bounds.size.width - 150, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"GitHub：QianChia"];
    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];
    marqueeView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    marqueeView.animationDuration = 0.5;

    // 设置动画方向
    marqueeView.animationDirection = QMarqueeViewDirectionDown;

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label10Label11

  • 5、垂直滚动，由类方法创建

        // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    // 创建跑马灯视图控件，开始滚动
    CGRect frame = CGRectMake(30, 250, self.view.bounds.size.width - 100, 30);
    QMarqueeView *marqueeView = [QMarqueeView q_marqueeViewWithFrame:frame
                                                               texts:showList
                                                               color:[UIColor whiteColor]
                                                                font:nil
                                                               align:NSTextAlignmentLeft
                                                                icon:[UIImage imageNamed:@"waring1"]
                                                           direction:QMarqueeViewDirectionDown
                                                            duration:1.0
                                                               delay:0
                                                              target:self];

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [[UIColor grayColor] colorWithAlphaComponent:0.5];
    [self.view addSubview:marqueeView];

    • 效果

      Label12Label13

1.2 水平滚动

  • 1、水平滚动，向左滚动

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(50, 350, self.view.bounds.size.width - 100, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];
    marqueeView.contentTextFont = [UIFont boldSystemFontOfSize:18];
    marqueeView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    marqueeView.animationDuration = 5.0;

    // 设置动画方向
    marqueeView.animationDirection = QMarqueeViewDirectionLeft;

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label14Label15

  • 2、水平滚动，向右滚动

        // 创建跑马灯视图控件
    CGRect frame = CGRectMake(50, 400, self.view.bounds.size.width - 100, 30);
    QMarqueeView *marqueeView = [[QMarqueeView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    marqueeView.contentTexts = showList;
    marqueeView.contentTextColor = [UIColor whiteColor];
    marqueeView.contentTextFont = [UIFont boldSystemFontOfSize:18];
    marqueeView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    marqueeView.animationDuration = 5.0;

    // 设置动画方向
    marqueeView.animationDirection = QMarqueeViewDirectionRight;

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:marqueeView];

    // 开始滚动
    [marqueeView q_startAnimation];

    • 效果

      Label16Label17

  • 3、水平滚动，由类方法创建

        // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    // 创建跑马灯视图控件，开始滚动
    CGRect frame = CGRectMake(30, 450, self.view.bounds.size.width - 60, 30);
    QMarqueeView *marqueeView = [QMarqueeView q_marqueeViewWithFrame:frame
                                                               texts:showList
                                                               color:nil
                                                                font:nil
                                                               align:0
                                                                icon:[UIImage imageNamed:@"waring2"]
                                                           direction:QMarqueeViewDirectionLeft
                                                            duration:4.0
                                                               delay:0
                                                              target:self];

    // 常规设置
    marqueeView.layer.cornerRadius = 15;
    marqueeView.layer.masksToBounds = YES;
    marqueeView.backgroundColor = [[UIColor grayColor] colorWithAlphaComponent:0.5];
    [self.view addSubview:marqueeView];

    • 效果

      Label18

2、弹幕

  • 具体实现代码见 GitHub 源码 QExtension

  • QBulletScreenView.h

        #pragma mark - QBulletScreenViewDelegate

    /// 跑马灯内容点击处理协议
    @protocol QBulletScreenViewDelegate <NSObject>

    - (void)didClickContentAtIndex:(NSInteger)index;

    @end


    #pragma mark - QBulletScreenView

    /// 弹幕滚动方向枚举
    typedef NS_ENUM(NSUInteger, QBulletScreenViewDirection) {
        QBulletScreenViewDirectionUp,
        QBulletScreenViewDirectionDown,
        QBulletScreenViewDirectionLeft,
        QBulletScreenViewDirectionRight
    };

    @interface QBulletScreenView : UIView

    /// 显示的文本内容
    @property (nonatomic, strong) NSArray *contentTexts;

    /// 显示的文本内容颜色，default is redColor
    @property (nonatomic, strong) UIColor *contentTextColor;

    /// 显示的文本内容字体，default is 15.0
    @property (nonatomic, strong) UIFont *contentTextFont;

    /// 显示的图标内容，可以为 nil 不显示图标
    @property (nonatomic, strong) UIImage *contentIcon;

    /// 动画方向，default is QBulletScreenViewDirectionLeft
    @property (nonatomic, assign) QBulletScreenViewDirection animationDirection;

    /// 动画时间，等于 0 时不滚动
    @property (nonatomic, assign) NSTimeInterval animationDuration;

    /// 代理
    @property (nonatomic, weak) id<QBulletScreenViewDelegate> delegate;

    /**
     *  开始动画
     */
    - (void)q_startAnimation;

    /**
     *  创建弹幕视图控件
     *
     *  @param frame        跑马灯对象的 frame
     *  @param texts        显示的文本内容
     *  @param color        显示的文本内容颜色，default is redColor
     *  @param font         显示的文本内容字体，default is 15.0
     *  @param icon         显示的图片内容
     *  @param direction    动画方向，default is QMarqueeViewDirectionUp
     *  @param duration     动画时间，等于 0 时不滚动
     *  @param target       代理
     *
     *  @return 弹幕视图控件
     */
    + (instancetype)q_bulletScreenWithFrame:(CGRect)frame
                                      texts:(NSArray *)texts
                                      color:(nullable UIColor *)color
                                       font:(nullable UIFont *)font
                                       icon:(nullable UIImage *)icon
                                  direction:(QBulletScreenViewDirection)direction
                                   duration:(NSTimeInterval)duartion
                                     target:(nullable id<QBulletScreenViewDelegate>)target;

    @end

  • QBulletScreenView.m

        #define SELF_WIDTH      self.frame.size.width
    #define SELF_HEIGHT     self.frame.size.height

    @interface QBulletScreenView ()

    /// label
    @property (nonatomic, strong) UILabel *contentLabel;

    /// 显示图片的视图
    @property (nonatomic, strong) UIImageView *imageView;

    /// 当前显示的行
    @property (nonatomic, assign) NSInteger currentIndex;

    /// 文本内容的起始位置、宽度、高度
    @property (nonatomic, assign) CGFloat contentX;
    @property (nonatomic, assign) CGFloat contentWidth;
    @property (nonatomic, assign) CGFloat contentHeight;

    /// 弹幕视图的位置、宽度、高度
    @property (nonatomic, assign) CGFloat viewX;
    @property (nonatomic, assign) CGFloat viewY;
    @property (nonatomic, assign) CGFloat viewWidth;
    @property (nonatomic, assign) CGFloat viewHeight;

    @end

    @implementation QBulletScreenView

    /// 创建弹幕视图控件
    + (instancetype)q_bulletScreenWithFrame:(CGRect)frame
                                      texts:(NSArray *)texts
                                      color:(nullable UIColor *)color
                                       font:(nullable UIFont *)font
                                       icon:(nullable UIImage *)icon
                                  direction:(QBulletScreenViewDirection)direction
                                   duration:(NSTimeInterval)duartion
                                     target:(nullable id<QBulletScreenViewDelegate>)target {

        QBulletScreenView *bulletScreenView = [[self alloc] initWithFrame:frame];

        bulletScreenView.contentTexts = texts;
        bulletScreenView.contentTextColor = color;
        bulletScreenView.contentTextFont = font;
        bulletScreenView.contentIcon = icon;
        bulletScreenView.animationDirection = direction;
        bulletScreenView.animationDuration = duartion;
        bulletScreenView.delegate = target;

        return bulletScreenView;
    }

    /// 创建视图控件
    - (void)setupView {

        // 父视图裁剪
        self.clipsToBounds = YES;

        // 控件之间的间隔值
        CGFloat margin = 10;

        // 判断是否有图标
        if (self.contentIcon) {

            // 添加 Icon 视图
            CGRect iconFrame = CGRectMake(margin, 0, SELF_HEIGHT, SELF_HEIGHT);
            self.imageView = [[UIImageView alloc] initWithFrame:iconFrame];
            self.imageView.backgroundColor = [UIColor clearColor];
            self.imageView.image = self.contentIcon;
            [self addSubview:self.imageView];

            // 计算 Texts 的 frame 值
            self.contentX = margin + SELF_HEIGHT;
            self.contentWidth = SELF_WIDTH - self.contentX - margin;

        } else {

            // 计算 Texts 的 frame 值
            self.contentX = margin * 2;
            self.contentWidth = SELF_WIDTH - self.contentX - margin;
        }
        self.contentHeight = SELF_HEIGHT;
        self.viewHeight = SELF_HEIGHT;

        // 设置默认值
        UIColor *textColor = self.contentTextColor ? : [UIColor redColor];
        UIFont *textFont = self.contentTextFont ? : [UIFont systemFontOfSize:15.0f];

        // 创建 label
        CGRect frame1 = CGRectMake(self.contentX, 0, self.contentWidth, self.contentHeight);
        self.contentLabel = [[UILabel alloc] initWithFrame:frame1];
        self.contentLabel.backgroundColor = [UIColor clearColor];
        self.contentLabel.lineBreakMode = NSLineBreakByTruncatingTail;
        self.contentLabel.textColor = textColor;
        self.contentLabel.font = textFont;
        self.contentLabel.userInteractionEnabled = YES;
        UITapGestureRecognizer *tap1 = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(contentClick)];
        [self.contentLabel addGestureRecognizer:tap1];
        [self addSubview:self.contentLabel];
    }

    /// 开启滚动动画
    - (void)startLoopAnimation {

        // 控件之间的间隔值
        CGFloat margin = 10;

        // 设置默认值
        NSTimeInterval duration = 0;
        CGFloat currentContentWidth = self.contentWidth;

        // 设置第一个 label 显示的内容
        self.contentLabel.text = self.contentTexts[self.currentIndex];

        // 滚动时间为 0 时，停止滚动
        if (0 == self.animationDuration) {
            return;
        } else {

            // 计算文本内容长度
            currentContentWidth = [self.contentLabel.text sizeWithAttributes:@{NSFontAttributeName:(self.contentTextFont ? : 
                                                                                   [UIFont systemFontOfSize:15.0f])}].width;

            CGRect frame = CGRectMake(self.contentX, 0, currentContentWidth, self.contentHeight);
            self.contentLabel.frame = frame;

            self.viewWidth = self.contentX + currentContentWidth + margin * 2;

            if (self.animationDirection > 1) {  // 左右滚动
                duration = self.animationDuration * currentContentWidth / 150;
            } else {    // 垂直滚动
                duration = self.animationDuration;
            }
        }

        CGFloat viewLastStartX = 0;
        CGFloat viewLastEndX = 0;

        CGFloat viewLastStartY = 0;
        CGFloat viewLastEndY = 0;

        // 判断滚动方向
        switch (self.animationDirection) {

            case QBulletScreenViewDirectionUp: {

                viewLastStartY = self.superview.bounds.size.height;
                viewLastEndY = -self.viewHeight;

                break;
            }

            case QBulletScreenViewDirectionDown: {

                viewLastStartY = -self.viewHeight;
                viewLastEndY = self.superview.bounds.size.height;

                break;
            }

            case QBulletScreenViewDirectionLeft: {

                viewLastStartX = self.superview.bounds.size.width;
                viewLastEndX = -self.viewWidth;

                break;
            }

            case QBulletScreenViewDirectionRight: {

                viewLastStartX = -self.viewWidth;
                viewLastEndX = self.superview.bounds.size.width;

                break;
            }

            default:
                break;
        }

        self.viewX = self.frame.origin.x;
        self.viewY = self.frame.origin.y;

        // 设置开始时的 frame
        CGRect frame1;
        if (self.animationDirection > 1) {
            frame1 = CGRectMake(viewLastStartX, self.viewY, self.viewWidth, self.contentHeight);
        } else {
            frame1 = CGRectMake(self.viewX, viewLastStartY, self.viewWidth, self.contentHeight);
        }
        self.frame = frame1;

        // 开始一次滚动动画
        [UIView beginAnimations:@"" context:nil];
        [UIView setAnimationCurve:UIViewAnimationCurveLinear];
        [UIView setAnimationDuration:duration];
        [UIView setAnimationDelay:0];
        [UIView setAnimationDelegate:self];
        [UIView setAnimationDidStopSelector:@selector(loopAnimationDidStop:finished:context:)];

        // 设置结束时的 frame
        CGRect frame2;
        if (self.animationDirection > 1) {
            frame2 = CGRectMake(viewLastEndX, self.viewY, self.viewWidth, self.contentHeight);
        } else {
            frame2 = CGRectMake(self.viewX, viewLastEndY, self.viewWidth, self.contentHeight);
        }
        self.frame = frame2;

        // 结束一次滚动动画
        [UIView commitAnimations];
    }

    /// 一次动画结束事件响应处理
    - (void)loopAnimationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {

        self.currentIndex++;
        if (self.currentIndex >= self.contentTexts.count) {
            self.currentIndex = 0;
        }

        // 重新开启滚动动画
        [self startLoopAnimation];
    }

    /// 开始滚动
    - (void)q_startAnimation {

        // 创建视图
        [self setupView];

        // 开启动画默认第一条信息
        self.currentIndex = 0;

        // 开始滚动动画
        [self startLoopAnimation];
    }

    /// 文本内容点击事件处理
    - (void)contentClick {

        if ([self.delegate respondsToSelector:@selector(didClickContentAtIndex:)]) {
            [self.delegate didClickContentAtIndex:self.currentIndex];
        }
    }

    @end

  • 使用

    • 1、初始化

      • QBulletScreenView 继承自 UIView, 初始化和 UIView 一样

            // 创建弹幕视图控件
    CGRect frame = CGRectMake(0, 100, 0, 30);
    QBulletScreenView *bulletScreenView = [[QBulletScreenView alloc] initWithFrame:frame];

    // 常规设置，QBulletScreenView 继承自 UIView, 设置和 UIView 一样
    bulletScreenView.layer.cornerRadius = 15;
    bulletScreenView.layer.masksToBounds = YES;
    bulletScreenView.backgroundColor = [[UIColor grayColor] colorWithAlphaComponent:0.5];
    [self.view addSubview:bulletScreenView];

      • 也可以使用类方法一体式创建设置

            // 创建弹幕视图控件，开始滚动
    CGRect frame = CGRectMake(0, 100, 0, 30);
    QBulletScreenView *bulletScreenView = [QBulletScreenView q_bulletScreenWithFrame:frame
                                                                               texts:showList
                                                                               color:[UIColor whiteColor]
                                                                                font:nil
                                                                                icon:[UIImage imageNamed:@"waring1"]
                                                                           direction:QBulletScreenViewDirectionLeft
                                                                            duration:5.0
                                                                              target:nil];
    [self.view addSubview:bulletScreenView];

    • 2、设置显示的文本内容

      • 文本内容存放到数组中设置

            // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    bulletScreenView.contentTexts = showList;

      • 文本内容可选属性设置，可以设置文本内容的颜色、字体

            // 显示的文本内容颜色，default is redColor
    bulletScreenView.contentTextColor = [UIColor whiteColor];

    // 显示的文本内容字体，default is 15.0
    bulletScreenView.contentTextFont = [UIFont boldSystemFontOfSize:18];

    • 3、设置显示的图标内容

      • 除显示文本内容外，还可以可选设置显示左侧图标

            // 显示的图标内容，可以为 nil 不显示图标
    bulletScreenView.contentIcon = [UIImage imageNamed:@"waring1"];

    • 4、设置动画时间

      • 动画时间等于 0 时不进行滚动

            // 设置动画时间
    bulletScreenView.animationDuration = 5.0;

    • 5、设置动画方向

      • 不设置时默认向上滚动

            // 设置动画方向，default is QBulletScreenViewDirectionUp
    bulletScreenView.animationDirection = QBulletScreenViewDirectionLeft;

    • 6、设置点击回调代理

      • 点击显示的内容时可以可选设置响应代理

            // 设置代理，响应滚动视图点击
    bulletScreenView.delegate = self;

    • 7、开始滚动动画

      • 添加设置完成后，开启动画

            // 开始动画
    [bulletScreenView q_startAnimation];

2.1 水平向左移动

  • 水平向左移动

        // 创建弹幕视图控件
    CGRect frame = CGRectMake(0, 100, 0, 30);   // x, width 设置无效
    QBulletScreenView *bulletScreenView = [[QBulletScreenView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    bulletScreenView.contentTexts = showList;
    bulletScreenView.contentTextColor = [UIColor whiteColor];
    bulletScreenView.contentTextFont = [UIFont boldSystemFontOfSize:18];
    bulletScreenView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    bulletScreenView.animationDuration = 5.0;

    // 设置动画方向
    bulletScreenView.animationDirection = QBulletScreenViewDirectionLeft;

    // 常规设置
    bulletScreenView.layer.cornerRadius = 15;
    bulletScreenView.layer.masksToBounds = YES;
    bulletScreenView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [self.view addSubview:bulletScreenView];

    // 开始滚动
    [bulletScreenView q_startAnimation];

    • 效果

      Label19Label20

2.2 水平向右移动

  • 水平向右移动

        // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    // 创建弹幕视图控件
    CGRect frame = CGRectMake(0, 200, 0, 30);   // x, width 设置无效
    QBulletScreenView *bulletScreenView = [QBulletScreenView q_bulletScreenWithFrame:frame
                                                                               texts:showList
                                                                               color:[UIColor whiteColor]
                                                                                font:nil
                                                                                icon:[UIImage imageNamed:@"waring1"]
                                                                           direction:QBulletScreenViewDirectionRight
                                                                            duration:5.0
                                                                              target:nil];

    // 常规设置
    bulletScreenView.layer.cornerRadius = 15;
    bulletScreenView.layer.masksToBounds = YES;
    bulletScreenView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.5];
    [self.view addSubview:bulletScreenView];

    // 开始滚动
    [bulletScreenView q_startAnimation];

    • 效果

      Label21Label22

2.3 水平向上移动

  • 水平向上移动

        // 创建弹幕视图控件
    CGRect frame = CGRectMake(10, 0, 0, 30);   // y, width 设置无效
    QBulletScreenView *bulletScreenView = [[QBulletScreenView alloc] initWithFrame:frame];

    // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    bulletScreenView.contentTexts = showList;
    bulletScreenView.contentTextColor = [UIColor whiteColor];
    bulletScreenView.contentTextFont = [UIFont boldSystemFontOfSize:18];
    bulletScreenView.contentIcon = [UIImage imageNamed:@"waring1"];

    // 设置动画时间
    bulletScreenView.animationDuration = 2.0;

    // 设置动画方向
    bulletScreenView.animationDirection = QBulletScreenViewDirectionUp;

    // 常规设置
    bulletScreenView.layer.cornerRadius = 15;
    bulletScreenView.layer.masksToBounds = YES;
    bulletScreenView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [backView addSubview:bulletScreenView];

    // 开始滚动
    [bulletScreenView q_startAnimation];

    • 效果

      Label23

2.4 水平向下移动

  • 水平向下移动

        // 设置显示的内容
    NSArray *showList = @[@"1. Hello World",
                          @"2. 欢迎大家关注哦！",
                          @"3. GitHub：QianChia",
                          @"4. 新浪微博：QianChia0123",
                          @"5. 个人博客：cnblogs.com/QianChia"];

    // 创建弹幕视图控件
    CGRect frame = CGRectMake(10, 0, 0, 30);   // y, width 设置无效
    QBulletScreenView *bulletScreenView = [QBulletScreenView q_bulletScreenWithFrame:frame
                                                                               texts:showList
                                                                               color:[UIColor whiteColor]
                                                                                font:[UIFont boldSystemFontOfSize:18]
                                                                                icon:[UIImage imageNamed:@"waring1"]
                                                                           direction:QBulletScreenViewDirectionDown
                                                                            duration:2.0
                                                                              target:nil];

    // 常规设置
    bulletScreenView.layer.cornerRadius = 15;
    bulletScreenView.layer.masksToBounds = YES;
    bulletScreenView.backgroundColor = [UIColor colorWithRed:102/255.0f green:133/255.0f blue:253/255.0f alpha:1];
    [backView addSubview:bulletScreenView];

    // 开始滚动
    [bulletScreenView q_startAnimation];

    • 效果

      Label24

文章标签：
iOS开发
QianChia
目录
相关文章
shuj
|
1月前
|
Java Android开发 Swift
安卓与iOS开发对比：平台选择对项目成功的影响
【10月更文挑战第4天】在移动应用开发的世界中，选择合适的平台是至关重要的。本文将深入探讨安卓和iOS两大主流平台的开发环境、用户基础、市场份额和开发成本等方面的差异，并分析这些差异如何影响项目的最终成果。通过比较这两个平台的优势与挑战，开发者可以更好地决定哪个平台更适合他们的项目需求。
shuj
98 1
游客moiomvrp3vyac2
|
1月前
|
设计模式 安全 Swift
探索iOS开发：打造你的第一个天气应用
【9月更文挑战第36天】在这篇文章中，我们将一起踏上iOS开发的旅程，从零开始构建一个简单的天气应用。文章将通过通俗易懂的语言，引导你理解iOS开发的基本概念，掌握Swift语言的核心语法，并逐步实现一个具有实际功能的天气应用。我们将遵循“学中做，做中学”的原则，让理论知识和实践操作紧密结合，确保学习过程既高效又有趣。无论你是编程新手还是希望拓展技能的开发者，这篇文章都将为你打开一扇通往iOS开发世界的大门。
游客moiomvrp3vyac2
51 6
shuj
|
1月前
|
搜索推荐 IDE API
打造个性化天气应用：iOS开发之旅
【9月更文挑战第35天】在这篇文章中，我们将一起踏上iOS开发的旅程，通过创建一个个性化的天气应用来探索Swift编程语言的魅力和iOS平台的强大功能。无论你是编程新手还是希望扩展你的技能集，这个项目都将为你提供实战经验，帮助你理解从构思到实现一个应用的全过程。让我们开始吧，构建你自己的天气应用，探索更多可能！
shuj
61 1
游客moiomvrp3vyac2
|
2月前
|
IDE Android开发 iOS开发
探索Android与iOS开发的差异：平台选择对项目成功的影响
【9月更文挑战第27天】在移动应用开发的世界中，Android和iOS是两个主要的操作系统平台。每个系统都有其独特的开发环境、工具和用户群体。本文将深入探讨这两个平台的关键差异点，并分析这些差异如何影响应用的性能、用户体验和最终的市场表现。通过对比分析，我们将揭示选择正确的开发平台对于确保项目成功的重要作用。
游客moiomvrp3vyac2
52 4
人间真情在哪儿
|
2月前
|
开发框架 数据可视化 Java
iOS开发-SwiftUI简介
iOS开发-SwiftUI简介
人间真情在哪儿
107 3
我不是游客20240119
|
3天前
|
设计模式 前端开发 Swift
探索iOS开发：从初级到高级的旅程
【10月更文挑战第31天】在这篇文章中，我们将一起踏上iOS开发的旅程。无论你是初学者还是有经验的开发者，这篇文章都将为你提供有价值的信息和技巧。我们将从基础开始，逐步深入到更高级的技术和概念。让我们一起探索iOS开发的世界吧！
我不是游客20240119
10 3
技术混子
|
6天前
|
设计模式 前端开发 Swift
探索iOS开发：从初级到高级的旅程
【10月更文挑战第28天】在这篇技术性文章中，我们将一起踏上一段探索iOS开发的旅程。无论你是刚入门的新手，还是希望提升技能的开发者，这篇文章都将为你提供宝贵的指导和灵感。我们将从基础概念开始，逐步深入到高级主题，如设计模式、性能优化等。通过阅读这篇文章，你将获得一个清晰的学习路径，帮助你在iOS开发领域不断成长。
技术混子
31 2
肥猪肥猪-17824
|
12天前
|
安全 API Swift
探索iOS开发中的Swift语言之美
【10月更文挑战第23天】在数字时代的浪潮中，iOS开发如同一艘航船，而Swift语言则是推动这艘船前进的风帆。本文将带你领略Swift的独特魅力，从语法到设计哲学，再到实际应用案例，我们将一步步深入这个现代编程语言的世界。你将发现，Swift不仅仅是一种编程语言，它是苹果生态系统中的一个创新工具，它让iOS开发变得更加高效、安全和有趣。让我们一起启航，探索Swift的奥秘，感受编程的乐趣。
肥猪肥猪-17824
19 1
shuj
|
14天前
|
Swift iOS开发 开发者
探索iOS开发中的SwiftUI框架
【10月更文挑战第21天】在苹果生态系统中，SwiftUI的引入无疑为iOS应用开发带来了革命性的变化。本文将通过深入浅出的方式，带领读者了解SwiftUI的基本概念、核心优势以及如何在实际项目中运用这一框架。我们将从一个简单的例子开始，逐步深入到更复杂的应用场景，让初学者能够快速上手，同时也为有经验的开发者提供一些深度使用的技巧和策略。
shuj
39 1
游客qf4jmczx4xu2y
|
2天前
|
存储 数据可视化 Swift
探索iOS开发之旅：从新手到专家
【10月更文挑战第33天】在这篇文章中，我们将一起踏上一场激动人心的iOS开发之旅。无论你是刚刚入门的新手，还是已经有一定经验的开发者，这篇文章都将为你提供宝贵的知识和技能。我们将从基础的iOS开发概念开始，逐步深入到更复杂的主题，如用户界面设计、数据存储和网络编程等。通过阅读这篇文章，你将获得成为一名优秀iOS开发者所需的全面技能和知识。让我们一起开始吧！
游客qf4jmczx4xu2y
6 0