【IOS】模仿"抽屉新热榜"动态启动页YFSplashScreen,iosyfsplashscreen

IOS最好要设置系统默认启动页面,不然进入应用就会突然闪现黑色画面

下图是我们要实现的效果:

总体思路:设置一个系统默认启动页面,在进入didFinishLaunchingWithOptions时,

给Window添加自定义启动页,其初始画面和系统启动页一样。

可在自定义启动页实现一些动画,动画结束后,将自定义启动页移除。

一.设置系统默认启动页

现在,新建项目会自动生成LaunchScreen.storyboard启动页面文件。

来到项目根目录  点击General  找到以下:

发现除了直接设置Launch Screen File,还能够设置Launch Image Source来实现添加启动页面。

所以我们来使用这种方式来实现吧。使用Assets.xcassets添加图片,

1.LaunchScreen.storyboard我们用不到了,可以将其删除。同时第三行将Launch Screen File设为空。

2.第二行,点击User Asset Cattalog  -> Migrate:  此时Luanch Images Source会变为  Brand Assets

但这不是我们需要的。因此,点击右边的箭头,进入Assets.xcassets, 在AppIcon那边右键,选中

App Icons&Launch Images->New IOS Launch Images,此时在右侧会出现很多可填入图片的框框。

之后返回将第二行选中LuanchImage,设置完成后结果如下图所示。

现在给刚才新建的LaunchImage添加图片就能够展示系统默认的启动画面了。

网上很多教程都是到此为止,到底该如何添加图片却不知道了。如何设置图片请往下看。

(导致的结果就是添加了图片后出现上下都有大块黑边的情况或者没有图片展示)

二.设置系统启动页图片

LaunchImage里面的内容如下,并且我已经把对应的图片分辨率标注出来了。

(为了适配不同大小的屏幕,除了Landscape横屏,总共需要五张不同分辨率的图,已经用颜色区分了)

然后是不同尺寸设备所使用的图片(这个名称只是为了更好的对应起来,将图片放入LaunchImage对应位置)

这里的逻辑坐标系(分辨率)大小可以理解为获取到的 [UIScreen mainScreen].bounds.size大小.

所以将上述5种分辨率图片对应放入,就能够实现正常的系统默认启动页了。

(注意:不将这些添加到项目里,直接拖动到LaunchImage的对应位置就可以了,在目录下

Assets.xcassets/LaunchImage.launchimage你能看到自动生成的对应特定名称的图片,共7张)

三.自定义页面UIView

1.设置背景

系统默认启动画面结束之后,显示的就是我们添加在Window上的自定义UIView。

为了画面的流畅性,背景依然需要设置为和启动画面一样的图片。

针对不同的设备,系统默认的启动画面会显示不同的图片,如果我们手动去判断赋值UIView背景,未免有些麻烦。

我们可以通过NSBundle中的infoDictionary的"UILaunchImages"获取当前使用的LaunchImage。

上述获取到的为一个字典数组DicArrays,其数量会随着你添加的LaunchImage图片而改变。

这里我列出适配所有屏幕(DicArrays数量为4)时获取到的DicArays.  如下表格:

因此我们只需遍历出对应大小和方向的UILanuchimageName的值就可以了。

-(NSString *)getCurrentLaunchImageNameForOrientation:(UIInterfaceOrientation)orientation{

NSString*currentImageName =nil;

CGSize viewSize=self.bounds.size;

NSString* viewOrientation = @"Portrait";if(UIInterfaceOrientationIsLandscape(orientation)){

viewSize=CGSizeMake(viewSize.height, viewSize.width);

viewOrientation= @"Landscape";

}

NSArray*imageDicts = [[[NSBundle mainBundle] infoDictionary] valueForKey:@"UILaunchImages"];for (NSDictionary * dic inimageDicts) {

CGSize imageSize= CGSizeFromString(dic[@"UILaunchImageSize"]);  //将字符串转换为Size

NSString*orientation = dic[@"UILaunchImageOrientation"];  //取得方向if(CGSizeEqualToSize(viewSize, imageSize) &&[orientation isEqualToString:viewOrientation]){

currentImageName= dic[@"UILaunchImageName"];

}

}returncurrentImageName;

}

