How to make a List or ScrollView in SwiftUI that starts from the bottom

When I figured this out I felt like I’d got a week of my life back.

SwiftUI does not yet support imperatively scrolling a ScrollView to a specific offset. This is not great if you want to make a chat-style UI where it needs to start from the bottom.

Here is a chat UI starting from the bottom

You don’t have to wrap everything up in a UIViewRepresentable component or put content in a nested UIHostingController (which I found messes up NavigationLink behaviour). Here’s how I fixed this problem:

List {
  ForEach(items){ item in
    ItemRow(item).flippedUpsideDown()
  }
}.flippedUpsideDown()

There it is. You just rotate the List or ScrollView 180º and flip it horizontally, then flip each row in the same way.

Here’s the view modifier this calls:

struct FlippedUpsideDown: ViewModifier {
   func body(content: Content) -> some View {
    content
      .rotationEffect(.pi)
      .scaleEffect(x: -1, y: 1, anchor: .center)
   }
}
extension View{
   func flippedUpsideDown() -> some View{
     self.modifier(FlippedUpsideDown())
   }
}

And there you have it.

—

Find out more about my new app Changes.

Watch me live stream on Twitch.