First post 😎
I'm trying to implement a cross-platform chat-like interface and this has been irking me for a while. Take this code:
import SwiftUI
import PlaygroundSupport
struct ContentView: View {
@State var text = ""
var body: some View {
ScrollViewReader { scrollView in
ScrollView {
LazyVStack {
Button("scroll down") { [scrollView] in
scrollView.scrollTo(49, anchor: .bottom)
}
ForEach(1..<50) { i in
Text("\(i). Hello")
.padding()
.frame(maxWidth: .infinity)
.background {
RoundedRectangle(cornerRadius: 20)
.strokeBorder()
.shadow(radius: 2)
}
.foregroundColor(.secondary)
.id(i)
}
}
}
.safeAreaInset(edge: .bottom) {
TextField("Input", text: $text)
.textFieldStyle(.plain)
.padding()
.background {
RoundedRectangle(cornerRadius: 20)
.fill(.thinMaterial)
RoundedRectangle(cornerRadius: 20)
.strokeBorder(.primary, lineWidth: 3)
}
}
}
}
}
let contentView = ContentView()
PlaygroundPage.current.setLiveView(
contentView
.frame(width: 400, height: 400)
)
Copy it into an iOS playground, tap the scroll down button at the top, you get:
Now paste the same code into a macOS playground, click the scroll down button and you get:
Note how on iOS we correctly get 49. Hello right above the input TextField that's on the unsafeAreaInset while on macOS we get 48. Hello in that position while 49. Hello is obstructed by the TextField...
I'm assuming it's possible to voodoo around it somehow using GeometryReader or AlignmentGuide but I'm very new to this and was hoping to be able to dodge such advanced topics at this point... Also, being very new to this I like the confidence to shout "BUG!!!" and am more inclined to believe that my understanding lacks something fundamental so I'm asking the community for guidance. Looking for an elegant workaround and/or validation regarding the bugginess of this behaviour.
Thanks in advance 😊