本文转自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不用了,但是老系统里还能使用,这时需要区分系统了。

  1. if (floor(NSFoundationVersionNumber) <= NSFoundationVersionNumber_iOS_6_1) {
  2. // Load resources for iOS 6.1 or earlier
  1. } else {
  2. // 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. Java从入门到精通——数据库篇Mongo DB GridFS文件系统

    一.概述    GridFS是MongoDB的一种存储机制,用来存储大型二进制文件. 优点: 1.使用GridFS能够简化你的栈.如果已经在使用MongoDB,那么可以使用GridFS来代替独立的文件 ...

  2. asp.net怎么让某一页的 requestEncoding设置成utf-8

    web.config里是这样的 <globalization requestEncoding="gb2312" responseEncoding="gb2312&q ...

  3. 用navicat工具创建MySQL存储过程

    使用Navicat for MySQL工具创建存储过程步骤: 1. 新建函数(选择函数标签 -> 点击新建函数): 2.输入函数的参数个数.参数名.参数类型等: 3.编写存储过程:  代码如下: ...

  4. 二十、滑动开关css

    如上图所示的图片,如何通过css实现呢? 下面咱们慢慢尝试: html: <div class="togglePosition"> <label class=&q ...

  5. layui分页

    毕业已经两年,期间经历了很多.一个人欢笑与哭泣,在墙角.在路边.在床上.每天搭乘首班车来到公司,每天无数次反省自己,每天每天再问自己为什么活着. 一.下载并引用css和js 地址:点我 <lin ...

  6. Oracle sql trace用法

    sql_trace是oracle提供的一个非常好的跟踪工具,主要用来检查数据库的异常情况,通过跟踪数据库的活动,找到有问题的语句. 一.概述:    SQL_TRACE是Oracle的一个非常强大的工 ...

  7. List 的 removeAll 方法的效率

    List 的 removeAll 方法的效率低的原因: 要遍历source,对dest进行contain操作,而contain又要遍历dest进行equal比较. 解决办法:dest转为set,用se ...

  8. 科普文:从人人网看网络科学(Network Science)的X个经典问题

    转:https://zr9558.wordpress.com/2013/12/05/科普文:从人人网看网络科学(network-science)的x个经典问/ 长文,写了N个小时写完的.你肯定能看懂, ...

  9. SAP CRM系统订单模型的设计与实现

    SAP成都研究院的一个部门领导让我给他的团队做一个SAP CRM One Order框架的培训,这是我准备的培训内容. 在Jerry之前的文章 基于SAP Kyma的订单编排增强介绍,我表达了自己对S ...

  10. 智能机器人“小昆”的实现(五)MainActivty的实现及项目结束

    好了,一切准备工作都完成了,下面我们就可以真正的编写MainActivity了.在MainActivity中,我们要为ListView设定适配器,并为发送按钮设定点击事件.我们的逻辑就是点击发送按钮, ...