推/弹

时间:2016-11-07 11:58:57

标签: ios iphone uinavigationbar ios10 imessage

iOS 10消息应用程序的导航栏会在您按下/弹出对话时(平滑过渡)增加/减少高度。

通常我使用sizeThatFits:创建一个更高的自定义导航栏,但它会在导航控制器中的视图控制器的推送和弹出中持续存在。

如何为导航序列中的某些视图控制器(例如消息应用程序)设置更高的导航栏? 谢谢!

2 个答案:

答案 0 :(得分:4)

非常有趣的问题。我花了一些时间在消息应用程序中实现这样的事情,这就是我所做的。

enter image description here

最后,我使用此技巧在push / pop期间为navigationBar高度设置动画,并使用滑动手势弹出。

UIView.beginAnimations(nil, context: nil)
self.frame = navFrame
UIView.commitAnimations()

下面你可以看到我的实现:

extension UINavigationBar {
    func applyHeight(_ height: CGFloat, animated: Bool = true) {
        var navFrame = self.frame
        navFrame.size.height = height
        if animated {
            UIView.beginAnimations(nil, context: nil)
            self.frame = navFrame
            UIView.commitAnimations()
        } else {
            self.frame = navFrame
        }
    }
}

class ViewControllerA: UIViewController {

    override func loadView() {
        super.loadView()
        title = "A"
        view.backgroundColor = .blue
        navigationItem.rightBarButtonItem = UIBarButtonItem(title: "NEXT", style: .plain, target: self, action: #selector(self.showController))
        navigationController?.navigationBar.isTranslucent = false
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
    }

    func showController() {
        navigationController?.pushViewController(ViewControllerB(), animated: true)
    }
}

class ViewControllerB: UIViewController {

    override func loadView() {
        super.loadView()
        title = "B"
        view.backgroundColor = .red
    }

    override func viewWillAppear(_ animated: Bool) {
        navigationController?.navigationBar.applyHeight(100)
        super.viewWillAppear(animated)
    }

    override func willMove(toParentViewController parent: UIViewController?) {
        if parent == nil { // here you know that back button was tapped
            navigationController?.navigationBar.applyHeight(44)
        }
        super.willMove(toParentViewController: parent)
    }
}

需要改进的地方

  • 标题跳到顶部

当您滑动到弹出按钮时可以看到跳跃标题,但就个人而言,我认为这是一个小问题:)

希望它可以帮到你,也许有人可以改进这个实现。当然,我仍然会试着弄清楚如何让这更好:) 这是github repository。请使用navigation_bar_height分支。

答案 1 :(得分:0)

我认为现在您可以通过此操作实现类似的效果,只需将大标题设置为always:

enter image description here