简体   繁体   English

SwiftUI 视图混合在 UIViewController 的视图上

[英]SwiftUI View blended over UIViewController's view

I have an iOS app with a MetalView contained in a UIViewController, all setup in a story board.我有一个包含在 UIViewController 中的 MetalView 的 iOS 应用程序,所有设置都在故事板中。

Now I want to blend over the metal view another SwiftUI view, which is transparent.现在我想在金属视图上混合另一个透明的 SwiftUI 视图。 So only the GUI elements of the SwiftUI view are visible to the user and the background is my MetalView.所以只有 SwiftUI 视图的 GUI 元素对用户可见,背景是我的 MetalView。

I do this using the following code:我使用以下代码执行此操作:

  let controller = UIHostingController(rootView: MainView())
  controller.modalPresentationStyle = .fullScreen
  controller.view.backgroundColor = .clear

  self.addChild(controller)
  controller.view.translatesAutoresizingMaskIntoConstraints = false
  self.view.addSubview(controller.view)
  controller.didMove(toParent: self)
  
  NSLayoutConstraint.activate([
    controller.view.topAnchor.constraint(equalTo: self.view.topAnchor),
    controller.view.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
    controller.view.leftAnchor.constraint(equalTo: self.view.leftAnchor),
    controller.view.rightAnchor.constraint(equalTo: self.view.rightAnchor)
  ])

Basically the above code does work.基本上上面的代码确实有效。 However,the SwiftUI view is no tied to the exact borders of the MetalView although my constraints request this.然而,SwiftUI 视图与 MetalView 的确切边界无关,尽管我的约束要求这样做。 The problem seems to be that the UIHostingController obeys the safe area insets and especially at the bottom and top the SwiftUI view is always rounded and a little bit smaller.问题似乎是 UIHostingController 遵守安全区域插图,尤其是在底部和顶部,SwiftUI 视图始终是圆形的,并且有点小。

I have experimented with safe area inset settings and tried several presentation styles but nothing helps.我已经尝试了安全区域插入设置并尝试了几种演示样式,但没有任何帮助。

Does anybody know how I can tie the SwiftUI borders to the UIView borders ?有人知道如何将 SwiftUI 边框与 UIView 边框联系起来吗?

Update 2021-10-18: 2021-10-18 更新: 在此处输入图片说明

On the image you see in orange the device background.在图像上,您以橙色看到设备背景。 On top of that my MetalView is rendering the keyboard image.最重要的是,我的 MetalView 正在渲染键盘图像。 And on top of that my SwiftUI view is rendering this:最重要的是,我的 SwiftUI 视图正在呈现:

var body: some View {
  Color.black.opacity(0.5)
}

Since my constraints of the SwitUI view are tied to the MetalView I would expect the black.opacity(0.5) to cover the whole MetalView, but as you can see it leaves a small portion at the bottom uncovered.由于我对 SwitUI 视图的约束与 MetalView 相关联,我希望 black.opacity(0.5) 覆盖整个 MetalView,但正如您所见,它在底部留下一小部分未被覆盖。 Why is that ?这是为什么 ?

I found it.我找到了。 The problem was not the HostingController.问题不在于 HostingController。 Indeed it was already extended beyond the safe area.事实上,它已经超出了安全区域。

The problem was with my SwiftUIView.问题出在我的 SwiftUIView 上。 You have to add:你必须添加:

.ignoresSafeArea()

to extend the view beyond safe area bounds.将视野扩展到安全区域边界之外。 Thanks brandonscript to point me into that direction.感谢brandonscript 将我指向那个方向。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM