iPad开发(相对于iPhone开发时专有的API)

iPad开发

一.iPad开发简介

1.什么是iPad

  • 一款苹果公司于2010年发布的平板电脑
  • 定价介于苹果的智能手机iPhone和笔记本电脑产品之间
  • 跟iPhone一样,搭载的是iOS操作系统

2.iPhone和iPad的区别

  • 屏幕的chicun/分辨率
  • UI元素的排布/设计
    • 由于iPad屏幕比iPhone大,可以容纳更多的UI元素,因此排列方式是不一样的
  • 键盘
    • iPad的虚拟键盘多了个退出键盘的按钮
  • API
    • 共有API的差异
      • 有些API在iPhone和iPad上都能使用,但是显示效果是有差异的
      • 比如,UIActionSheet
    • iPad特有的类
      • UIPopoverController
      • UISplitViewController
  • 屏幕方向的支持
    • iPhone支持3个方向(除了倒置)
    • iPad支持4个方向
    • 开发说明
      • 一般情况下,iPhone应用就一种屏幕方向,要么竖屏,要么横屏(游戏)
      • 其次,苹果官方建议:iPad应用最好同时支持横屏和竖屏两种方向

3.开发细节

  • 设备支持的应用程序
    • iPhone上只能运行iPhone程序
    • iPad上能够运行iPhone/iPad程序
  • 开发过程
    • iPhone和iPad开发的流程是一致的
    • 在iPhone开发中学到的所有知识基本都能用在iPad上

二.QQ空间项目分析,以及适配方案制定

1.技术难点

  • 横屏下的适配
    1. 尺寸大小的变化:横竖屏下尺寸大小的变化
    2. 排列结构的变化:图标从左右排列到上下排列
    3. 按钮的状态变化:横竖屏状态下的按钮显示内容状态不一样

2.屏幕适配方案(回顾)

  • 方案1:手动代码判断
  • 方案2:Autoresizing(iPad出现以后)
    • 局限性
      • 仅仅能解决子控件和父控件之间的相对关系
      • 仅仅能改变位置尺寸,但是横竖屏切换时,不同排列结构无法改变(比如上下排列变成左右排列),控件状态无法改变
    • 用法
      • UIView里面有一个属性autoresizingMask
        • 距离父控件左边的间距是伸缩的
          • UIViewAutoresizingFlexibleLeftMargin = 1 << 0,
        • 距离父控件右边的间距是伸缩的
          • UIViewAutoresizingFlexibleRightMargin = 1 << 2,
        • 距离父控件上边的间距是伸缩的
          • UIViewAutoresizingFlexibleTopMargin = 1 << 3,
        • 距离父控件下边的间距是伸缩的
          • UIViewAutoresizingFlexibleBottomMargin = 1 << 5
        • 宽度跟随父控件宽度进行伸缩
          • UIViewAutoresizingFlexibleWidth = 1 << 1,
        • 高度跟随父控件高度进行伸缩
          • UIViewAutoresizingFlexibleHeight = 1 << 4,
      • 意味着,所有继承自UIView的子控件,都可以使用Autoresizing进行布局
  • 方案3:Autolayout(iOS6.0开始)
    • 优势:
      • 解决任何控件之间的相对关系问题
    • 局限性:
      • 仅仅能改变位置尺寸,但是横竖屏切换时,不同排列方式无法改变
      • 比如,三个控件,控制水平排放和垂直排放
      • 控件与控件之间的耦合性非常强
  • 方案4:Sizeclass(iOS8.0开始)
    • 优势:
      • 可以解决不同屏幕状态下的排列方式和控件样式问题
      • 主要是因为可以区分不同的屏幕尺寸,具体布局还要参照上面方案
    • 局限性:
      • 无法区分iPad的横竖屏
  • 方案5:UIStackView(iOS9.0开始)
    • 简介:
      • 和Android开发中的LinearLayout控件非常相似
    • 学习资料:
    • 优势:
      • 可以非常快速的进行水平或者垂直布局,并且可以设置间距
      • 控件之间的耦合性弱
    • 局限性:
      • 只能实现一些有规律的布局(水平或者垂直)
      • 目前为止,9.0版本过高,依然需要适配低版本

三.iPad横竖屏适配综合案例(QQ空间)开发步骤

1.开发目的

  • 此项目的侧重点在于如何做好iPad的横竖屏适配,不是具体业务逻辑实现

2.搭建项目结构

  • 项目基本配置
    • BundleID
    • 最低部署版本
    • 支持平台,以及横竖屏支持
    • 程序图标,启动图片
  • 划分项目功能模块,创建文件夹结构
    • 项目总共划分为两个大模块
      • 登录模块
        • 主要负责展示登录界面,验证用户名和密码身份,记住密码,自动登录等功能
      • 主页模块
        • 主要负责展示主页各个板块,并完成各个板块间的切换,以及横竖屏适配
    • 文件夹结构创建如下
      • 一开始搭建基本文件结构, 如果后续需要增加功能或模块, 再进行扩展即可, 没必要一次搭建所有的
  • 拖入必要的资源文件和工具类,以及第三方框架
    • 启动图片,程序图标
    • 拖入界面搭建必备资源文件
    • 一些第三方框架可以等使用时再拖入

