使用正确的代码将 UIView 加载到 SwiftUI

Posted 2023-02-24

【中文标题】使用正确的代码将 UIView 加载到 SwiftUI

【英文标题】：Using the right code for loading UIView to SwiftUI

【发布时间】：2021-02-13 07:13:06

【问题描述】：

我的目标是在 SwiftUI 中使用 UIView，我希望在中心有一个红色的 View 100X100，因为我为此使用了这个向下代码并且它正在工作：

    struct CustomUIViewController2: UIViewControllerRepresentable 

    func makeUIViewController(context: UIViewControllerRepresentableContext<CustomUIViewController2>) -> CustomUIViewControllerModel 
        
        return CustomUIViewControllerModel()
        
    

    func updateUIViewController(_ uiViewController: CustomUIViewControllerModel, context: UIViewControllerRepresentableContext<CustomUIViewController2>)  

    class CustomUIViewControllerModel: UIViewController 

        var customUIView = UIView()

        override func viewDidLoad() 
            
            super.viewDidLoad()
            
            customUIView.backgroundColor = UIColor.red
            
            view.addSubview(customUIView)
            customUIView.translatesAutoresizingMaskIntoConstraints = false
            customUIView.heightAnchor.constraint(equalToConstant: 100).isActive = true
            customUIView.widthAnchor.constraint(equalToConstant: 100).isActive = true
            customUIView.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 0).isActive = true
            customUIView.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 0).isActive = true
            
        
  
    
  

但是在使用该代码后，我注意到我应该使用 loadView 而不是 viewDidLoad 然后我开始将 up 代码重构为 down 代码，我做到了，但现在结果与我想要的不同！我想要一个红色的 View 100X100 居中，正如您在向下代码中看到的那样，我试图使其居中，但它不起作用，我正在徘徊这个向下代码有什么问题，以使红色 View 100X100 居中！

    struct CustomUIViewController: UIViewControllerRepresentable 

    func makeUIViewController(context: UIViewControllerRepresentableContext<CustomUIViewController>) -> CustomUIViewControllerModel 

        return CustomUIViewControllerModel()

    

    func updateUIViewController(_ uiViewController: CustomUIViewControllerModel, context: UIViewControllerRepresentableContext<CustomUIViewController>) 

    

    class CustomUIViewControllerModel: UIViewController 
        // Use loadView instead of viewDidLoad
        
        override func loadView() 

            view = UIView()
            view.backgroundColor = UIColor.red
            view.translatesAutoresizingMaskIntoConstraints = false
            view.heightAnchor.constraint(equalToConstant: 100).isActive = true
            view.widthAnchor.constraint(equalToConstant: 100).isActive = true
            view.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 0).isActive = true
            view.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 0).isActive = true

        
        

    

---

用例：

    struct ContentView: View 
    var body: some View 

        CustomUIViewController()
            .background(Color.blue)
        
        CustomUIViewController2()
            .background(Color.blue)
        
    

【参考方案1】：

当您像这样使用loadView 时，在第一行，您将view 设置为UIViewController。因此，当您将宽度和高度设置为 100 时，这将应用于整个 view。

要解决这个问题，您可以在第一行创建您当前拥有的view，然后为该框添加一个子视图。

struct CustomUIViewController: UIViewControllerRepresentable 
    
    func makeUIViewController(context: UIViewControllerRepresentableContext<CustomUIViewController>) -> CustomUIViewControllerModel 
        
        return CustomUIViewControllerModel()
        
    
    
    func updateUIViewController(_ uiViewController: CustomUIViewControllerModel, context: UIViewControllerRepresentableContext<CustomUIViewController>) 
        
    
    
    class CustomUIViewControllerModel: UIViewController 
        // Use loadView instead of viewDidLoad
        
        override func loadView() 
            view = UIView()
            
            let boxView = UIView()
            view.addSubview(boxView)
            boxView.backgroundColor = UIColor.red
            boxView.translatesAutoresizingMaskIntoConstraints = false
            boxView.heightAnchor.constraint(equalToConstant: 100).isActive = true
            boxView.widthAnchor.constraint(equalToConstant: 100).isActive = true
            boxView.centerXAnchor.constraint(equalTo: view.centerXAnchor, constant: 0).isActive = true
            boxView.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 0).isActive = true