ScrollView 位置数据 / SwiftUi

Question

我是一名学生，刚接触 SwiftUI，还在学习。当我滚动 ScrollView 时，我希望上面的图像随着每一步慢慢增加它的不透明度。我不知道怎么做。你有什么资料吗。我找不到一个例子。你能做到吗？我们如何获取 ScrollView 运动数据？

我试了几次都失败了。

struct Home: View {
    var body: some View {
        TabView{
            NavigationView{
                ZStack {
                    GeometryReader{ geometry in
                        Color.black.edgesIgnoringSafeArea(.all)
                        VStack{//Ana sayfa image animation bölümü
                            Spacer().frame(height:geometry.size.height / 7)
                            Image("HandP")
                                .resizable()
                                .aspectRatio(ContentMode.fit)
                                .frame(width:geometry.size.width,height:geometry.size.height / 3)
                        }
                        ScrollView(.vertical){
                            VStack(spacing: 20) {
                                Spacer().frame(height:geometry.size.height / 2)//ScrollView üst boşluk
                                Button(action: {
                                    //some action
                                }) {
                                    Text("önceki")
                                }
                                
                                HStack(spacing: 10) {
                                    NavigationLink(destination: SendCoffeeFortune()){
                                        Text("Kahve Falı")
                                    }
                                    .navigationBarTitle(Text("Geri"),displayMode: .inline)
                                    .navigationBarHidden(true)
                                    
                                    Button(action: {
                                        
                                    }) {
                                        Text("Astroloji")
                                    }
                                }
                                
                                HStack(spacing: 10) {
                                    NavigationLink(destination: SpecialCoffeeFortune()){
                                        Text("Özel Fal")
                                    }
                                    .navigationBarTitle(Text("Geri"),displayMode: .inline)
                                    .navigationBarHidden(true)
                                    
                                    Button(action: {
                                        
                                    }) {
                                        Text("Tarot")
                                    }
                                }
                                
                                HStack(spacing: 10) {
                                    Button(action: {
                                        //some action
                                    }) {
                                        Text("Uyum")
                                    }
                                    
                                    NavigationLink(destination: SendHandFortune()){
                                        Text("El Falı")
                                    }
                                    .navigationBarTitle(Text("Geri"),displayMode: .inline)
                                    .navigationBarHidden(true)
                                }
                            }
                            .padding()
                            .padding()
                        }
                        
                    }
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    
                }
            }
        }
    }
}

Answer 1

我确信您可以仅使用 GeometryReader 来抵消 ScrollViews 内容，但我认为这很痛苦，如果您被允许进行学习，您应该使用 ScrollViewProxy package。

我稍微简化了你的代码，以便更容易地显示我添加的内容

import ScrollViewProxy

struct Home: View {
    @State var offset: CGPoint = .zero

    var body: some View {
        VStack {
            Image(...)
                .opacity(min(1, offset.y/100)) // You should change this to calculate when you want the opacity to change
            ScrollView { proxy in 
                Color.clear
                    .frame(height: 1000)
                    .onReceive(proxy.offset) { self.offset = $0 }
            }
        }
    }
}

如果您不能使用包，您必须使用Introspect 中的方法获取 UIScrollView，或者使用 UIViewRepresentable 创建您自己的 UIScrollView。然后您可以访问滚动视图 contentOffset。

这是后者https://gist.github.com/jfuellert/67e91df63394d7c9b713419ed8e2beb7的示例