Inject a view into a view in SwiftUI

Question

I'm trying to inject a view into another view to avoid code duplication.

I came up with the idea of this:

struct WrapperView: View {
    
    var injectedView: some View
    
    var body: some View {
        VStack {
            injectedView
        }
    }
}

But I get an error: Property declares an opaque return type, but has no initializer expression from which to infer an underlying type

How can I achieve something like this in SwiftUI?

Answer 1

You can use generics. Here, the type Content conforms to View, so we can pass in something like Text.

Something like:

struct WrapperView<Content: View>: View {
    let injectedView: Content
    
    var body: some View {
        VStack {
            injectedView
        }
    }
}

Usage:

WrapperView(injectedView: Text("Hello"))

---

If you want to call it similar to when creating the VStack like this:

WrapperView {
    Text("Hello")
}

You can change WrapperView to this:

struct WrapperView<Content: View>: View {
    private let injectedView: () -> Content
    
    init(@ViewBuilder injectedView: @escaping () -> Content) {
        self.injectedView = injectedView
    }
    
    var body: some View {
        VStack(content: injectedView)
    }
}

We use @ViewBuilder so we can build view content in the closure, allow us to do the following:

WrapperView {
    Text("Hello")
    
    Text("world!")
}