【问题标题】:SwiftUI reverse ScrollView from bottom to topSwiftUI 从下到上反转 ScrollView
【发布时间】:2020-08-14 16:09:15
【问题描述】:

我想制作一个 ScrollView,让我可以从底部滚动到顶部。 基本上我有一个渐变背景(底部 - 黑色,顶部 - 白色)。当我设置 ScrollView 时,我可以从白色向下滚动到黑色。我希望应用程序从 ScrollView 的底部开始,让我可以向上滚动。 (从黑到白)

谢谢!

当前代码:

struct ContentView: View {
var body: some View {


    ScrollView(.vertical/*, showsIndicators: false*/){
        VStack(spacing: 0) {
            ForEach ((0..<4).reversed(), id: \.self) {
                Image("background\($0)").resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(width: UIScreen.main.bounds.width ,height:1000)
            }
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color.red)
    }
    .edgesIgnoringSafeArea(.all)

}   

}

【问题讨论】:

标签: xcode uiscrollview swiftui scrollview xcode11


【解决方案1】:

我希望滚动视图从下到上而不是从上到下显示。这有我的答案:https://www.thirdrocktechkno.com/blog/implementing-reversed-scrolling-behaviour-in-swiftui/

TLDR: .rotationEffect(Angle(degrees: 180)).scaleEffect(x: -1.0, y: 1.0, anchor: .center) 在滚动视图和滚动视图中的项目上

我的完整代码:


ScrollView(.vertical, showsIndicators: true, content: {
                LazyVStack(alignment: .center, spacing: nil, pinnedViews: [], content: {
                    ForEach(1...5, id: \.self) { count in
                        ScrollView(.horizontal, showsIndicators: false, content: {
                            LazyHStack(alignment: .center, spacing: nil, pinnedViews: [], content: {
                                ForEach(1...10, id: \.self) { count in
                                    Text("Placeholder \(count)").rotationEffect(Angle(degrees: 180)).scaleEffect(x: -1.0, y: 1.0, anchor: .center)
                                }
                            })
                        })
                    }
                })
            }).rotationEffect(Angle(degrees: 180)).scaleEffect(x: -1.0, y: 1.0, anchor: .center)

【讨论】:

  • 你链接的文章没有提到任何关于使用 rotationEffect() 的内容。这是两种不同的解决方案吗?
猜你喜欢
  • 1970-01-01
  • 2020-04-01
  • 2019-11-29
  • 1970-01-01
  • 1970-01-01
  • 2021-02-04
  • 1970-01-01
  • 2021-08-01
  • 1970-01-01
相关资源
最近更新 更多