本文转自App升级iOS7体会

xcode5 GM版已经发布,虽然还是pre-release版,但离最终版不远了。对于没有用到新特性的app面临的最大问题就是UI的变化。Apple提供了UI Transition Guide给开发者,原本打算翻译一下,没想到国内早就有译文了(唉~看来NDA对于某些人而言,等于NULL)。 鉴于此,这里侧重于Apple提供的cheklist以及app在升级过程中遇到的问题。

管窥全豹

扁平化的设计已经“流传”了很久,iOS7上标准控件(UIKit)有了翻天覆地的变化:按钮没有边,状态栏透明,导航栏变半透明,alert/progress/picker完全是新的表现形式等等。当然,库也更新了不少。印象最深的就是试图控制器中view的尺寸是全屏:即view的尺寸是320×480,包含了顶部的status bar。这一点之所以深刻,是因为之前做过view全屏和非全屏之间的切换。在iOS7里,全屏应该更容易实现。 Apple推出xcode5后,有可能4在不久的将来不能再发布App。在最近这段时间需要说明的是:用xcode4打包的App在iOS7上运行除了alert/preogress等控件是iOS7的样子,其他还是旧的形式。

Apple宣称iOS7的设计遵循三大主题:

  1. Deference:UI帮助用户理解和使用内容,但不要喧宾夺主(不要让用户重UI而不重内容)
  2. Clarity:文字要清晰,icon要清楚地言名答意,修饰要适当不可画蛇添足,总之要以实现功能为先来推动设计
  3. Depth: 视觉的层次感和现实的运动感,可以加强用户的好感和理解

在(重)设计App前,还需要考虑:

  • 是否使用Auto Layout
  • App是否需要支持iOS6

ps:Apple似乎只为开发者“考虑”了ios6上App的升级,不知道还有很多地方的人还在为4.3,5.x的系统奋斗! 为了更好的区分App类型,从使用控件的角度,Apple将App分成三种类型:

  • standard:标准型,控件全是UIKit提供的
  • custom:自定义型,不包含任何UIKit提供的控件
  • Hybrid: 混合型,UIkit和非UIkit的控件兼而有之

标准型的话,需要做的修改可能相对少一点,但是因为iOS7的变化太大了,还是会有“莫名”的问题:

  1. nav bar带有背景图片:背景图片是某种深色的带渐变的效果,iOS7上直接导致上面的按钮(返回键,添加的功能键)不见了,但是能点击
  2. 某个subview到statu bar后去了

这些问题通过文档都能比较容易的解决,标准型App升级主要遇到的是:布局,对于交互方面的修改升级不会太大。 对于非标准型控件来说,我觉得最大的问题就是风格要和系统协调(说了句废话)。这主要还是设计师费神的事情了,我和设计师沟通的结果就是认为App的配色需要好好修改,大家仁者见仁,智者见智吧。

项目评估(Scoping the Project)

以下就是Apple提供的cheklist。

App必须做的

  • 更新icon:120×120;150×150(for ipad);注意ios7下icon不支持高亮和阴影;而且icon的圆角方式也和以前的不一样
  • 更新启动画面:页面尺寸要包含状态栏
  • 要支持retina显示

App应当做的

  • 确保在透明的UI环境下,内容清楚可见,比如bar,键盘还有透明的状态栏。视图控制器的全屏特性也要注意(其实就是要考虑状态栏消失时的布局)
  • 重新设计自定义的bar button
  • 准备无边界的按钮: 重新考虑按钮是否还需要背景图片之类
  • 检查硬编码的UI值:比如大小/位置等,尝试通过系统的方法来确定这些值
  • 检查UI控件更新导致的问题:如进度条变窄, group型table不是分组显示的了
  • 采用动态类型(Dynamic Type):iOS7下用户可以调整字体大小。因此当使用了Dynamic Type,你需要让文本响应用户的调整(这个还没试验)
  • 做好用户会从下向上滑进入控制中心的准备:系统检测到从下向上的手势,就会进入控制中心,而不会把事件传递到App。如果手势没有唤起控制中心,那事件会——有些轻微的延迟,传递到App
  • 重新审视阴影,渐变,贝塞尔渐变。因为iOS7中光滑和层次感是美学中心,——不再推崇拟物化的风格
  • 可以的话,更新App来支持iOS6: 如使用Auto Layout,storyboards; 不要使用过期的API