获取到名称后,就可以直接通过该名称给UIImage赋值了。

2.设置图标和名称

有没有注意到上面的示意图里,"抽屉新热榜"的图标和文字是一直存在的,之后背景色改变为其他图片。

我的想法是将抽屉新热榜的图标和文字覆盖在最上层。在系统默认启动图完成后,视图的结构如图所示。

(红圈内,从左到右分别是顶层的图片+文字,进行动画的UIImageView, UIView本身的背景图片)

由此可知,我们需在默认的UIVIew最顶端添加和背景图片离位置一模一样的图标和文字,以保证从系统的LaunchImage跳转到自定义页面,其中的内容是不会变化的。然而启动画面有多种尺寸,所以需要将图标按照一定的比例添加到UIView上。所以启动画面最好也要以某一比例来进行内部的图标、文字设计。

但是由于没有美工,我想到了一个办法。直接先将图标、文字、背景按照一定比例布局到UIView上,然后给不同模拟器截图。

(我的布局:  正方形图标宽度、高度均为屏幕宽度的1/6    图标y值为屏幕高度1/7)

在4、4.7、5、5.5英寸模拟器上,切换到最大窗口(Command+1)后  截图(Command+S)就能够获取想要的比例

在3.5英寸模拟器上,Command+ 1 为: 640 * 960        Command+3 为:  320*480

这样不但得到了启动图片,你也有了最上层图片和文字的布局。

3.网络请求和沙盒保存

现在整体做好了,还有一个功能,是在客户端内可更换网络图片,在下次重新进入应用后生效。

所以涉及到了网络请求NSURLSession和沙盒,这里省略并作一些记录。

使用TaskDownloadSession等相关对象

a.实现了block,就无法进入协议中,而delegate的协议可以进行恢复下载、实时进度等控制.

b.实现进度控制的协议里 totalBytesExpectedToWrite为-1 解决办法:

NSMutableURLRequest *request;

[request setValue:@"" forHTTPHeaderField:@"Accept-Encoding"];

见StackOverFlow : MBProgressHUD with NSURLConnection

源码以及说明详见GitHub:YFSplashScreen

http://www.dengb.com/IOSjc/1134548.htmlwww.dengb.comtruehttp://www.dengb.com/IOSjc/1134548.htmlTechArticle【IOS】模仿抽屉新热榜动态启动页YFSplashScreen,iosyfsplashscreen IOS最好要设置系统默认启动页面,不然进入应用就会突然闪现黑色画面 下图是...

