Home > Net >  Why UILabelViewRepresentable does not respect to given frame?
Why UILabelViewRepresentable does not respect to given frame?

Time:11-25

I have a simple UILabelViewRepresentable and I gave a frame to it! But after using in SwiftUI it became max size! How could I solve the issue from UIKit code part?

struct ContentView: View {
    
    var body: some View {
        
        UILabelViewRepresentable(configuration: { label in
            
            label.text = "Hello, World!"
            label.textAlignment = .center
            label.backgroundColor = .blue
            label.frame = CGRect(x: 0, y: 0, width: 200, height: 50)

        })
 
    }
    
}




struct UILabelViewRepresentable: UIViewRepresentable {
    
    let configuration: (UILabel) -> ()
    
    func makeUIView(context: Context) -> UILabel {
       return UILabel()
    }
    
    func updateUIView(_ uiView: UILabel, context: Context) {
        configuration(uiView)
    }
}

CodePudding user response:

The main issue is that this representable will try constrain the UILabel to fill the whole screen. You can avoid this by making a UIView, and making the UILabel a child of that so you can center it in the parent.

Code:

struct UILabelViewRepresentable: UIViewRepresentable {
    let configuration: (UILabel) -> ()

    func makeUIView(context: Context) -> UIView {
        let view = UIView()
        view.addSubview(UILabel())
        return view
    }

    func updateUIView(_ uiView: UIView, context: Context) {
        let label = uiView.subviews.first! as! UILabel

        label.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            label.centerXAnchor.constraint(equalTo: uiView.centerXAnchor),
            label.centerYAnchor.constraint(equalTo: uiView.centerYAnchor)
        ])

        configuration(label)
    }
}

Usage:

struct ContentView: View {
    var body: some View {
        UILabelViewRepresentable(configuration: { label in
            label.text = "Hello, World!"
            label.textAlignment = .center
            label.backgroundColor = .blue
            label.sizeToFit()
        })
    }
}

Result:

Result

Depending on your usage, the label.sizeToFit() can be moved inside the UILabelViewRepresentable.

CodePudding user response:

struct ContentView: View {

var body: some View {
    
    UILabelViewRepresentable(text: "Hello, World!",
                             center: .center,
                             frame: CGRect(x: 0,
                                           y: 0,
                                           width: 200,
                                           height: 50),
                             background: .blue)
        }
    }
struct UILabelViewRepresentable: UIViewRepresentable {

    let text : String
    let center: NSTextAlignment
    let frame: CGRect
    let background: UIColor
    

func makeUIView(context: Context) -> UIView {
    let view = UIView()
    let label = UILabel()
    label.text = text
    label.textAlignment = center
    label.backgroundColor = background
    label.frame = frame
    view.addSubview(label)
   return view
}

func updateUIView(_ uiView: UIView, context: Context) {
}
}
  • Related