I’ve taken a liking to some explicit apps which have a shade/background behind their toolbar on the high of the view, as if to emphasise the navigation titles/headers, however then you’ll be able to scroll previous it.
I am concentrating on iOS 26. That is principally what I’ve to this point, which leaves me a traditional coloured toolbar, that is sticky:
struct ContentView: View {
var physique: some View {
NavigationStack {
ScrollView {
ForEach(0..<50, id: .self) { index in
Textual content("(index)")
}
.body(maxWidth: .infinity)
}
.toolbarBackground(.blue, for: .navigationBar)
.toolbarBackground(.seen, for: .navigationBar)
.toolbar {
ToolbarItem(placement: .topBarLeading) {
Textual content("Title")
.fontWeight(.daring)
.font(.title2)
.fixedSize()
}
.sharedBackgroundVisibility(.hidden)
}
}
}
}
Which yields a semi clear sticky header shade:
![Tips on how to have non-sticky toolbar background in SwiftUI [closed] Tips on how to have non-sticky toolbar background in SwiftUI [closed]](https://i.sstatic.net/ZLLuy68mm.png)
I’ve experimented with conditionally setting .toolbarBackground(.seen/.hidden...) to different success, which additionally is not non-sticky, simply modifications the opacity.
Anybody know the way to do that? Instance screenshots beneath from Slack app, earlier than and after scrolling down. On this case, it seems to be like their title can be non-sticky nonetheless.
I am open to utilizing UIKit right here too.
That is what I am going for, observe that the header is purple solely when on the high of the web page, however fades out slowly, and it additionally has a "exhausting" line on the backside that recedes as I scroll upwards.

(sorry about dangerous gif high quality – wanted to compress to add)

