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
}
}