I have implemented an Airbnb horizontal calendar in SwiftUI app using the HorizonCalendar library, but with swap to show next and previous month. I also want to show the next and previous buttons which should be in sync with swipe also, but I can not find any way for that in Airbnb horizontal calendar.
CalendarViewRepresentable(
visibleDateRange: Date()...Calendar.current.date(byAdding: .year, value: 10, to: Date())!,
monthsLayout: .horizontal,
dataDependency: nil
)
.monthHeaders { month in
let monthName: String
switch month.month {
case 1: monthName = "January"
case 2: monthName = "February"
case 3: monthName = "March"
case 4: monthName = "April"
case 5: monthName = "May"
case 6: monthName = "June"
case 7: monthName = "July"
case 8: monthName = "August"
case 9: monthName = "September"
case 10: monthName = "October"
case 11: monthName = "November"
case 12: monthName = "December"
default: monthName = "Unknown"
}
return AnyView(
HStack(spacing: 0) {
Text("\(monthName) \(month.year.description)")
.fontWithLineHeight(font: UIFont(name: HHFonts.Lato_Regular.rawValue, size: 20), lineHeight: 32)
.foregroundColor(HHColor.primarydarkblue)
Spacer()
}
)
}
.days { day in
let calendar = Calendar.current
guard let date = calendar.date(from: dayponents) else {
return AnyView(EmptyView())
}
let isToday = calendar.isDateInToday(date) // Check if the date is today
let isSelected = weddingDate == date // Check if the date is selected
return AnyView(
ZStack {
if isSelected {
Circle()
.fill(HHColor.primarydarkblue)
.frame(width: 44, height: 44)
}
else if isToday {
Circle()
.fill(HHColor.greyscalelightgrey1)
.frame(width: 44, height: 44)
}
Text("\(day.day)")
.fontWithLineHeight(font: UIFont(name: isToday ? HHFonts.Lato_Bold.rawValue : HHFonts.Lato_Regular.rawValue, size: 20), lineHeight: isToday ? 29 : 24)
.foregroundColor(isSelected ? HHColor.greyscalewhite : HHColor.primarydarkblue)
.onTapGesture {
weddingDate = date // Update the selected date when tapped
viewModel.weddingDate = HHUtility.formattedDateString(from: weddingDate ?? Date.now)
print("Selected Date: \(viewModel.weddingDate)")
}
}
)
}