UIHostingController 应该扩展以适应内容

Pot*_*Ion 21 ios swift ios-autolayout swiftui uihostingcontroller

我有一个自定义UIViewControllerRepresentable(与布局相关的代码如下所示)。这试图复制本机 SwiftUI ScrollView,除了它从底部滚动,除了顶部。

查看层次结构

view: UIView
|
\- scrollView: UIScrollView
   |
   \- innerView: UIView
      |
      \- hostingController.view: SwiftUI hosting view
Run Code Online (Sandbox Code Playgroud)

当视图初始化时,这一切都按预期工作。托管视图填充了其内容,并且约束确保滚动视图的contentSize设置正确。

但是,当宿主视图的内容更改时,hostingController.view不会调整大小以适合其内容。

从 Xcode 中的应用程序捕获 UI 的屏幕截图。 显示宿主控制器的内容扩展到宿主视图本身的边界之后,没有正确调整大小。

绿色:正如预期的那样,滚动视图与托管视图控制器的大小相匹配。

蓝色:托管视图本身。它保持第一次加载时的大小,并且不会像它应该的那样消耗。

红色:托管视图中的堆栈视图。在此屏幕截图中,内容已添加到堆栈中,导致其展开。结果,您可以看到大小的差异。

UIHostingController(蓝色)应该展开以适应其内容(红色)。

滚动视图的内容大小没有明确设置,因为这是由自动布局处理的。

如果有帮助,约束代码如下所示。

class UIBottomScrollViewController<Content: View>: UIViewController, UIScrollViewDelegate {
    var hostingController: UIHostingController<Content>! = nil

    init(rootView: Content) {
        self.hostingController = UIHostingController<Content>(rootView: rootView)
        super.init(nibName: nil, bundle: nil)
    }
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    var scrollView: UIScrollView = UIScrollView()
    var innerView = UIView()

    override func loadView() {
        self.view = UIView()
        self.addChild(hostingController)
        view.addSubview(scrollView)
        scrollView.addSubview(innerView)
        innerView.addSubview(hostingController.view)

        scrollView.delegate = self
        scrollView.scrollsToTop = true
        scrollView.isScrollEnabled = true
        scrollView.clipsToBounds = false

        scrollView.layoutMargins = .zero
        scrollView.preservesSuperviewLayoutMargins = true

        scrollView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        scrollView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
        scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

        innerView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
        innerView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        innerView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
        innerView.leftAnchor.constraint(equalTo: scrollView.leftAnchor).isActive = true
        innerView.rightAnchor.constraint(equalTo: scrollView.rightAnchor).isActive = true
        innerView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true


        hostingController.view.topAnchor.constraint(equalTo: innerView.topAnchor).isActive = true
        hostingController.view.leftAnchor.constraint(equalTo: innerView.leftAnchor).isActive = true
        hostingController.view.rightAnchor.constraint(equalTo: innerView.rightAnchor).isActive = true
        hostingController.view.bottomAnchor.constraint(equalTo: innerView.bottomAnchor).isActive = true


        hostingController.view.autoresizingMask = []
        hostingController.view.layoutMargins = .zero
        hostingController.view.insetsLayoutMarginsFromSafeArea = false
        hostingController.view.translatesAutoresizingMaskIntoConstraints = false

        scrollView.autoresizingMask = []
        scrollView.layoutMargins = .zero
        scrollView.insetsLayoutMarginsFromSafeArea = false
        scrollView.translatesAutoresizingMaskIntoConstraints = false

        innerView.autoresizingMask = []
        innerView.layoutMargins = .zero
        innerView.insetsLayoutMarginsFromSafeArea = false
        innerView.translatesAutoresizingMaskIntoConstraints = false

        hostingController.didMove(toParent: self)

        scrollView.keyboardDismissMode = .interactive
    }
}

struct BottomScrollView<Content: View>: UIViewControllerRepresentable {
    var content: () -> Content

    init(@ViewBuilder content: @escaping () -> Content) {
        self.content = content
    }

    func makeUIViewController(context: Context) -> UIBottomScrollViewController<Content> {
        let vc = UIBottomScrollViewController(rootView: self.content())
        return vc
    }
    func updateUIViewController(_ viewController: UIBottomScrollViewController<Content>, context: Context) {
        viewController.hostingController.rootView = self.content()
    }
}
Run Code Online (Sandbox Code Playgroud)

