在 iPhone 上使用 Popover Segue

作者: Sheepy | 来源:发表于2016-01-14 23:30 被阅读3200次

iOS 系统提供了4种基本的转场方式:Show、Show Detail、Present Modally、Present as Popover。我们平常用的最多的是 Show ,就是从右向左滑入新页面,这也是最符合用户习惯的转场方式。

Popover 一般是用在 iPad 上,在 iPhone 上不能直接使用。因为早些时候 iPhone 的尺寸都不大,苹果是非常不推荐在 iPhone 上使用 Popover 这种风格弹出新页面的。不过现在 iPhone 的尺寸越来越大了,偶尔也会碰到些挺适合 Popover 的场景,比如下面这样的:

Popover.gif

最近我渐渐从手写代码用 Frame 布局转向使用 Storyboard + Auto Layout 布局了,真是食髓知味,妙不可言呐。所以这次我就演示一下用 Storyboard 来快速实现如上图的 Popover 效果。

首先,先拉一个 UITableViewController 出来,用 Static Cells 就行,把菜单项填上:

LandStatusMenu.png

然后将 Use Preferred Explicit Size 选项打勾,并在下方填上你所需要的弹出菜单的尺寸:

SetContentSize.png

当然这样凭空设置尺寸不是很直观,我们可以先在 Storyboard 模拟一下:

DebugSize.png

这个时候我们刚刚拖到 Storyboard 上的那个 UITableViewController 就会显示 150 * 200 的大小了,你可以用 Simulated Size 直接在 Storyboard 上调试尺寸,调试完了之后把最合适的尺寸填到 Content Size 里就好。

接下来就是拉一个 Segue 了,我这边是从 HomeViewController 上的“地块”按钮拉到 LandStatusViewController,Segue 的类型选择 Present as Popover:

DragSegue.png

然后最好填一下 Segue Id,便于在代码中区分多个不同的 Segue:

PopoverSegueMenu.png

最后就是稍微写几行代码了,在 HomeViewController 中:

override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
    if segue.identifier == SegueId.LandStatus {
        let popoverViewController = segue.destinationViewController
        popoverViewController.popoverPresentationController!.delegate = self
    }
}

这个SegueId.LandStatus就是个字符串常量,跟 Storyboard 中填的 Identifier 是一致的:

struct SegueId {
    static let LandStatus = "LandStatusPopover"
    static let LandInfo = "LandInfoShow"
}

最后让 HomeViewController 遵守委托协议,实现委托方法:

extension HomeViewController: UIPopoverPresentationControllerDelegate {
    func adaptivePresentationStyleForPresentationController(controller: UIPresentationController) -> UIModalPresentationStyle {
        return UIModalPresentationStyle.None
    }
}

这样就完成了。

相关文章

网友评论

  • 木沐一:厉害厉害,我一直以为只有Ipad能用这功能,以前都是自定义view来实现,感谢分享,学到了
  • feng_dev:楼主有oc版本的吗
  • xingou:水平方向怎么用呢,出来的是pagesheet的样子
    Sheepy:@a95bd91b295e 不是,我这边是正常的。
    xingou:@Sheepy 出来的样子除了宽度和pagesheet的样子不一样,其他都差不多,没有三角形,点击灰色区域不消失(我还没用过popover不知道是不是本来就是这样的哈)
    Sheepy:@a95bd91b295e 水平方向是指横屏么?不应该是 Sheet 啊,https://github.com/sheepy1/SelectionOfZhihu 你看看我这个项目,横屏的时候也是正常的
  • kayakaya:很不錯啊,學習了,源碼很整潔
    Sheepy:@小源风云 多谢支持 ^ ^
  • 大眼萌璇璇:那个三角形状的颜色改不了....
  • STDawn:iOS9.2 Xcode7.2 下无效, popoverViewController.popoverPresentationController一直为nil
    STDawn:找到原因了, Size Classes不能关呀
    STDawn:为何Control脱出来的 跳转 只有 三项 Push Modal Custom?
    Sheepy:@ST_Dawn 我用的就是 Xcode7.2,你再检查一下吧,要么看看我上面给 @花早 的回复,去看看 Demo
  • 花早:尝试了一下 并不能有效果 点击之后是全屏显示 :sweat:
    Sheepy:@花早 thx~
    花早:@Sheepy 原来一定要设置代理 不然没效果 开源项目代码挺好的~
    Sheepy:@花早 按我写的一步步做不会有问题的,文中这个例子是我在公司写的项目,不好传到 Github,你去看看 https://github.com/sheepy1/SelectionOfZhihu 吧,我自己还没完成的开源项目,也有用到 Popover(点击用户页面的“排名方式”按钮),你可以在 Storyboard 看看 SortOrderMenuController 的设置,然后看看 TopUserViewController 的相关代码。有用的话随手点个 Star 哈^ ^
  • STDawn:长知识了
  • newbiecoder:我一直以为只能在iPad上用……
  • 小草先生:xib能否能用
    Sheepy:@小草先生 你这个问题……xib 只是是用来创建局部 UI 的,也就是单纯创建某个 View 而已,而 SB 则侧重于描述整个项目结构,包括页面间的关系,跳转方式等等。你用 xib 做布局当然可以,但跳转之类的都得用代码写,自然就麻烦一点……我之前不是很明白你想问什么,如果你是想问纯用 xib 能不能实现 Popover 转场的话,显然不能,转场是 Controller 之间的事情,跟 xib 压根就没关系啊,但是你用 xib 去布局弹出页面的 UI 什么的那是可以的。
    小草先生:@Sheepy 如何个麻烦法,需要2个xib还是?
    Sheepy:@小草先生 能用是能用,不过应该要麻烦一些。
  • yiron:正好拿来用

本文标题:在 iPhone 上使用 Popover Segue

本文链接:https://www.haomeiwen.com/subject/flkhkttx.html