ScrollPosition for ScrollView in iOS 17 and SwiftUI 5

ScrollPosition for ScrollView in iOS 17 and SwiftUI 5

With the release of iOS 17, SwiftUI’s ScrollView received many new modifiers. One such modifier is called scrollPosition and it gives us the ability to control the start position of scroll in ScrollView. We can use this modifier to specify an anchor to control which part of the scroll view’s content should be initially visible.

DevTechie

By default, SwiftUI’s ScrollView initiates scrolling from the top. However, if we wish to replicate the user interface of Apple’s Messages app, we can instruct the scroll view to begin at the bottom by using scrollPosition modifier.

Let’s look at an example by building a simple chat interface.

We will start with the data structure for our screen.

struct Chat: Identifiable {
    let id = UUID()
    var message: String
    var isReceived = false
}

Let’s add some sample conversation data between DevTechie and maybe you :)

extension Chat {
    static var sample: [Chat] {
        [
            .init(message: "Hello"),
            .init(message…