SwiftUI Scrolling Control from Parent View: How to Scroll to Bottom?

Scrolling Up Programmatically is easy. Understanding it is big step towards knowing how SwiftUI works.

SwiftUI recently added a scrollView.scrollTo method, which moves view to show arbitrary row: scrollView.scrollTo(self.fetchRequest.wrappedValue[self.fetchRequest.wrappedValue.endIndex — 1], anchor:.bottom)

This is tremendously helpful and with additional few ingredients forms an elegant solution.

  1. Each row of the ScrollView must have a “.id(index)” — without this tag, the scrollTo method will not know where to scroll to. Unfortunately, if we leave this step out, there will be no compile or run-time error, just that the scrollView will be move at all when scrollTo gets triggered.
  2. “.onChange” attached to the loop, inside the scrollView — this is the final piece of the listener that will activate the scrollTo action. This has to be inside the scrollView in order to be able to call the scrollView.scrollTo method.

.onChange(of: state.message) {

scrollView.scrollTo(20, anchor:.bottom)

}

At the top of the file, declare “@ObservedObject var state:ScrollTrigger”

class ScrollTrigger: ObservableObject {

@Published var message: Bool = false

func update() {

message.toggle()

}}

5. In the parent view, also add an ObservedObject, so that it can be passed the the child view for purpose of sending an “update” toggle:

@ObservedObject var state = ScrollTrigger()

6. When including the child view in the parent view, make sure that this “state” variable is shared with the child:

ThisIsTheChildView(state:state)

In this way, the two variables “state” in the parent and child views are connected, such that changing the value “state” in the parent will trigger the “onChange” in the child view.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store