从checklist可以看出Apple这次推陈出新的力度很大,我的感觉是以后的App最低只要适配iOS6,但是对于天朝不知道5.x以及以前的系统用户占比有多大了。还有,以后的开发一定要使用autolayout还有sb。在iOS7新建工程的模版里已经没有xib了,都是默认sb,还有都是默认ARC。

支持iOS6

Apple所指的其实是支持ios7前的系统,只不过他“眼里”现在只有ios6了。这里列举的方法,对于5.x的系统大部分也是使用的

使用IB来支持多版本App

在Assitantor模式下,xcode5提供给开发者ios7和ios7前两种布局,只要点击preview(如图),右下角可以点击切换 

ios7引入了Asset Catalog来更好的管理图片,这个会专门说。

选择性加载资源

这个以前版本升级的时候也遇到过,就是更新的时候有些API不用了,但是老系统里还能使用,这时需要区分系统了。

if (floor(NSFoundationVersionNumber) <= NSFoundationVersionNumber_iOS_6_1) {
// Load resources for iOS 6.1 or earlier
} else {
// Load resources for iOS 7 or later

}

Updating the UI(更新UI)

这里按照Apple文档的脉络,挑选那些我遇到的问题。

Using View Controllers

最主要变化就是view是320×480的尺寸。使用 wantsFullScreenLayout 的需要改过来,否则这个在iOS7上会有错误。下面分带bar和不带bar的情形,说一下layout需要注意的地方。

1带有nav bar:

如果按之前的frame将y设置为0,有可能subview会被bar挡住。如果要是subview加在bar底的话可以通过设置:

self.edgesForExtendedLayout = UIRectEdgeNone;

这样就可以了,在viewDidAppear里你可以发现,view的frame已经去掉了bar占用的高度了。

此外,iOS7中的nav bar默认是带透明的。但是如果选择了非透明的bar呢?这时,viewcontroller的view会默认去掉bar和statu bar的高度。但是这时,如果想让view的尺寸全屏又该如何呢。这时只要设置:

self.extendedLayoutIncludesOpaqueBars = YES;

这个属性的英文本身解释得很到位了,就不多说了。

2不带有nav bar:

这时statu bar无论如何都是占据掉20的高度,所以subview的布局需要计算在内。

此外,UIViewController还添加了automaticallyAdjustsScrollViewInsets, topLayoutGuide/bottomLayputGuide等属性。有需要的可以自行测试

Using Tine Color

ios6,bar的tintcolor使用tintColor;ios7则要使用barTintColor(ios7里bar的tintcolor用于设置BarButtonitem)。对于支持多个iOS的App,需要区分。此外,UIView新添加了tintColor的属性。如果给window设置tintcolor:

self.window.tintColor = [UIColor redColor];

那么,nav bar上的按钮颜色会变成红色。如果view没有设置这个属性(通常为nil),那么默认使用父view的tintColor。对于顶层的window,tintColor是由系统定义的。需要提醒的是不能通过appearence的方式来设置tintColor。

Using Fonts

据说使用Dynamic Type后,可以

  • 系统会自动征对字体大小来调整字符间距和行高
  • 可以设置带有语义的文本,比如制订headline,body,footer等
  • 用户在Settings里修改大小,那么文字会实时动态的响应

在iOS7中,用户可以设置字体大小到自己认为合适的地方。如果程序想响应这种变化的话:

  1. 使用preferredFontForTextStyle:来生成字体
  2. 响应UIContentSizeCategoryDidChangeNotification Notification

Using Gesture Recognizers

ios7新添了在runtime的时候,指定动作失败的delegate。Apple举例说明:系统本身有从下向上显示控制中心的功能,那么在App里如果view也添加了这样的手势操作,那么可以在delegate里动态设置为nil从而先响应系统的。

Apple文档中剩下的部分,详细阐述了一些控件,control,和view的变化,文档里附有详细的异同比较并有图例。这里就不再一一赘述了。

我个人从中学到的:

  1. nav bar带背景要慎重处理,自定义的bar button item需要多试几次,需要图片的要好好设计
  2. statu bar和view的全屏的处理
  3. 要用ib的话,就用storeboard
  4. 使用Auto Layout

2013-09-13

