Wednesday, September 10, 2025
HomeiOS Developmentios - How one can make hierarchical view with nested baby views...

ios – How one can make hierarchical view with nested baby views in Swiftui


How one can make this utilizing Swiftui

I attempted to make this design in swiftui and it’s resembling as nicely however i do not suppose this method is a cleaner approach. I’m attaching my code under.

struct NewShapeView: View {

let properties: [Property]

var physique: some View {
    ForEach(properties) { property in
        VStack(alignment: .main, spacing: 0) {
            ForEach(property.zones.indices, id: .self) { index in
                LineView(zoneName: property.zones[index].title)
                SubView(showVerticalLine: index != property.zones.indices.final)
                    
            }
        }
    }
}

}

struct LineView: View {

let zoneName: String

var physique: some View {
    HStack(alignment: .backside, spacing: 0) {
        Rectangle().body(width: 1, top: 40)
        Rectangle().body(width: 40, top: 1)
        Textual content(zoneName)
    }
}

}

struct SubView: View {

var showVerticalLine: Bool

var physique: some View {
    HStack(spacing: 0) {
        if showVerticalLine {
            Rectangle().body(width: 1, top: 40) // Prolong the road via SubView
        }
        Spacer().body(width:  32, top: 36) // Regulate the spacer width to align with the earlier line
        Picture(systemName: "speaker.wave.2.fill")
        Textual content("Some Paradise - L’impératrice")
            .font(.subheadline)
            .foregroundColor(.grey)
    }
}

}

I’m a newbie and dealing on my first manufacturing swiftui app. Any ideas and assist are welcomed.
Thanks prematurely.

I attempted a hack of drawing a vertical line on the boundary of zone subview until final view is present in array.
I’m anticipating a cleaner method.

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments