How to align content at bottom after zooming in a SwiftUI ScrollView?

Question

In my app, I can align my content at bottom of my ScrollView using this code:

ScrollView([.horizontal, .vertical], showsIndicators: true) {

    StorageDrawingView(storageVM: storageVM)
        .frame(maxWidth: .infinity, minHeight: geometrySize.height, alignment: .bottom)
        .scaleEffect(zoomFactor)
        .scrollTargetLayout()

} // End ScrollView

This means, using the geometrySize and frame alignment, it works.

Now, I want to zoom in the scroll view. So I used the new MagnifyGesture() of iOS 17. Once again, it works, I can zoom and unzoom.

However, I did'nt find the solution to keep the content view aligned at bottom after the zoom. It is centered in the ScrollView.

I made some tests, tried the new iOS 17 .scrollPosition(id: $position) but this one is useful for lists/items with id. It's not my case.

Is-it possible to scroll to bottom manually after zooming ? Or set a location (x,y) ?

Answer 1

Use scaleEffect(:, anchor:):

StorageDrawingView(storageVM: storageVM)
        .frame(maxWidth: .infinity, minHeight: geometrySize.height, alignment: .bottom)
        .scaleEffect(CGSize(width: zoomFactor, height: zoomFactor), anchor: UnitPoint(x: 0.5, y: 1))
        .scrollTargetLayout()