3.实现QQ空间登录功能

  1. 搭建登录界面
    • 可以实现观察动画效果,将需要做动画的view包装到一个父控件中,方便做动画
  2. 完善界面细节
    • 比如图片拉伸,尺寸大小,文本样式,return key,状态栏颜色等
  3. 封装登录工具类,完成登录验证功能
    • 经验:不要直接把登录验证逻辑写到控制器,抽取出来一个工具类,既可以复用,也可以减轻控制器的负担
  4. 封装提示工具类
    • 将用户名或者密码错误等提示功能抽取到一个工具类,方便复用
      • 如果对应的功能跟控制器没有关系,最好抽取出去
      • 如果当前功能再其他控制器也会用到,最好抽取出去
  5. 完善记住密码,自动登录功能(封装工具类)

4.实现QQ空间主页功能

  1. 搭建QQ空间主页的主结构
    • 分析界面构成(左右各一块,左边显示菜单项,右侧负责显示内容项)
    • 分别针对于左右视图进行布局,做好横竖屏的适配后,再想左右视图内部如何搭建,从大到小
    • 像一些固定的数值(比如横竖屏状态下的菜单栏高度等),放到单独的一个文件中进行管理,方便维护
  2. 完善左侧菜单view(Dock)
    1. 分析界面构成,大致分成三块
      • 上方的头像
      • 中间的菜单
      • 下面的菜单
    2. 先做好三大块视图的横竖屏尺寸适配,然后在具体考虑内部搭建,从大到小
      • 通过观察视图样式, 建议从下往上进行布局
    3. 完善底部菜单的界面实现
      • 需要适配横竖屏的显示样式,可以在layoutSubviews方法中,判断横竖屏,进行布局
    4. 完善中间的菜单
      • 需要适配横竖屏的显示样式,可以在layoutSubviews方法中,判断横竖屏,进行布局
      • 观察内部按钮样式,需要自定义按钮,调整图片和文字显示位置
    5. 完善顶部的头像
      • 需要适配横竖屏的显示样式,可自定义按钮
  3. 设置左侧菜单代理,通知外界内部菜单点击事件
    • 因为左侧菜单分为上中下三部分,所以可以针对每一部分设置一个代理,向外界提供一些代理方法
    • 将上中下三部分的代理,汇总到Dock中,统一提供给外界
  4. 完善右侧视图
    • 当点击不同的菜单时,右侧内容视图,展示不同控制器的视图给用户

5.细节完善

  • 界面细节完善,比如尺寸/颜色等
  • 适当增加动画

四.UIPopoverController的使用

1.UIPopoverController简介

  • 是iPad开发中常见的一种控制器
  • 跟其他控制器不一样的是,它直接继承自NSObject,并非继承自UIViewController
  • 它只占用部分屏幕空间来呈现信息,而且显示在屏幕的最前面

2.UIPopoverController使用步骤

  • 设置内容控制器
    • 由于UIPopoverController直接继承自NSObject,不具备可视化能力
    • 因此UIPopoverController上面的内容必须由另外一个继承自UIViewController的控制器来提供,这个控制器称为"内容控制器"
  • 设置内容的尺寸
    • 显示出来占据多少屏幕空间
  • 设置显示的位置
    • 从哪个地方显示出来

3.UIPopoverController代码实现

  1. 设置内容控制器
    • 在初始化UIPopoverController的时候传入一个内容控制器
        • (id)initWithContentViewController:(UIViewController *)viewController
    • 更改内容控制器
      • @property (nonatomic, retain) UIViewController *contentViewController;
        • (void)setContentViewController:(UIViewController *)viewController animated:(BOOL)animated;
  2. 设置内容的尺寸
    • 方案1:通过UIPopoverController对象设置
      • @property (nonatomic) CGSize popoverContentSize;
        • (void)setPopoverContentSize:(CGSize)size animated:(BOOL)animated;
    • 方案2:通过内容控制器设置
      • 在iOS7之前
        • @property (nonatomic,readwrite) CGSize contentSizeForViewInPopover;
      • 在iOS7之后
        • @property (nonatomic) CGSize preferredContentSize;
  3. 设置显示的位置
  • 围绕着一个UIBarButtonItem显示(箭头指定那个UIBarButtonItem)
// 围绕着一个UIBarButtonItem显示(箭头指定那个UIBarButtonItem)

// item:围绕着哪个UIBarButtonItem显示
// arrowDirections:箭头的方向
// animated:是否通过动画显示出来 - (void)presentPopoverFromBarButtonItem:(UIBarButtonItem *)item
permittedArrowDirections:(UIPopoverArrowDirection)arrowDirections
animated:(BOOL)animated;
  • 围绕着某一块特定区域显示(箭头指定那块特定区域)
// 围绕着某一块特定区域显示(箭头指定那块特定区域)

