ios垂直轮播label

作者: JemmyChen | 来源:发表于2017-12-21 14:43 被阅读0次

    使用两个Label(也可以为view,可以在view上添加图片等,原理一样)实现垂直方向的广告轮播

    广告对于一个App来说是必不可少的,随之而来的就是各种各样的广告展现方式,最常见的就是banner,图片轮播了,常用的第三方框架SDCycleScrollView

    ​ 今天给大家实现一下垂直轮播的广告(因为公司需要,所以写了下,小白一枚不足的地方尽情指出来:smile:);原理如下图:


    38759134-F6DE-4BC3-A04D-A4285AE6C079.png

    两个label初始位置为1和2,当1和2滚动到3的位置时,重新定位到2的初始位置。如此一来就实现了无限滚动。

    效果图:

    1.gif

    verticalScroll.h中代码如下:

    #import <UIKit/UIKit.h>
    
    @interface verticalScrollView : UIView
    //滚动的时间间隔
    @property(nonatomic,assign)NSTimeInterval interval;
    //数据源
    @property(nonatomic,strong)NSArray *dataArray;
    @end
    

    .m中代码:

    #import "verticalScrollView.h"
    
    @interface verticalScrollView(){
    
    //定时器,让label动起来
    NSTimer *timer;
    //第一个label
    UILabel *firstLabel;
        
    //第二个label
    UILabel *secondLabel;
    }
    @end
    
    @implementation verticalScrollView
    
    -(instancetype)initWithFrame:(CGRect)frame{
        self=[super initWithFrame:frame];
        if (self) {
            CGFloat width=frame.size.width;
            CGFloat height=frame.size.height;
            self.backgroundColor=[UIColor redColor];
            firstLabel=[[UILabel alloc] initWithFrame:self.bounds];
            secondLabel=[[UILabel alloc] initWithFrame:CGRectMake(0, height, width, height)];
            firstLabel.text=self.dataArray[0];
            [firstLabel setTextColor:[UIColor blackColor]];
            secondLabel.text=self.dataArray[1];
            [secondLabel setTextColor:[UIColor blackColor]];
            [self addSubview:firstLabel];
            [self addSubview:secondLabel];
            self.clipsToBounds=YES;
            timer=[NSTimer scheduledTimerWithTimeInterval:self.interval target:self selector:@selector(scroll) userInfo:nil repeats:YES];
        }
        return self;
    }
    NSInteger I=1;
    -(void)scroll{
        I++;
        i=i>self.dataArray.count-1?0:i;
        CGFloat height=firstLabel.frame.size.height;
        CGFloat width=firstLabel.frame.size.width;
        [UIView animateWithDuration:1 animations:^{
            NSArray *labelArray=self.subviews;
          //让label滚动起来
            for (UIView *view in labelArray) {
                if ([view isKindOfClass:[UILabel class]]) {
                    UILabel *label=(UILabel *)view;
                    CGRect rect=label.frame;
                    rect.origin.y-=height;
                    label.frame=rect;
                }
            }
            
        } completion:^(BOOL finished) {
          //重新定位label的位置
            if (firstLabel.frame.origin.y==-height) {
                firstLabel.frame=CGRectMake(0, height,width,height);
                firstLabel.text=self.dataArray[I];
            }
            if (secondLabel.frame.origin.y==-height) {
                secondLabel.frame=CGRectMake(0,height, width,height);
                secondLabel.text=self.dataArray[I];
    
            }
        }];
        
    }
    //释放定时器
    -(void)dealloc{
        [timer invalidate];
        timer=nil;
    }
    @end
    
    

    到此滚动广告已经封装完了,现在可以调用了。

    调用代码:

    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        _aview=[[verticalScrollView alloc] initWithFrame:CGRectMake(100, 100, 200, 40)];
        _aview.interval=2.0f;
        [self.view addSubview:_aview];
        
    }
    @end
    

    相关文章

      网友评论

        本文标题:ios垂直轮播label

        本文链接:https://www.haomeiwen.com/subject/qhrawxtx.html