iOS开屏广告的实现技巧
xeww0970172
8年前
<h2><strong>一、前言</strong></h2> <p>记得在创新工场的时候产品经理让我实现这个功能,当时我想了一个方案,但是可惜最后产品不需要这个功能了。时隔1年多,新公司又要让我写这个东西了,这几天我完善了一下功能,我决定开源一下这个功能,虽然市场上已经有很多应用都有这个功能了,我只是想分享一下我的实现技巧,100个人有100个想法。</p> <h2><strong>二、实现思路</strong></h2> <p>这两种开屏广告大家都见过吧?一种是半屏一种是全屏广告。</p> <p>如图:</p> <p><img src="https://simg.open-open.com/show/f1b19407c81aaf0f2d9b035542145e54.png"></p> <h3><strong>1、障眼秘籍:</strong></h3> <p>咱们从头开始分析。iOS启动的时候有一个默认开屏页,这个页会一闪而过。我们想在这里加入广告,一定要用到障眼法。所谓障眼法就是我们的广告是压在一个和默认开屏页一抹一样的图片上面。当用户看到了开屏页后,我们用一个和开屏页一样的图压在上面,用户还以为这个就是系统的页面,此时上面广告压上,这样就完美实现了。这里的难点是有的app这个假页面大小和app原来的不一样,这样效果就不好了。这里我写了一个获取系统LaunchImage图片的类,大家可以精确获取系统默认开屏图片,达到天衣无缝的效果。</p> <p>传送门-> <a href="/misc/goto?guid=4959714161548917849" rel="nofollow,noindex">GetLaunchImage</a></p> <h3><strong>2、缓存秘籍:</strong></h3> <p>以为用户不是用一次app就再也不用了,用户肯定会多次打开app的。虽然已经实现了障眼秘籍,但是如果网速慢图片大,总不能让用户看3秒默认启动图吧?那样体验太不好了,因此还是加入缓存机制比较好。我的实现思路是,第一次不让用户去看这个3秒广告了,直接略过,开一个线程去缓存这张图片。第二次用户再启动app的时候,再显示图片,这里渐隐动画和假启动页配合好,天衣无缝。这里的缓存用到了SDWebImage中的SDWebImageManager。</p> <h3><strong>3、其他秘籍:</strong></h3> <p>此处是执行广告页逻辑之前要实现的一些东西,大家可以自由发挥。我在公司项目中是按照如图所示逻辑。github的demo简单使用userdefault做的演示。</p> <p>如图:</p> <p><img src="https://simg.open-open.com/show/2a9df68bb5ffc64ee46175c72692a58a.png"></p> <h2><strong>三、主要实现代码</strong></h2> <p>不喜欢贴太多代码,贴一个初始化代码吧,主要是思路,建议直接看demo吧。</p> <pre> <code class="language-objectivec">- (instancetype)initWithBgImage:(NSString *)imageUrl withClickImageAction:(void(^)())action { self = [super initWithFrame:[UIScreen mainScreen].bounds]; if (self) { _isImageDownloaded = NO; _imageClickAction = action; _bgImageViewDefault = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds]; _bgImageViewDefault.contentMode = UIViewContentModeScaleToFill; [self addSubview:_bgImageViewDefault]; _bgImageViewDefault.image = [GetLaunchImage getTheLaunchImage]; _bgImageView = [[IanClickImageView alloc] initWithFrame:[UIScreen mainScreen].bounds]; _bgImageView.alpha = 0.0; _bgImageView.contentMode = UIViewContentModeScaleToFill; [_bgImageView addTarget:self action:@selector(_ImageClick:)]; [self addSubview:_bgImageView]; _timeButton = [[UIButton alloc] initWithFrame:CGRectMake([UIScreen mainScreen].bounds.size.width - 13 - 52, 20, 52, 25)]; _timeButton.layer.cornerRadius = 25/2.0f; [_timeButton setClipsToBounds:YES]; _timeButton.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.3]; _timeButton.titleLabel.font = [UIFont systemFontOfSize:13]; [_timeButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal]; [_timeButton addTarget:self action:@selector(jumpClick:) forControlEvents:UIControlEventTouchUpInside]; [_bgImageView addSubview:_timeButton]; SDWebImageManager *manager = [SDWebImageManager sharedManager]; BOOL cachedBool = [manager cachedImageExistsForURL:[NSURL URLWithString:imageUrl]]; // 将需要缓存的图片加载进来 BOOL diskBool = [manager diskImageExistsForURL:[NSURL URLWithString:imageUrl]]; if (cachedBool || diskBool) { _timeButton.hidden = NO; [self.bgImageView sd_setImageWithURL:[NSURL URLWithString:imageUrl] placeholderImage:[GetLaunchImage getTheLaunchImage]]; _isImageDownloaded = YES; } else { _timeButton.hidden = YES; self.bgImageView.image = [GetLaunchImage getTheLaunchImage]; [manager downloadImageWithURL:[NSURL URLWithString:imageUrl] options:SDWebImageRefreshCached progress:^(NSInteger receivedSize, NSInteger expectedSize) { } completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) { }]; _isImageDownloaded = NO; } } return self; }</code></pre> <p>Demo传送门-> <a href="/misc/goto?guid=4959714161645578222" rel="nofollow,noindex">https://github.com/ianisme/IanStartAdsView</a></p> <p>如图:</p> <p style="text-align: center;"><img src="https://simg.open-open.com/show/199bbf41d0b68e87d8504eb0006f0c88.gif"></p> <h2><strong>四、总结</strong></h2> <p>每个人都有不同的实现方法,你的实现方法是什么呢?</p> <p> </p> <p>来自:https://www.ianisme.com/ios/2339.html</p> <p> </p>