android 抽屉新热榜 splash,【IOS】模仿quot;抽屉新热榜quot;动态启动页YFSplashScreen,iosyfsplashscreen...相关推荐

  1. 解决Android singleInstance 按home退到桌面从桌面点击应用图标又从启动页重新启动的问题

    解决Android singleInstance 按home退到桌面从桌面点击应用图标又从启动页重新启动的问题 最近项目中有处理腾讯IM视频语音聊天切换到悬浮窗功能, 初解决方案: 语音/视频通话界面 ...

  2. android 5开机卡,【报Bug】安卓5.1.1一直卡在启动页,不能进入主页

    详细问题描述 (DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题) [内容] 重现步骤 [步骤] ...

  3. IOS开发之——设置APP图标、名字、启动页(50)

    一 概述 本文介绍给APP进行一些基本配置 APP图标 名字 启动页 <!--more--> 二 APP图标设置 依次点击:Xcode-->应用-->Assets.xcasse ...

  4. Android开发——解析App启动页(Splash)黑/白闪屏现象

    前言 我在开发App的时候,出现App在启动会出现短暂的黑/白闪屏现象.这样现象对用户的体验感是会产生不好的影响,于是我就研究这个现象的起因和解决办法.不负有心人,我在翻了很多博客,踩完坑之后找到起因 ...

  5. android启动页使用gif,android中使用react-native设置应用启动页过程详解

    一.背景 在我们使用react-native进行编写代码的时候,当启动应用的时候,我们会看到如下界面 然而,这样的启动界面是非常的不又好,那么我们该怎么进行处理启动界面呢?有如下两种方案 二.方案 1 ...

  6. 【Android学习笔记】设置App启动页

    先将启动页放到项目资源中,图片一般是1080*1920的jpg. 新建一个activity,如图: 创建成功之后,打开刚刚创建的activity,来进行代码的编写: public class BZLa ...

  7. Android开发--简单实现Android应用的启动页

    Android启动页效果展示 平时打开手机的应用时,会跳出来3秒钟的广告后,再进入应用.今天我们就来简单实现一下引导页的功能. 1.首先,新建一个activity页面,命名:SplashActivit ...

  8. 2017H1日本免费榜:《怪物弹珠》双榜称王 将棋游戏或是新入口

    [文章由Teebik原创并授权发布] 2017年上半场全球手游混战已鸣锣收金,在2017年上半年结束之后,全球主要手游市场格局如何呈现?在经历了激烈的榜单厮杀之后,又是哪些游戏占了鳌头?Teebik来 ...

  9. iOS 新特性分列式 之 iOS 8.x - 主要内容:应用扩展、手动对焦、Size Class

    iOS 新特性分列式 之 iOS 8.x - 主要内容:应用扩展.手动对焦.Size Class 太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循&quo ...

  10. 【Android】android开发之splash闪屏页的四种实现方式,启动页的实现教程。

    2019独角兽企业重金招聘Python工程师标准>>> 作者:程序员小冰,GitHub主页: https://github.com/QQ986945193 新浪微博:http://w ...

最新文章

  1. 手机网页H5 自适应不同分辨率的屏幕 必学标签meta之viewport
  2. 黑帽SEO:Google为什么会屏蔽你的网站
  3. 维特森 VTD72K14 多圈空心角度传感器 角位移传感器
  4. 【图示解析】不同进制之间的表示与转换
  5. 分布领域驱动设计(DDD):领域接口化设计式缓存的选择
  6. pythonfor循环语句例子_简单的python循环知识
  7. CentOs 7 Linux系统下我的/etc/sysconfig/路径下无iptables文件
  8. #上传文件的post请求
  9. mongodb 的安装使用步骤
  10. Codeforces Round #275 (Div. 2)
  11. 【菜鸡的LeetCode答案】【C#】7.反转整数
  12. nuxt SSR部署到iis7方案
  13. 路由器和交换机的作用及区别,不再为路由器的选择而烦恼
  14. 冯绍峰晒与韩寒片场邋遢照 自称工地领薪水
  15. sql还原mysql_如何还原sql数据库
  16. ArcGIS空间数据分析实用工具——方向分布(标准差椭圆)
  17. 面朝大海——我的2016
  18. pip安装包以及更新报错Could not fetch URL :There was a problem confirming the ssl certificate
  19. update 增加datetime 时间
  20. 我的2019年工作总结及对未来1年的计划和期许

热门文章

  1. springtboot 操作es
  2. Windows 2003安装和配置活动目录服务
  3. 线下娱乐“换血”,沉浸式体验会成为下一个10年的主题吗?
  4. VS安装包下载和环境配置
  5. NOIP2018赛前停课集训记(10.24~11.08)
  6. 第106章 Caché 函数大全 $ZF(-4),$ZF(-5),$ZF(-6) 函数
  7. 事件绑定,事件类型,事件委托
  8. Android ANR的trace文件基本信息解读
  9. 基于SSM的共享汽车管理系统设计与实现
  10. 计算机桌面个性化怎样设置方法,终于知晓如何设置个性化电脑桌面?