Swiftui 我怎样才能创建一个从前面无限滚动的懒汉呢？

这个问题的变体已经被问了好几次。我的问题和我的问题之间的区别在于，我希望在我的

LazyHStack

的前面（左侧）无限滚动

我的目标是创建一个水平滚动的日历，其中最右边的日期代表今天，用户可以通过向左滚动回到时间

我的策略是检查每个单元格（看起来）是否靠近堆栈视图的前面。如果它在加载阈值内，我会预先添加更多的日期单元格。问题是，任何预先设置好的单元格都会出现并触发更多的单元格加载，从而导致无限循环

有什么建议吗

额外积分：当视图出现时，它应该滚动到当前日期（在最后）

示例代码 显示日历单元格行的视图

struct CalendarView: View {
    
    @StateObject var vm = CalendarViewModel()
    
    var body: some View {
        ScrollView(.horizontal, showsIndicators: false) {
            ScrollViewReader { proxy in
                LazyHStack {
                    ForEach(vm.array, id: \.self) { date in
                        CalendarCell(date: date).onAppear {
                            vm.loadMoreDatesIfNeeded(for: date)
                        }
                    }
                }.onAppear {
                    proxy.scrollTo(vm.array.last)
                }
            }
        }
    }
}

负责加载新日期的视图模型

class CalendarViewModel: ObservableObject {
    
    @Published private(set) var array = [ Date() ]
    
    let batchSize: Int = 10
    
    func loadMoreDatesIfNeeded(for date: Date? = nil) {
        guard array.count > batchSize else {
            loadMoreDates()
            return
        }
        guard let date = date else {
            loadMoreDates()
            return
        }
        if array[batchSize-1] == date {
            loadMoreDates()
        }
    }
    
    private func loadMoreDates() {
        let startDate = array.first ?? Date()
        for i in 1...batchSize {
            let date = Calendar.current.date(byAdding: .day, value: -i, to: startDate)!
            array.insert(date, at: 0)
        }
    }
}

日历单元格

struct CalendarCell: View {
    
    var date: Date
    
    var title: String {
        let df = DateFormatter()
        df.dateFormat = "EEE"
        return df.string(from: date)
    }
    
    var subtitle: String {
        let df = DateFormatter()
        df.dateFormat = "d"
        return df.string(from: date)
    }
    
    var body: some View {
        VStack(alignment: .center) {
            Text(title)
            Text(subtitle)
        }
    }
}

---

这里有两件事可以帮助您-

flipsForRightToLeftLayoutDirection

修改器和环境变量

layoutDirection

试试这个：

var主体：一些视图{
滚动视图（.horizontal，showsIndicators:false）{
懒散的{
ForEach（vm.array，id:\.self）{date in
日历单元格（日期：日期）
奥纳佩尔先生{
vm.loadMoreDates（）
}
}
.flipsForRightToLeftLayoutDirection（真）
.environment（\.layoutDirection、.rightToLeft）
}
}
.flipsForRightToLeftLayoutDirection（真）
.environment（\.layoutDirection、.rightToLeft）
}

我真的不知道为什么会这样。使用

true

或

false

调用内部的

flipsForRightToLeftLayoutDirection

，这并不重要。另外，将

layoutDirection

设置为相同的值两次看起来很奇怪。。。但它是有效的