2

I want to zoom in on a specific element in the scrollview. I want it to be an anchor center. When zooming to the upper left elements, no problem, it works properly. But when you zoom in on the top right and bottom elements, space is created around it. I showed in the pictures. how can i solve this? thank you.

            GeometryReader { geo in
                ScrollView(detect.scrolID != nil ? [.horizontal,.vertical] : []) {
                    ScrollViewReader { reader in
                        BoardView(changeFrame: self.changeFrame, spotFrames: $spotFrames)
                            .frame(width: detect.scrolID != nil ? geo.size.width  * 2 : geo.size.width , height:  detect.scrolID != nil ? geo.size.width * 2 : geo.size.width)
                            .onChange(of: detect.scrolID){ value in
                                if value != nil {
                                    if camerazoom{
                                        reader.scrollTo(value, anchor: .center)
                                    }
                                }
                            }
                    }
                }
                .background(Color.blue)
            }

first loaded version of the page first load

Works correctly when zooming in on top left elements enter image description here

When zooming to the following elements, these gaps appear enter image description here

ursan526
  • 485
  • 3
  • 10
  • Have you tried to change to anchor to `.trailing`? – Hieu Dinh May 16 '21 at 12:47
  • yes inspection. this time it just creates a space at the bottom. – ursan526 May 16 '21 at 14:57
  • try [.trailing, .bottom]. So the idea is if value is in the last column then use .trailing, if the value is in the last row then use .bottom, if the value is in the last row and last column then use [.trailing, .bottom] – Hieu Dinh May 17 '21 at 03:00

0 Answers0