iOS---类似小红书的登录背景的循环滚动

最近要做一个类似小红书登录背景的滚动图,原本是新来的哥们在负责, 写完后, 他觉得代码可以优化 ,让我也思考了一下, 我想了想, 换了思路,大致想法如下。

  1. 如果是要调用后台图片, 建议异步下载, 在没下载成功图片之前, 默认先让UI提供本地图片。

  2. 建立View A做图片背景。

  3. 做2组图片放到View A上。

在第一张first_image滚动出屏幕时, frame放置到最后一张的位置的正下方。

  1. 加定时器,注意, 定时器的时间一定要少于uiview animation的时间, 这样不会突然停留。

代码块如下:

加载图片:

- (void)saveImageView{
    
    NSMutableArray *tempArrays = [NSMutableArray array];
    
    for (int index = 1; index < 4; index++) {
        
        [tempArrays addObject:@(index).description];
    }
    
    NSMutableArray *finalArrays = [NSMutableArray array];
    
    for (int index = 0; index < 2; index++) {
        
        [finalArrays addObjectsFromArray:tempArrays];
    }
    
    CGFloat bgViewHeight = 0;
   
    for (int index = 0; index < finalArrays.count; index++) {
        
        UIImage *image = [UIImage imageNamed:finalArrays[index]];
        
        CGFloat imageHeight =  image.size.height / image.size.width * kDeviceWidth;
        
        UIImageView *imageV = [[UIImageView alloc]initWithFrame:CGRectMake(0, bgViewHeight,kDeviceWidth, imageHeight)];
        
        imageV.image = image;
        
        imageV.contentMode = UIViewContentModeScaleAspectFill;

        bgViewHeight += imageHeight;
        
        [self.imageArrays addObject:imageV];
        
        [self.imageHeightArrays addObject:@(imageHeight).description];

        [self.yellowBgView addSubview:imageV];
    }
    
    self.yellowHeightConstraint.constant = bgViewHeight;
}

  1. 添加定时器

- (void)viewWillAppear:(BOOL)animated{
    
    [super viewWillAppear:animated];
    
    self.timer = [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(handleTime) userInfo:nil repeats:YES];
    
    [self move];
}

  1. 定时器调用的方法
- (void)handleTime{
    
    [self move];
    
}

- (void)move{
    
    NSInteger moveSpace = 15;
    
    [UIView animateWithDuration:2 animations:^{

        self.yellowBgView.transform = CGAffineTransformTranslate(self.yellowBgView.transform , 0, - moveSpace);
        
    } completion:^(BOOL finished) {
        
        _movedOriginalY += moveSpace;
        
        if (_movedOriginalY >= [self.imageHeightArrays.firstObject floatValue]){
            
            _movedOriginalY = 0;
            
            UIImageView *imageV = self.imageArrays.firstObject;
            
            UIImageView *finalImageV = self.imageArrays.lastObject;
            
            imageV.frame = CGRectMake(0, CGRectGetMaxY(finalImageV.frame), imageV.width, [self.imageHeightArrays.firstObject floatValue]);
            
            NSLog(@"%@---%@",NSStringFromCGRect(imageV.frame),NSStringFromCGRect(finalImageV.frame));
            
            NSString *firstImgHeight = self.imageHeightArrays.firstObject;
            
            NSString *firstImage = self.imageArrays.firstObject;
            
            [self.imageHeightArrays removeObjectAtIndex:0];
            
            [self.imageArrays removeObjectAtIndex:0];
            
            [self.imageHeightArrays addObject:firstImgHeight];
            
            [self.imageArrays addObject:firstImage];
        }
    }];
}

  1. 定时器调用的方法
- (void)dealloc{
    
    if (_timer){
        
        [self disableTimer];
    }
}

- (void)disableTimer{
    
    [self.timer invalidate];
    self.timer = nil;
}



©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。