Scroll to a particular position of an image inside ScrollView

Question

I have a long image inside a scrollview. On change of the time, I would like the scrollview scroll to the right.

ScrollView(.horizontal, showsIndicators: true, content: {
                    VStack {
                        Image(uiImage: s_img).resizable().frame(height:audioImageHeight)
                    }
                    
                })

A few issues I have encountered here:

1. The width of the scrollview should be same as the image width. I therefore obtain the image width using UIImage. Originally I planned to use GeometryReader but fails to obtain that.
2. There will be a value change using a Timer. I would like the scrollview automatically scroll to the right when the timer start
3. I tried to use ScrollViewReader or ScrollViewProxy, none of them work. Most of the answers in the forum can use proxy.scrollTo() but normally there is a "id" to scroll to that position. In my case, there is no Id, the position is the offset of the ScrollView content. In the past, it was achieve by UIScrollView.setContentOffset(). How to achieve in Swiftui?

Answer 1

Just give your image an id and your be able to scroll to its unipoints.

struct ContentView: View {
    
    var body: some View {
        ScrollViewReader { proxy in
            VStack {
                Button("Scroll to Bottom rigth of the contents") {
                    withAnimation {
                        proxy.scrollTo(10001, anchor: .bottomTrailing)
                    }
                }
                Button("Scroll to Top left of the contents") {
                    withAnimation {
                        proxy.scrollTo(10001, anchor: .topLeading)
                    }
                }
            }
            .buttonStyle(.bordered)
            ScrollView([.horizontal, .vertical]) {
                
                Image(systemName: "star")
                    .resizable()
                    .aspectRatio(1, contentMode: .fit)
                    .frame(width: 800, height: 1200)
                    .id(10001)
            }
        }
    }
}