How could I add 'skyfloatLabelText' in my swift UI view?

Question

I would like to use skyfloatingLabelText in swift UI. Their example show like below

let textField = SkyFloatingLabelTextField(frame: CGRect(x: 10, y: 10, width: 200, height: 45))
textField.placeholder = "Name"
textField.title = "Your full name"
self.view.addSubview(textField)

I have no idea how I could implement the above code in my swift UI. Below are my swift UI.

import SwiftUI
import SkyFloatingLabelTextField


struct Login: View {

    var body: some View {

        VStack() {

            HeaderBar()
            Spacer()
            HStack {

                VStack {

                    Text("Login Page")
                        .fontWeight(.bold)

                    TextField("Name", text: Value) //default input is ok

                    Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                        Text("Login")

                    }

                }


            }
            Spacer()

        }


    }
}

struct Login_Previews: PreviewProvider {
    static var previews: some View {
        Login()
    }
}

Thanks in advance.

Answer 1

Like @Asperi mentioned, you need to be using UIViewRepresentable for this.

The delegate example is taken from the github example.

import SwiftUI
import SkyFloatingLabelTextField

struct SkyFloatingContentView: UIViewRepresentable {
    class Coordinator: NSObject, UITextFieldDelegate {
        var parent: SkyFloatingContentView

        init(_ parent: SkyFloatingContentView) {
            self.parent = parent
        }

        func textFieldDidChangeSelection(_ textField: UITextField) {
            if let text = textField.text {
                if let floatingLabelTextField = textField as? SkyFloatingLabelTextField {
                    if (text.count < 3 || !text.contains("@")) {
                        floatingLabelTextField.errorMessage = "Invalid email"
                    } else {
                        // The error message will only disappear when we reset it to nil or empty string
                        floatingLabelTextField.errorMessage = ""
                    }
                }
            }
        }
    }

    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }

    func makeUIView(context: Context) -> SkyFloatingLabelTextField {
        return SkyFloatingLabelTextField(frame: CGRect(x: 10, y: 10, width: 200, height: 45))
    }

    func updateUIView(_ textField: SkyFloatingLabelTextField, context: Context) {
        textField.placeholder = "Name"
        textField.title = "Your full name"
        textField.delegate = context.coordinator
    }
}

struct ContentView: View {
    var body: some View {
        VStack() {
            Spacer()

            HStack {
                VStack {
                    Text("Login Page")
                        .fontWeight(.bold)

                    SkyFloatingContentView()

                    Button(action: /*@START_MENU_TOKEN@*/{}/*@END_MENU_TOKEN@*/) {
                        Text("Login")
                    }
                }
            }

            Spacer()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}