Define ViewBuildable protocol

[cruisediary]

Objective

• To Make HypeUIs component be customizable and reusable using ViewBuildable
• A reusable declarative UI means we can create design systems it self.

// Example

struct HeaderText: ViewBuildable {
    @Behavior var title: String

    func build() -> UIView {
        Text()
            .foregroundColor(UIColor.black)
            .font(UIFont.systemFont(ofSize: 20, weight: .bold))
            .linked($title, keyPath: \.text)
            .padding(.all, 24)
    }
}

struct FooterText: ViewBuildable {
    @Behavior var title: String

    func build() -> UIView {
        Text()
            .foregroundColor(UIColor.black)
            .font(UIFont.systemFont(ofSize: 20, weight: .regular))
            .linked($title, keyPath: \.text)
            .padding(.all, 24)
    }
}

struct ProfileView: ViewBuildable {
    @Behavior var country: String
    @Behavior var name: String

    func build() -> UIView {
        VStack {
            HStack(alignment: .center, spacing: 12) {
                Text("")
                    .linked($country, keyPath: \.text)
                    .font(UIFont.systemFont(ofSize: 20, weight: .regular))
                    .accessibilityIdentifier("country")
                Text("")
                    .linked($name, keyPath: \.text)
                    .font(UIFont.systemFont(ofSize: 20, weight: .regular))
                    .accessibilityIdentifier("name")
            }
        }
    }
}

• Find specific subview using DFS Because UIViews are made up of compositions, they allow for depth-first searching.
• Use ViewBuildable with ScrollView, Button, HStack, VStack, ZStack 😊