16.6 C
London
Thursday, September 19, 2024

ios – How you can divide the padding equally amongst merchandise in a ForEach SwiftUI


So I’ve an HStack and a ForEach inside it, I am exhibiting 5 little one views, however my downside is that the padding differs, and in addition, when for instance I modify the textual content to an extended textual content for instance, (33% to 100%) the peak adjustments too. I would like them to be divided equally among the many display screen.

Dad or mum Code:

// Final 5 Days Horizontal Listing
HStack(spacing: 0) {
    ForEach(last5Days) { day in
        Button {
            print("final 5 days clicked (day.date)")
        } label: {
            CalendarItemMainPageView(passedDay: day)
                .padding(.horizontal)
        }
    }
}.padding(.horizontal)

Youngster View Code

VStack {
    let dayAbbreviation = svm.getDayAbbreviation(from: passedDay.date)
    let isToday = svm.checkIsToday(for: passedDay.date)
    Textual content(dayAbbreviation)
        .foregroundStyle(isToday ? .fDarkBlue : .fDarkBlue)
        .font(.headline)
        .padding(.high, 5)
        .lineLimit(1)
    
    let dayInt = svm.getDayInt(from: passedDay.date)
    Textual content(String(dayInt))
        .foregroundStyle(isToday ? .fDarkBlue : .fDarkBlue)
        .font(.system(measurement: 20))
        .daring()
        .lineLimit(1)
    
    let percentageCompleted = vm.getPercentageCompleted(p.c: passedDay.percentageCompleted)
    Textual content(String(Int(percentageCompleted * 100)) + "%")
        .font(.caption)
        .lineLimit(1)
        .foregroundStyle(isToday ? .fDarkBlue : .fDarkBlue)
        .padding(.backside, 2)
        .minimumScaleFactor(0.3)
    
}
.minimumScaleFactor(0.5)
.background {
    let isToday = svm.checkIsToday(for: passedDay.date)

    Rectangle()
        .fill(isToday ? .fYellow : .fYellow)
        .cornerRadius(8.0)
        .aspectRatio(contentMode: .fill)
}
.padding(5)
.background {
    Rectangle()
        .fill(Coloration(backgroundColor.rawValue))
        .cornerRadius(3.0)
        .aspectRatio(contentMode: .fill)
}
.onAppear {
    let isToday = svm.checkIsToday(for: passedDay.date)
    let percentageCompleted = vm.getPercentageCompleted(p.c: passedDay.percentageCompleted)

    if !isToday {
        if percentageCompleted * 100 < 50.0 {
            backgroundColor = .pink
        }
    } else {
        backgroundColor = .pink
    }
}

enter image description here

Latest news
Related news

LEAVE A REPLY

Please enter your comment!
Please enter your name here