美文网首页界面iOS 实用ios小功能
SDLaunch:一个杂七杂八,却功能完整的广告引导页

SDLaunch:一个杂七杂八,却功能完整的广告引导页

作者: 神经骚栋 | 来源:发表于2016-11-28 08:55 被阅读1312次

    前言


    在App中的广告页面比较常见,新手导引更是不用说,基本上每一个应用都必备一个新手导引.虽然现在封装的三方比较多,但是骚栋还是想自己造造轮子,SDLaunch是一个具有多种页面类型的引导页.其中包括,广告页面类型新手导引类型 ** 、 GIF背景页面类型滚动图背景页面类型**四种形式,基本上能满足所有的引导页需求.下面我们就看一下SDLunch的使用规范.

    SDLaunch使用说明


    SDLaunch三方的主体是SDLaunchViewController,SDLaunchViewController是一个继承于UIViewController的类,这个类使用到了SDWebImage这个三方,如果项目中已经导入SDWebImage,请删除SDLunch的SDWebImage.
    SDLaunchWebViewController是用于广告页面加载的一个控制器.控制器是以模态视图形式展示的.
    SDLunch是需要在AppDelegate中代码指定根视图控制器的,这是需要注意的一点.

    ❗️❗️❗️❗️注意:如果同时加载本地图片数组和服务器图片数组,本地图片将不会生效.建议使用本地图片~因为服务器图片可能会造成卡顿,使用户体验效果下降.

    </b>

    SDLaunchViewController基础属性和方法


    SDLaunchViewController一共有两个基础方法和一个公共属性.如下代码所示.其中,两个基础方法一个是用于初始化SDLaunchViewController对象,并且制定页面类型.一个是用于跳转页面.公共属性是endButton,只要页面类型不是ADLaunchViewController,其他类型默认都是有这个按钮,所以声明属性,方便使用者调用.

    /**
    初始化SDLaunchViewController
     */
    -(instancetype)initWithMainVC:(UIViewController *)mainVC viewControllerType:(LaunchViewControllerType )viewControllerType;
    
    
    /**
     跳转到App的根视图控制器
     */
    -(void)skipAppRootMainViewController;
    
    
    /**
     结束导引按钮,只要页面类型不是ADLaunchViewController,其他类型都有这个按钮,所以要拿出来.
     */
    @property(nonatomic,strong)UIButton *endButton;
    
    

    SDLaunchViewController的类型有四个,我们需要在初始化的时候就指定SDLaunchViewController的类型,类型是一个枚举值,具体如下所示.接下来我们会对每一种页面类型所对应的属性进行说明.

    typedef enum {
        ADLaunchViewController,//广告类型
        GreenhandLaunchViewController,//轮播图新手导引类型
        GifBackgroundLaunchViewController,//gif图背景类型
        RollImageLaunchViewController//滚动图片类型
    } LaunchViewControllerType;
    
    

    广告类型的SDLaunch


    上面说到了SDLaunchViewController的基本属性和方法,下面我们就说说如何在工程中使用SDLaunchViewController,首先我们需要把Demo中的SDLaunch这个文件夹导入工程.然后,我们就需要在AppDelegate中初始化我们的SDLaunchViewController,设置页面类型为ADLaunchViewController.由于广告页面大多数是动态的,所以我们需要指定广告图片的URL以及广告页面的URL,最后指定为根式图控制器.具体代码如下所示.

        self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
        self.window.backgroundColor = [UIColor whiteColor];
    
        SDLaunchViewController *vc = [[SDLaunchViewController alloc]initWithMainVC:[[ViewController alloc]init] viewControllerType:ADLaunchViewController];
        
        vc.imageURL = @"http://pic.qiantucdn.com/58pic/17/80/57/94s58PICA7j_1024.jpg";
        
        vc.adURL = @"http://www.jianshu.com/users/e39da354ce50/latest_articles";
        self.window.rootViewController = vc;
        
        [self.window makeKeyAndVisible];
    

    效果图如下所示.

    ADLaunchViewController类型所对应的其他属性如下所示,我们可以根据自己的需求定制特殊的广告页面.

    
    /**
     广告页面标题
     */
    @property(nonatomic,strong)NSString *titleString;
    
    /**
     广告页面是否允许跳过,默认可以点击跳过
     */
    @property(nonatomic,assign)BOOL isSkip;
    
    ❗️❗️❗️注意广告类型的SDLaunch如果加载的是服务器广告图片可能有延迟,所以占位图要设置为引导图的图片,这样用户体验就提高了,但是第一次使用可能会出现倒计秒数变少问题.
    占位图设置

    新手导引类型的SDLaunch


    新手导引类型的SDLaunch主要用于首次进入App使用,类型枚举值为GreenhandLaunchViewController,其中新手导引我们初始化步骤和广告类型的步骤相同,但是我们需要传入的图片是一个数组类型,如果是本地的图片,我们传入的是图片名称数组(imageNameArray),如果是服务器端图片,我们传入的是图片的URL字符串数组(imageURLArray).这里有一点需要注意的是当两者同时传入的时候,默认的是使用服务器端的图片URL数组.具体示例代码如下所示.

        self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
        self.window.backgroundColor = [UIColor whiteColor];
        
        SDLaunchViewController *vc = [[SDLaunchViewController alloc]initWithMainVC:[[ViewController alloc]init] viewControllerType:GreenhandLaunchViewController];
        
        vc.imageNameArray = @[@"新手指导1",@"新手指导2"];
        
        self.window.rootViewController = vc;
        
        
        [self.window makeKeyAndVisible];
    
    

    效果图如下所示.

    当然了,新手导引也是有对应的额外属性的,比如对endButton(进入应用控制器按钮)和pageControl(页面标记),我们都可以进行专属定制.

    GIF背景类型的SDLaunch


    有很多的时候,我们需要定制一个动态图背景的页面,这不单单是在引导页所需要的,SDLaunch的GifBackgroundLaunchViewController类型就是用来完成这一任务的.这一类型中我们需要指定GIF图片的本地名称或者是图片的URL地址.同时这一个类型声明了frontGifView(半透明状)这一个属性用于往页面上添加各种控件.比如我们创建一个GIF动图的引导页面,我们可以往frontGifView上面添加一些必要的信息,示例代码如下所示.

    注意:gifImageName属性赋值的时候,不需要带有.gif后缀.

        self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
        self.window.backgroundColor = [UIColor whiteColor];
        
        SDLaunchViewController *vc = [[SDLaunchViewController alloc]initWithMainVC:[[ViewController alloc]init] viewControllerType:GifBackgroundLaunchViewController];
        
        //不需要加.gif后缀
        vc.gifImageName = @"动图";
        
        //网络gif图片URL
        vc.gifImageURL = @"http://image76.360doc.com/DownloadImg/2014/07/1510/43430258_28";
        
        //往页面上添加数据
        UILabel *titleLable = [[UILabel alloc]initWithFrame:CGRectMake(0, 100,[UIScreen mainScreen].bounds.size.width , 60)];
        
        titleLable.font = [UIFont fontWithName:@"Helvetica-Bold" size:20];
        
        titleLable.textColor = [UIColor whiteColor];
        
        titleLable.textAlignment = NSTextAlignmentCenter;
        
        titleLable.text = @"不 积 跬 步 无 以 至 千 里";
        
        [vc.frontGifView addSubview:titleLable];
           
        self.window.rootViewController = vc;
       
        [self.window makeKeyAndVisible];
    
    

    效果图如下所示.

    滚动图片类型的SDLaunch


    现在的App中有很多页面的背景图片都是一张滚动的图片,SDLaunch的RollImageLaunchViewController类型就是滚动的图片类型,其中我们要做的也是需要指定图片的本地名称或者是图片的URL地址.这里我们就拿启动图为示例,具体代码如下所示.

        self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
        self.window.backgroundColor = [UIColor whiteColor];
        
        SDLaunchViewController *vc = [[SDLaunchViewController alloc]initWithMainVC:[[ViewController alloc]init] viewControllerType:RollImageLaunchViewController];
        
        vc.rollImageName = @"滚动图片.jpeg";
                
        //往页面上添加数据
        UILabel *titleLable = [[UILabel alloc]initWithFrame:CGRectMake(0, 100,[UIScreen mainScreen].bounds.size.width , 60)];
        
        titleLable.font = [UIFont fontWithName:@"Helvetica-Bold" size:20];
        
        titleLable.textColor = [UIColor whiteColor];
        
        titleLable.textAlignment = NSTextAlignmentCenter;
        
        titleLable.text = @"不 积 跬 步 无 以 至 千 里";
        
        [vc.frontRollView addSubview:titleLable];
        
        self.window.rootViewController = vc;
        
        [self.window makeKeyAndVisible];
    
    

    效果图如下所示.(效果图可能会卡顿,因为图片大小问题只能设置30FPS,所以有些卡顿)

    滚动图片类型的SDLaunch核心代码讲解

    其他三个类型的核心代码相对比较简单,滚动图片类型的核心方式就是实现滚动图片,骚栋是使用一个定时器加上改变imageView的frame来实现的,整体的实现部分主要在rollImageAction这个方法中实现的.在这个方法中,我们需要先判断x的坐标是否超过最大允许范围,如果超过,那么就改变isReverse这个布尔值,也就是改变调用方法.在反向方法中也是如此.具体代码如下所示.

    int rollX = 0;
    bool isReverse = NO;//是否反向翻滚
    -(void)rollImageAction{
        
        if (rollX-1 >(SDMainScreenBounds.size.width-SDMainScreenBounds.size.height* _rollImage.size.width/_rollImage.size.height) &&!isReverse) {
            
            rollX = rollX-1;
            _rollImageView.frame = CGRectMake(rollX, 0,SDMainScreenBounds.size.height* _rollImage.size.width/_rollImage.size.height, SDMainScreenBounds.size.height);
    
        }else{
        
            isReverse = YES;
        }
    
        if (rollX+1 < 0 &&isReverse) {
        
            rollX = rollX +1;
            
            _rollImageView.frame = CGRectMake(rollX, 0,SDMainScreenBounds.size.height* _rollImage.size.width/_rollImage.size.height, SDMainScreenBounds.size.height);
    
        }else{
            isReverse = NO;
        }
    
    }
    
    

    当然了,在此之前,我们需要对图片的宽高比进行判断,因为图片是横向移动,纵向不移动且占满全屏.所以如果图片宽度大于高度的话,那么效果是不可能实现的,我们需要做一下判断.整体是在addRollImageAndTimer中实现的,对于网络图片和本地图片调取该方法的时机是不同的,因为网络加载是有延迟的.

    -(void)addRollImageAndTimer{
    
        if (_rollImage !=nil && _rollImage.size.height>_rollImage.size.width) {
            
            NSLog(@"Error:滚动图片的高度比宽度高,不能进行横向滚动!");
            
        }else{
            
            
            _rollImageView  = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0,SDMainScreenBounds.size.height* _rollImage.size.width/_rollImage.size.height, SDMainScreenBounds.size.height)];
            
            _rollImageView.image = _rollImage;
            
            self.rollTimer =[NSTimer scheduledTimerWithTimeInterval:0.05 target:self selector:@selector(rollImageAction) userInfo:nil repeats:YES];
            
            [self.view addSubview:_rollImageView];
            
            
            if (!_hideEndButton) {
                [self.frontRollView addSubview:self.endButton];
                
                _endButton.tintColor = [UIColor blueColor];
            }
            
            [self.view addSubview:self.frontRollView];
            
            [self.rollTimer fire];
        }
    
    

    SDLaunchDemo使用方式


    -->SDLaunchDemo的传送门🚪

    所有的演示对象都是在AppDelegate的didFinishLaunchingWithOptions这个方法中实现的.需要那一部分只要打开注释即可.

    结束


    SDLunch这个轮字的相关使用就介绍到这,如果有疑问,可以联系骚栋进行探讨...谢谢.欢迎关注骚栋骚栋将会给你们带来更有趣的编程...😄

    相关文章

      网友评论

      本文标题:SDLaunch:一个杂七杂八,却功能完整的广告引导页

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