SwiftUI：调整 ScrollView 的边界

Posted 2023-02-24

【中文标题】SwiftUI：调整 ScrollView 的边界

【英文标题】：SwiftUI: Adjust bounds of ScrollView

【发布时间】：2021-10-03 06:35:13

【问题描述】：

我正在尝试使用scaleEffect 和MagnificationGesture 水平缩放视图。 除了 ScrollView 在其子视图调整大小时不会调整大小之外，它几乎可以按我的意愿工作。

有解决办法吗？任何解决方案将不胜感激。

复制：

运行下面的代码 使用捏合手势水平放大图像 请注意，ScrollView 会滚动，就好像图像仍然具有相同的大小。

struct ContentView: View 

    @State private var currentAmount: CGFloat = 0
    @State private var finalAmount: CGFloat = 1

    var body: some View 
        ScrollView(.horizontal) 
            Image(systemName: "star")
                .resizable()
                .scaledToFit()
                .scaleEffect(x: finalAmount + currentAmount, y: 1)
                .gesture(
                    MagnificationGesture()
                        .onChanged  amount in
                            self.currentAmount = amount - 1
                        
                        .onEnded  amount in
                            self.finalAmount += self.currentAmount
                            self.currentAmount = 0
                        
                )
        
        .frame(maxHeight: 300)
    

【问题讨论】：

缩放效果只是一种视觉效果，真实的框架保持不变 - 所以如果你想改变真实的视图大小，那就改变它的框架。

就是这样！除规模以外的任何事情！

【参考方案1】：

这个视图可以做到。

struct HorizontalScaleView<Content: View>: View 

    @ViewBuilder var content: Content

    @State private var currentAmount: CGFloat = 0
    @State private var finalAmount: CGFloat = 1

    var body: some View 
        GeometryReader  geo in
            ScrollView(.horizontal) 
                content
                    .scaledToFit()
                    .scaleEffect(x: finalAmount + currentAmount, y: 1)
                    .frame(width: (finalAmount + currentAmount) * geo.size.width, height: geo.size.width)
                    .gesture(
                        MagnificationGesture()
                            .onChanged  amount in
                                self.currentAmount = amount - 1
                            
                            .onEnded  _ in
                                if self.finalAmount + self.currentAmount >= 1 
                                    self.finalAmount += self.currentAmount
                                 else 
                                    self.finalAmount = 1
                                
                                self.currentAmount = 0
                            
                    )