Implementing Liquid Glass in Team Sheets (iOS 26)

Week 412 was posted by Charanjit Chana on 2025-09-15.

In truth, Team Sheets began life after iOS 26 was already announced so I already knew there would be some visual upheaval so I knew I needed to approach it right from the beginning.

Team Sheets is ultimately a NavigationStack inside a TabView, as you drill down you are just following predefined paths with the ability to jump levels where it makes sense using some common gestures on lists.

The app was built to feel like it was actually made by Apple rather than trying to re-invent the wheel. The opposite of the approach I took with Kop Quiz but thanks to Liquid Glass, I've actually brought that back to use more native components.

In reality, there were few changes that were needed. I still wanted to support iOS 18 so I need to apply modifiers conditionally depending on the version if iOS that you have. This means there are a handful of places where I am applying a subtitle to the view where it makes sense to do so. I'm also marking a toolbar button with the role .confirm when I can which automatically tints it appropriately. I had previously looked at tinting it green but I settled on following Apple's own apps which use the system-wide blue.

Let's look at how the views differ.

Bigger, rounder buttons

Screenshots of Team Sheets iOS app on an iOS 18 and iOS 26 device side-by-side.
iOS 18 left, iOS 26 right

The iOS 26 implementation has the new floating tab bar, larger "confirmation" buttons in the header and rounder buttons in general. Would have been possible to rebuild with no code changes but I wanted to add the subtitle so there's a conditional modifier used to implement that in IOS 26. The only other modifier for iOS 26 specifically was for the minimising of the TabView on scroll. It's a flow you need to opt in to and for an app where you will be scrolling I think it makes sense to take advantage of it.

Ideally I'd have had a button above the tab bar on certain views but it appears to only be possible with the new accessory placement but that is full width and app-wide so doesn't quite work for Team Sheets.

Rounder lists

screenshot of Team Sheets' list view side-by-side
iOS 18 left, iOS 26 right

Again we're looking at rounder elements here for the search bar, list row and the swipe actions. Zero code changes again but interestingly, I implemented the swipe buttons using the Label view type and on iOS 26 it shows the text label and the icon whereas iOS 18 only shows the icon.

Screenshots of Team Sheets swipe actions side-by-side.
iOS 18 left, iOS 26 right

Blurred lines

Screenshots of Team Sheets header treatment side-by-side.
iOS 18 left, iOS 26 right

For a long time, iOS has always had a distinct header of some sort. The treatment to buttons has changed from obvious tap targets to borderless but we're back to proper buttons now with Liquid Glass.

Consistent padding and concentricity

Screenshots of Team Sheets custom view showing the side-by-side comparison of different padding.
iOS 18 left, iOS 26 right

For nested views, the padding is far more consistent and thanks to the focus on concentric shapes it means buttons sit nicely within their containers. I'm pleased with this change because I would apply padding vertically and horizontally as I felt I should rather than letting the elements work themselves out. Sometimes things felt very tight as you can see on the left, but then adding default padding would look sparse. I've tried not to specify a number value for padding but it's no longer a concern.

How did it go?

I could have done nothing and Team Sheets would have worked just fine. I haven't strayed from everything SwiftUI has to offer so that's not really a surprise. Views definitely feel roomier which impacts the amount of content you can see but that's not always a bad thing.

I'm still waiting to be allowed to submit the app, so hopefully that comes soon. There's the Apple event on Tuesday so maybe they'll give the go ahead then.

Have you been able to port your app to iOS 26?


Tags:


Tweet WhatsApp Keep Upvote Digg Tumblr Pin Blogger LinkedIn Skype LiveJournal Like