rop*_*cks 39

对我来说,这个解决方案比我在这里看到的任何其他答案都要简单得多(没有一个有效),尽管我花了相当长的时间才找到它。

我所做的只是创建一个精简的子类,UIHostingController调用invalidateIntrinsicContentSize()其视图来响应viewDidLayoutSubviews()

class SelfSizingHostingController<Content>: UIHostingController<Content> where Content: View {

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        self.view.invalidateIntrinsicContentSize()
    }
}
Run Code Online (Sandbox Code Playgroud)

与原来的问题类似,我有一个 SwiftUI 视图,我将其托管在 aUIViewControllerUIScrollView内部,需要与滚动内容视图中的其他视图一起布局。SwiftUI 视图的固有大小根据其内容和用户选择的动态类型大小而变化。

就我而言,事情就是这么简单。它适用于 iOS 14+(未在 iOS 13 上测试),其中 SwiftUI 内容的更改将导致新的内在尺寸正确更新滚动视图中基于自动布局的 UIKit 布局。老实说,这感觉像是一个错误,这不是 的隐式行为UIHostingController


App*_*ios 20

iOS 16 的更新答案:

您现在可以简单地设置yourHostingController.sizingOptions = [.intrinsicContentSize],当 swiftUI 视图发生变化(甚至内部状态发生变化)时,它会自动更新/使内在内容大小无效。

如果您要嵌入弹出窗口,请查看其他大小调整选项 ( .preferredContentSize) 以正确调整弹出窗口的大小


Nik*_*ner 8

我不建议使用SelfSizingHostingController。您可以使用它获得自动布局循环(我成功了)。

最好的解决办法原来是invalidateIntrinsicContentSize()设置好内容后立即调用。像这儿:

hostingController.rootView = content
hostingController.view.invalidateIntrinsicContentSize()
Run Code Online (Sandbox Code Playgroud)


use*_*510 6

这符合@Rengers 所说的内容,但想包括我花了很多时间才弄明白的解决方案。

希望节省一些时间

struct SizingView<T: View>: View {
    
    let view: T
    let updateSizeHandler: ((_ size: CGSize) -> Void)
    init(view: T, updateSizeHandler: @escaping (_ size: CGSize) -> Void) {
        self.view = view
        self.updateSizeHandler = updateSizeHandler
    }
    var body: some View {
        view.background(
            GeometryReader { proxy in
                Color.clear
                    .preference(key: SizePreferenceKey.self, value: proxy.size)
            }
        )
        .onPreferenceChange(SizePreferenceKey.self) { preferences in
            updateSizeHandler(preferences)
        }

    }
    
    func size(with view: T, geometry: GeometryProxy) -> T {
        updateSizeHandler?(geometry.size)
        return view
    }
}
Run Code Online (Sandbox Code Playgroud)


jjo*_*son 5

我遇到了涉及UIHostingController和滚动视图的类似视图层次结构的相同问题,并发现了一个丑陋的 hack 使其工作。基本上,我添加一个高度约束并手动更新常量:

private var heightConstraint: NSLayoutConstraint?

...

override func viewDidLoad() {
    ...


    heightConstraint = viewHost.view.heightAnchor.constraint(equalToConstant: 0)

    ...
}

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()

    // 
    viewHost.view.sizeToFit()
    heightConstraint?.constant = viewHost.view.bounds.height
    heightConstraint?.isActive = true
}
Run Code Online (Sandbox Code Playgroud)

这是可怕的代码,但这是我发现的唯一使它起作用的东西。

  • 感谢您的回答!我也尝试过这个,但不幸的是无法使其工作,因为当 SwiftUI 视图更改其内容时,没有调用“viewDidLayoutSubviews”。然而,我确实找到了另一种解决方法,涉及使用“GeometryReader”来获取 SwiftUI 视图大小,然后使用回调将其传递回 UIViewController。 (2认同)
  • 很高兴你找到了方法!希望本月我们能得到一些 SwiftUI 增强功能和修复,这将使我们避免类似的解决方法。 (2认同)