xcode ScrollView应该从SwiftUI中的特定项目开始

o4hqfura  于 2023-05-01  发布在  Swift
关注(0)|答案(1)|浏览(183)

我有一个数组年份和一个选定年份。我想要的是,每当我的视图加载时,它应该自动移动到所选年份
下面是我的代码:

struct Testing: View {
    let years = ["2016", "2017", "2018", "2019", "2020", "2021", "2022", "2023", "2024", "2025", "2026"]
    @State var selectedYear = "2023"
    @Namespace private var animation
    
    var body: some View {
        
        ScrollView(.horizontal, showsIndicators: false) {
            HStack(spacing: 20) {
                
                ForEach(years.indices, id: \.self) { index in
                    
                    Button {
                        withAnimation(.linear(duration: 0.5)) {
                            selectedYear = years[index]
                        }
                    } label: {
                        VStack {
                            Text("\(years[index])")
                                .foregroundColor(.white)
                                .fontWeight(.semibold)
                                .padding(.horizontal, 15)
                            
                            if selectedYear == years[index] {
                                Capsule()
                                    .fill(.white)
                                    .frame(height: 5)
                                    .padding(.horizontal, -5)
                            }
                        }
                    }
                }
            }.padding().background {
                Rectangle()
                    .fill(Color.purple)
            }
        }
    }
}

这是返回

每当View加载时,它应该在中间显示selectedYear。我如何才能做到这一点?

yhived7q

yhived7q1#

您可以使用ScrollViewReader容器视图,它提供了一种机制来读取滚动视图的内容偏移量,并使用scrollTo方法滚动到其中的特定材料。以下是更新的代码:

struct Testing: View {
    let years = ["2016", "2017", "2018", "2019", "2020", "2021", "2022", "2023", "2024", "2025", "2026"]
    @State var selectedYear = "2023"
    @Namespace private var animation
    
    var body: some View {
        
        ScrollView(.horizontal, showsIndicators: false) {
            ScrollViewReader { scrollView in // --> Here
                HStack(spacing: 20) {
                    
                    ForEach(years.indices, id: \.self) { index in
                        
                        Button {
                            withAnimation(.linear(duration: 0.5)) {
                                selectedYear = years[index]
                            }
                        } label: {
                            VStack {
                                Text("\(years[index])")
                                    .foregroundColor(.white)
                                    .fontWeight(.semibold)
                                    .padding(.horizontal, 15)
                                
                                if selectedYear == years[index] {
                                    Capsule()
                                        .fill(.white)
                                        .frame(height: 5)
                                        .padding(.horizontal, -5)
                                }
                            }
                            .id(years[index]) // ---> Here
                        }
                    }
                }
                .padding().background {
                    Rectangle()
                        .fill(Color.purple)
                }
                .onAppear {
                    scrollView.scrollTo(selectedYear, anchor: .center) // ---> Here
                }
            }
        }
    }
}

相关问题