SwiftUI UIHostingController 导航标题动画坏了

Posted 2023-02-24

【中文标题】SwiftUI UIHostingController 导航标题动画坏了

【英文标题】：SwiftUI UIHostingController navigation title animation broken

【发布时间】：2021-10-12 08:49:19

【问题描述】：

当我使用 UIHostingController 将新的 SwiftUI.View 推送到现有 UIKit UIViewController 的导航堆栈时，导航栏中的标题动画被破坏。我在 Xcode 12.0 中测试了一个纯新项目。

仔细观察标题“UIHostingController”。您可以看到动画看起来与普通推送动画有何不同，它只是“出现”无中生有，看起来很破碎。第二个动画已经发生在 SwiftUI.NavigationLink 中，看起来不错。

如果您想尝试一下，这里是示例项目的链接： https://www.dropbox.com/s/mjkuzhpsb6yvlir/HostingControllerTest.zip?dl=0

查看此 GIF 图片：（如果您没有查看 GIF 动画，请在另一个浏览器选项卡中打开）

这是后面的代码：

class ViewController: UIViewController 
    private let button = UIButton(frame: .zero)

    override func viewDidLoad() 
        super.viewDidLoad()
        self.title = "UIHostingController Title Test"
        self.view.backgroundColor = UIColor.white
        
        self.view.addSubview(self.button)
        button.translatesAutoresizingMaskIntoConstraints = false
        button.setTitle("Push UIHostingController", for: .normal)
        button.addTarget(self, action: #selector(Self.pushVC), for: .touchUpInside)
        button.setTitleColor(.blue, for: .normal)
        
        NSLayoutConstraint.activate([
            button.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
            button.centerYAnchor.constraint(equalTo: self.view.centerYAnchor),
            button.widthAnchor.constraint(equalTo: self.view.widthAnchor),
            button.heightAnchor.constraint(equalToConstant: 50)
        ])
    
    
    @objc private func pushVC() 
        let vc = UIHostingController(rootView: Content())
        self.navigationController?.pushViewController(vc, animated: true)
    


struct Content: View 
    var body: some View 
        NavigationLink(destination: Content2()) 
            Text("Push NavigationLink")
        
        .navigationTitle("UIHostingController")
    


struct Content2: View 
    var body: some View 
        Text("Coming from NavigationLink")
            .navigationTitle("Native SwiftUI View")
    

【问题讨论】：

我想我也有同样的问题，如果在模拟器中打开调试/慢速动画会容易得多。标题（以及后退按钮和栏项目）几乎在最后“闪烁”，而不是淡出。你解决了吗？

是的，目前找到了最好的解决方案。看我的回答。

【参考方案1】：

找到了解决此问题的方法。 UIHostingController 实际上只是一个普通的UIViewController（带有一些 SwiftUI 的附加组件）。这意味着可用于UIViewController 的所有内容也可用于UIHostingController。所以解决这个问题的方法是在UIHostingController 上设置与导航栏相关的所有内容，而不是在包装好的 SwiftUI 视图中。

let vc = UIHostingController(rootView: Content())
vc.title = "My custom title"

如果直接在UIHostingController 上设置，所有导航按钮的效果也会更好。一个不错的选择也是直接从 UIHostingController 派生并在那里实现自定义所需的行为。

【参考方案2】：

要强制UIHostingController 设置其导航项，我们可以在单独的窗口中预渲染它：

let window = UIWindow(frame: .zero)
window.rootViewController = UINavigationController(rootViewController: hostingController)
window.isHidden = false
window.layoutIfNeeded()

甚至可以缓存窗口以预渲染其他视图。