zoukankan      html  css  js  c++  java
  • IOS游戏陪玩系统源码开发,滚动字幕的实现

    水平连续滚动字幕:
    这种一看就是一组view放在scrollview实现的滚动,但是如何实现循环滚动呢,思路如下
    1:加入滚动字幕有五组文本,滚动到最后一组时,后面应该紧跟着第一组文本,如此才能实现连续滚动
    2:我们可以把传入的文本个数翻倍,来实现最后一组文本后面又跟着第一组的文本(如果数据太少可以翻4倍,6倍,总之最好双倍数,否则x轴坐标处理会麻烦一点)
    3:我们可以让滚动框在最后一个文本滚动消失后,重置滚动框的坐标,如此反复,就可以实现无线循环
    在这里插入图片描述

    //获取到最大滚动范围就可以启动滚动事件
    -(void)setScrMaxW:(NSInteger)scrMaxW{
        _scrMaxW=scrMaxW;
        
        self.textScrollview.contentSize=CGSizeMake(scrMaxW, 0);
        
        [self addTimer];
    
    }
    
    - (void)timerClick
    {
        self.scrX=self.scrX+1;
        
        [UIView animateWithDuration:0.1 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
            [self.textScrollview setContentOffset:CGPointMake(self.scrX, 0) animated:NO];
        } completion:nil];
        //滚动到可滚动区域的一半时重置
        if (self.textScrollview.contentOffset.x+1>=self.textScrollview.contentSize.width/2) {
            self.scrX=0;
            [self.textScrollview setContentOffset:CGPointMake(self.scrX, 0) animated:NO];
    
        }else{
            
        }
       
    }
    

    水平翻页滚动字幕:
    这种的更简单,只需要一个label,只要在滚动过程中不断地改变label展示文本就可以了
    1:实时计算要加载的文本的宽度,加上屏宽*2,将label放在最中间
    2:每次label消失之后,更新展示文本和滚动区域
    3:展示完成最后一个文本后,文本下一个要再展示第一个文本实现循环
    在这里插入图片描述
    关键代码:

    -(void)setTextArr:(NSMutableArray *)textArr{
        _textArr=textArr;
        
        self.txtLabel.text=textArr[0];
        
        self.scrollWidth=[self getTxtWidth:textArr[0]];
        
    //    初始展示的字幕可以根据需求调整,放在最左边或者默认在屏幕右侧
        [self.textScrollview setContentOffset:CGPointMake(ViewAllWidth, 0) animated:NO];
    
    //    初始展示文本下标
        self.arrNum=0;
        
        [self addTimer];
    
    }
    
    
    - (void)timerClick
    {
        self.scrX=self.scrX+1;
    
        [UIView animateWithDuration:0.1 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
            [self.textScrollview setContentOffset:CGPointMake(self.scrX, 0) animated:NO];
        } completion:nil];
    
        if (self.textScrollview.contentOffset.x>=self.textScrollview.contentSize.width-ViewAllWidth) {
    
            [self refreshTxt];
    
        }else{
    
        }
       
    }
    
    -(void)refreshTxt{
        
        if (self.arrNum==self.textArr.count-1) {
            self.arrNum=0;
        }else{
            self.arrNum=self.arrNum+1;
    
        }
        self.txtLabel.text=self.textArr[self.arrNum];
        self.scrollWidth=[self getTxtWidth:self.textArr[self.arrNum]];
        
        self.scrX=0;
        [self.textScrollview setContentOffset:CGPointMake(self.scrX, 0) animated:NO];
        
    }
    
    -(void)setScrollWidth:(CGFloat)scrollWidth{
        _scrollWidth=scrollWidth;
        
        self.textScrollview.contentSize=CGSizeMake(scrollWidth+ViewAllWidth*2, 0);
    
    }
    
    

    竖直多行翻页循环滚动:
    大家看着这个动画是不是有一点熟悉,“拼夕夕”里面,拼单页面就有这样UI。
    像这种第五个文本后面紧跟着第一个文本的,而且又是循环滚动的,其实思路和第一个水平滚动的是一样的,同样数据翻倍,滚动完一次重置,这样就可以实现循环
    不过这里我换成了tableview来实现,没有用数组添加UI了
    关键代码:

    -(void)setSxArry:(NSMutableArray *)sxArry{
        
        _sxArry=sxArry;
        
        //将要显示的文本数量翻倍
        [_sxArry addObjectsFromArray:[NSArray arrayWithArray:sxArry]];
      
    }
    
    -(void)scrollTableveiwcell{
        
        __weak typeof(self)  weakSelf=self;
    
        //    整个滚动完一次,回到初始状态
        if (self.scrollSection==self.sxArry.count/2) {
    
            self.scrollSection=0;
            [self.fightTableView setContentOffset:CGPointMake(0, 0) animated:NO];
    
        }else{
            
        }
    
        [UIView transitionWithView: self.fightTableView duration:0.3 options: UIViewAnimationOptionTransitionNone animations: ^{
    
            [weakSelf.fightTableView setContentOffset:CGPointMake(0, weakSelf.fightTableView.contentOffset.y+cellHeight) animated:YES];
            
        } completion: ^(BOOL finished) {
    
            weakSelf.scrollSection=weakSelf.scrollSection+1;
    
        }];
    
    }
    
    

    竖直翻页滚动字幕:
    最后的这个滚动字幕实现方案很多,可以像上面水平翻页的思路一样,也可以添加上下两个label来循环展示文本实现,不过这里不用NSTimer也能实现

    -(void)checkDataIndex{
        
        if (self.arrNum==self.sxArry.count-1) {
            self.arrNum=0;
        }else{
            self.arrNum=self.arrNum+1;
        }
        
    }
    
    - (void)scrollTxtAction {
        
        [UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
            
            CATransition *transition = [CATransition animation];
            transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
            transition.type = kCATransitionPush;
            transition.subtype = kCATransitionFromTop;
            transition.delegate = self;
            [self.txtLabel.layer addAnimation:transition forKey:nil];
            
            [self checkDataIndex];
            
        } completion:^(BOOL finished) {
           
            self.txtLabel.text=self.sxArry[self.arrNum];
    
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                
                [self scrollTxtAction];
                
            });
            
        }];
    }
    

    最后要处理一下滚动区域的问题

    //展示区域多余的部分截去,否则在动画滚动的时候,会跑到区域外面
            self.verBgView.layer.masksToBounds=YES;

    以上就是IOS游戏陪玩系统源码开发,滚动字幕的实现的全部内容了,希望对大家有帮助。

    ​本文转载自网络,转载仅为分享干货知识,如有侵权欢迎联系云豹科技进行删除处理

    原文链接:https://www.jianshu.com/p/7ea6ee8b9bc7

  • 相关阅读:
    redis远程连接超时
    GNU LIBC源代码学习之strcmp
    计算最小生成树
    域名和空间的绑定问题
    Spring MVC 基于Method的映射规则(注解版)
    Spring MVC 基于URL的映射规则(注解版)
    手把手教你编写Logstash插件
    Ruby中如何识别13位的时间戳
    [logstash-input-http] 插件使用详解
    Java直接(堆外)内存使用详解
  • 原文地址:https://www.cnblogs.com/yunbao/p/14959294.html
Copyright © 2011-2022 走看看