尝试实现一个可滑动的周视图,就像苹果日历默认应用程序



我希望有一些类似于默认的Apple Calendar周视图。当滑动到下一周/上一周时,动作看起来像一个卷轴,但我个人认为他们没有在记忆中保留所有这些周。此外,在滚动结束后,星期总是居中。

我如何更新,以显示前一周/下一周的日子时,从该周视图滑动/拖动?

这是我的HomeTabView

struct HomeTabView: View {
@Namespace var animation
@EnvironmentObject var workoutManager: WorkoutManager
@EnvironmentObject var dateModel: DateModel
init() {
UITabBar.appearance().isHidden = true
}
var body: some View {
GeometryReader { geometry in
ScrollView(.vertical, showsIndicators: false) {
LazyVStack(spacing: 10, pinnedViews: [.sectionHeaders]) {
Section {
//MARK: - Week View
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 4) {
ForEach(dateModel.currentWeek, id: .self) { day in
VStack() {
Text(dateModel.extractDate(date: day, format: "dd"))
.font(.system(size: 15))
.fontWeight(.semibold)
Text(dateModel.extractDate(date: day, format: "EE"))
.font(.system(size: 14))
Circle()
.fill(dateModel.isToday(date: day) ? .white : .black)
.frame(width: 8, height: 8)
.opacity(workoutManager.hasWorkouts(for: dateModel.extractDate(date: day, format: "dd/MM/yyy")) ? 1 : 0)
}
.foregroundStyle(dateModel.isToday(date: day) ? .primary : .tertiary)
.foregroundColor(dateModel.isToday(date: day) ? .white : .black)
.frame(width: (geometry.size.width - 32) / 7, height: geometry.size.width / 7 * 1.5)
.background (
ZStack {
if dateModel.isToday(date: day) {
Capsule()
.fill(.black)
.matchedGeometryEffect(id: "CURRENTDAY", in: animation)
}
}
)
.contentShape(Capsule())
.onTapGesture {
withAnimation {
dateModel.currentDay = day
}
}
}
}
.padding(.vertical, 5)
.frame(maxWidth: .infinity)
.frame(minWidth: geometry.size.width)
.background(
GeometryReader { parentGeometry in
Rectangle()
.fill(Color(UIColor.systemGray2))
.frame(width: parentGeometry.size.width, height: 0.5)
.position(x: parentGeometry.size.width / 2, y: parentGeometry.size.height)
}
)
}
WorkoutsView()
} header: {
HeaderView()
}
}
}
.frame(maxHeight: .infinity)
}
.clipped()
}

}

目前,周视图在ScrollView中作为HStack实现,但我个人不知道如何使用这些2来处理实现。

DateModel负责跟踪当前工作日和当前日期,而WorkoutManager正在处理锻炼,同时将它们保存在[String: [Workout]]类型字典中。关键字是日期格式,如"25/05/2022"。(试图使用日期类型作为关键,但据我所知,这是不可哈希的,不知道如何使它可哈希,而锻炼结构现在只有一个标题。

Home选项卡在不滑动周视图时显示当前的滚动/滑动/拖动手势。

我建议您从第三方库CalendarKit中获得帮助,或者您可以直接将其集成到您的项目中。CalendarKit

我希望这能达到你的目的。

最新更新