Code: with this if any favCell > Text(item.title ?? "") in 2 lines
then showing uneven line of views in that row why? how to make that row 1 lined text height or space between top and bottom also equal to 2 lined text please guide
where should i change to get all equal, please guide
@ViewBuilder func favView() -> some View {
VStack {
LazyVGrid(columns: [
GridItem(.flexible(), spacing: 20),
GridItem(.flexible(), spacing: 20),
GridItem(.flexible(), spacing: 20),
GridItem(.flexible(), spacing: 20)
], spacing: 20) {
ForEach(0..<favMenu.count + 1, id: \.self) { ind in
if (ind == favMenu.count) {
addMoreButton()
} else {
favoriteButton(for: ind)
}
}
}
.padding(.top, 16)
}
.padding(.top, 35)
.padding(.horizontal, 24)
}
@ViewBuilder func favoriteButton(for index: Int) -> some View {
Button {
handleFavoriteSelection(at: index)
} label: {
favCell(item: favMenu[index], index: index)
}
.buttonStyle(.plain)
}
@ViewBuilder func favCell(item: AllMenu, index: Int) -> some View {
VStack(spacing: 10) {
VStack(spacing: 0) {
ZStack {
RoundedRectangle(cornerRadius: 15)
.fill(Color.Neumorphic.main)
.softOuterShadow()
.frame(width: 65, height: 65)
URLImageView(url: item.icon ?? "", width: 25, height: 25, renderingMode: .template, tintColor: .appGreen)
.frame(width: 25, height: 25)
}
.frame(width: 65, height: 65)
}
Text(item.title ?? "")
.font(.calibriRegular(with: 13))
.foregroundColor(.black)
.lineLimit(2)
.multilineTextAlignment(.center)
.frame(width: 70)
.fixedSize(horizontal: true, vertical: false)
.padding(.horizontal, 4)
.padding(.bottom, 10)
}
}
You may want to add .alignment
for each GridItem
:
GridItem(.flexible(), spacing: 20, alignment: .top) //<- here
Output: