'SwiftUI view with multiple ViewBuilder

I have a view that represents a row in a cell that looks like this

view

This works well but the three horizontal elements (Image, Title/Subtitle, Image) are hardcoded to their respective types.

I would like to have a generic ThreeItemView that can takes 3 Views of any type and arrange them as shown. This would allow me to reuse the same container layout with any other views types.

I created a view that takes three @ViewBuilders:

import Foundation
import SwiftUI

struct ThreeItemView<Start: View, Main: View, End: View>: View {

    let start: () -> Start
    let main: () -> Main
    let end: () -> End

    init(@ViewBuilder start: @escaping() -> Start,
        @ViewBuilder main: @escaping() -> Main,
        @ViewBuilder end: @escaping() -> End) {
        self.start = start
        self.main = main
        self.end = end
    }

    var body: some View {
        return HStack {
            start()
            main()
                .frame(minWidth: 0, maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
            end()
        }
        .frame(minWidth: 0, maxWidth: .infinity, maxHeight: 60, alignment: .leading)
    }
}

struct ThreeItemContainer_Previews: PreviewProvider {
    static var previews: some View {

        ThreeItemView(start: {
            Image(systemName: "envelope.fill")
        }, main: {
            Text("Main")
        }, end: {
            Image(systemName: "chevron.right")
        })
    }
}

This works as expected but the API is a bit .. cumbersome. What would be a way to make the usage of the ThreeItemView easier?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source