App升级iOS7体会的更多相关文章

  1. 如何让你的App适配iOS7?

    随着苹果在2013年9月18日发布iOS7最新的系统以来,iOS各种设备升级到iOS7的数字就已经不断刷新记录.目前据外界统计iOS7设备装机量已经达到2.5亿部,已占iOS设备的64%.由此可见让自 ...

  2. iphone升级ios7之后出现蓝框框一直跳的问题

    问题描述:iphone升级ios7之后出现蓝框框一直跳            解决办法:设置-通用-辅助功能-切换控制-里边打开了切换控制及自动扫描,直接关闭切换控制就好了

  3. Flutter项目之app升级方案

    题接上篇的文章的项目,还是那个空货管理app.本篇文章用于讲解基于Flutter的app项目的升级方案. 在我接触Flutter之前,做过一个比较失败的基于DCloud的HTML5+技术的app,做过 ...

  4. Cordova热更新和App升级 - 简书

    原文:Cordova热更新和App升级 - 简书 公司的cordova项目前段时间增加了热更新功能,自己第一次做的时候在网上查找了很多资料,有的资料写的并不全面遇到了很多坑.因此总结一些在开发过程中遇 ...

  5. web app升级—带进度条的App自动更新

    带进度条的App自动更新,效果如下图所示:   技术:vue.vant-ui.5+ 封装独立组件AppProgress.vue: <template> <div> <va ...

  6. Cordova热更新和App升级

    web代码的更新此更新方式,只需要更新web前段代码,不需要更新android的原生代码.只是对js.html等的更新.1.添加插件 Cordova Hot Code Pushcordova plug ...

  7. 强大的Flutter App升级功能

    注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 应用程序升级功能是App的基础功能之一,如果没有此功能会造 ...

  8. IOS7 APP 升级的10个TIP 建议

    There is no way to preserve the iOS 6 style status bar layout. The status bar will always overlap yo ...

  9. 用web技术开发出原生的App应用的体会(1)

    本人是是个前端小白,学前端已经有半年的时间了,前几天开了个博客,希望记录自己学习历程的点滴. 今天要写的是关于用html,css,javascript等web技术开发原生的app应用. 总所周知,we ...

随机推荐

  1. 理解mouseover,mouseout,mouseenter,mouseleave

    mouseover定义和用法 当鼠标指针位于元素上方时,会发生 mouseover 事件. 该事件大多数时候会与 mouseout 事件一起使用. mouseover() 方法触发 mouseover ...

  2. Sencha Architect打开闪退问题修复

    删除以下位置的cache文件夹 C:\Users\Administrator\AppData\Local\Sencha\Sencha Architect 3.2\Cache bug解决参考 https ...

  3. arcMap 进度条

    private void kk() { IProgressDialogFactory progressDialogFactory = new ProgressDialogFactoryClass(); ...

  4. ArcGIS Server 10.1发布要素服务(FeatureLayer server)时遇到的数据库注册问题

    在发布要素服务的最后一步遇到了一个问题: SEVERITY STATUS CODE DESCRIPTION NAME TYPE DATA FRAME High Unresolved 00090 Fea ...

  5. GitHub教程(一) 使用指南

    刚进公司上班的时候,技术总监让我熟悉一下Git(分布式版本控制工具)操作命令和GitHub(代码托管平台),说实话之前我也没有具体使用过Git工具,但是GitHub我还是注册过账号的.在练习将本地仓库 ...

  6. html5自我总结

    2017年7月30日 合抱之木,生于毫末.九层之台,起于累土.软件行业要熟记和训练的东西有很多,在此,写一下如何快速搭建html及自我见解(这里只介绍我自己用到的,还有部分存在但是用不到的就不讲解了) ...

  7. C#启动外部程序(进程)

    通过调用Process类可以启动系统内部(环境变量里的)或者指定位置的程序,例如: Process.Start("notepad");//启动记事本 Process.Start(& ...

  8. CASE表达式

    一.简介 官方定义CASE是一种表达式,它基于某种格式,按照格式去编写表达式,其中表达式的逻辑是:指定特定的值与条件列表去匹配,返回对应的值. CASE表达式类似我们编程语言中的 if else 和 ...

  9. 基于腾讯云centos简单搭建VSFTP

    基于腾讯云centos7.3搭建VSFTP 环境分析: 基于vsftp服务在于云主机上,所以推荐使用FTP的PASV模式: FTP协议有两种工作方式:PORT方式和PASV方式,中文意思为主动式和被动 ...

  10. 【深入理解JAVA虚拟机】第二部分.内存自动管理机制.5.调优实战

    高性能硬件上的程序部署策略 在高性能硬件上部署程序,目前主要有两种方式: 通过64位JDK来使用大内存. --  缺点:GC停顿时间长 使用若干个32位虚拟机建立逻辑集群来利用硬件资源.   -- 思 ...