// rect:指定箭头所指区域的矩形框范围(位置和尺寸)
// view:rect参数是以view的左上角为坐标原点(0,0)
// arrowDirection:箭头的方向
// animated:是否通过动画显示出来 - (void)presentPopoverFromRect:(CGRect)rect
inView:(UIView *)view
permittedArrowDirections:(UIPopoverArrowDirection)arrowDirections
animated:(BOOL)animated;
  1. 关闭UIPopoverController
      • (void)dismissPopoverAnimated:(BOOL)animated;
  2. 额外设置
    • 防止点击UIPopoverController区域外消失
      • 问题描述
        • 只要UIPopoverController显示在屏幕上,UIPopoverController背后的所有控件默认是不能跟用户进行正常交互的
        • 点击UIPopoverController区域外的控件,UIPopoverController默认会消失
      • 解决方案
        • 解决办法是设置passthroughViews属性
        • @property (nonatomic, copy) NSArray *passthroughViews;
        • 这个属性是设置当UIPopoverController显示出来时,哪些控件可以继续跟用户进行正常交互
        • 这样的话,点击区域外的控件就不会让UIPopoverController消失了

4.iOS8.0之后的popover

  • 自定义控制器TestViewController为内容控制器
  • 懒加载内容控制器,并设置ios8popover
    1. 初始化控制器
      • _ios8VC = [[Ios8ViewController alloc] init];
    2. 设置控制器的弹出样式为popover
      • _ios8VC.modalPresentationStyle = UIModalPresentationPopover;
    3. 设置弹出位置
      • self.ios8VC.popoverPresentationController.sourceView = self.view;
      • self.ios8VC.popoverPresentationController.sourceRect = sender.frame;
    4. 以modal的形式弹出
      • [self presentViewController:self.ios8VC animated:YES completion:nil];

5.常见错误

  • popover还没消失就被销毁
    • [UIPopoverController dealloc] reached while popover is still visible.
    • 翻译:popover在仍旧可见的时候被销毁了(调用了dealloc)
    • 从错误可以得出结论
      • 当popover仍旧可见的时候,不准销毁popover对象
      • 在销毁popover对象之前,一定要让popover消失(不可见)

6.开发经验

五.iPad(UIPopoverController使用)案例(美团网)开发步骤

1.搭建项目结构

  1. 划分项目功能模块,创建文件夹结构
    • 项目只有一个功能模块
      • 首页
      • 设置导航栏菜单展示,当点击某个菜单时,展示对应的数据
    • 文件夹结构创建
  2. 拖入必要的资源文件和工具类,以及第三方框架(可以使用时再拖入)
    • 启动图片,程序图标
    • 拖入界面搭建必备资源文件
    • 一些第三方框架可以等使用时再拖入
  3. 搭建Storyboard,跳转结构
    • 入口控制器为导航控制器,其根控制器是一个简单的视图控制器

2.首页功能实现

  • 实现导航栏菜单展示
    1. 自定义菜单视图
      • 通过xib文件描述视图界面
      • 提供菜单数据模型,供外界赋值
    2. 创建导航栏上3个菜单视图,以及logo图标
    3. 做好横竖屏适配
    4. 实现菜单点击事件的监听
  • 封装两级菜单控制器
    • 使用xib描述两级菜单
    • 提供两级菜单数据模型,供外界赋值
  • 实现点击菜单时的业务逻辑
    • 在对应的菜单下面,弹出UIPopoverController
      • 设置popoverController的内容控制器
      • 封装数据获取工具类
      • 赋值展示

六.UISplitViewController简介

1.概念

  • 分割视图控制器

2.功能作用

  • 可以实现iPad屏幕下的分屏(左右)
    • 左边:masterViewController
    • 右边:detailViewController
  • 会自适应iPad横竖屏下的布局
    • 可以设置当竖屏状态下,隐藏masterViewController

3.使用方法

  • 创建分割控制器
  • 设置分割控制器viewControllers属性
    • 此属性是一个数组,里面存放两个子控制器
    • 第0个子控制器代表masterViewController
    • 第1个子控制器代表detailViewController
  • 额外设置
    • 设置弹出"轻扫手势"
      • presentsWithGesture
      • 设置是否可以通过"轻扫手势"弹出master控制器
    • 显示模式
      • preferredDisplayMode
        • UISplitViewControllerDisplayModeAutomatic
          • 自动显示
          • 横屏状态下,两个都显示
          • 竖屏状态下,可以通过轻扫手势控制master控制器
        • UISplitViewControllerDisplayModePrimaryHidden
          • 默认master控制器隐藏,但可以通过轻扫手势控制
        • UISplitViewControllerDisplayModeAllVisible
          • 横竖屏下,两个控制器都显示(轻扫手势也无效)
        • UISplitViewControllerDisplayModePrimaryOverlay
          • 默认两个都显示,但可以通过轻扫手势控制

4.开发经验

  • 一般master控制器和detail控制器之间的通讯可以使用通知

七.问题总结

1.iPad开发和iPhone开发的主要区别

  1. 方向支持(iPad支持4个方向,iPhone支持3个方向)
  2. 屏幕尺寸
  3. 启动图片(共同点)
  4. 布局
  5. API(iPad特有API)
  6. 键盘布局
上一篇:用HTML5、地理定位API和Web服务来开发移动应用


下一篇:UVA 1400 线段树