Hi! How can I create a toolbar animation in SwiftUI like the one shown at 16:54 in WWDC session?
SwiftUI
RSS for tagProvide views, controls, and layout structures for declaring your app's user interface using SwiftUI.
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
Feedback ID: FB19846667
When dismissing a Menu view when the device is set to dark appearance, there is a flash of lightness that is distracting and feels unnatural. This becomes an issue for apps that rely on the user interacting with Menu views often.
When using the overflow menu on a toolbar, the effect of dismissing the menu is a lot more natural and there is less flashing. I expect a similar visual effect when creating Menu views outside of a toolbar.
Has anyone found a way around this somehow?
Comparison between dismissing a menu and a toolbar overflow: https://www.youtube.com/shorts/H2gUQOwos3Y
Slowed down version of dismissing a menu with a visible light flash: https://www.youtube.com/shorts/MBCCkK-GfqY
When I add a TextField with @FocusState to a toolbar, I noticed that setting focus = false doesn't cause the form to lose focus
If I move the TextField out of the toolbar setting focus = false works fine. How can I unfocus the text field when the cancel button is tapped?
Minimal example tested on Xcode Version 26.0 beta 6 (17A5305f):
import SwiftUI
struct ContentView: View {
@State private var text: String = ""
@FocusState private var focus: Bool
var body: some View {
NavigationStack {
List {
Text("Test List")
}
.toolbar {
ToolbarItem(placement: .bottomBar) {
TextField("Test", text: $text)
.padding(.horizontal)
.focused($focus)
}
ToolbarItem(placement: .bottomBar) {
Button(role: .cancel) {
focus = false // THIS DOESN'T WORK!
}
}
}
}
}
}
#Preview {
ContentView()
}```
I’ve got the new SwiftUi webview in a sheet. When I pull down the contents from the top of the page I expect it to dismiss the sheet, but it does not.
Is there a workaround or modifier I’m missing?
Hi,
I'm using one ttf font that simulate a bitmap look in my app. However, macOS renders all font with anti-aliasing. On those kind of font, that introduce some artefacts.
Is there a way to disable anti-aliasing or some tricks that would make like there were no anti-aliasing?
Thanks.
The following code:
struct ContentView: View {
@State private var email = ""
var body: some View {
VStack {
TextField("email", text: $email)
.textContentType(.emailAddress)
}
}
}
does not work as expected. What I expected is to run the app and have it suggest my actual email when I click into the field. Instead what it does is display "Hide My Email" twice. Selecting the first "Hide My Email" pastes the actual text "Hide My Email" into the field, the second one brings up an iCloud sheet to select a random email.
Trying some suggestions online for .emailAddress in general not working does not change anything:
TextField("Email", text: $email)
.textFieldStyle(RoundedBorderTextFieldStyle())
.textContentType(.emailAddress)
.keyboardType(.emailAddress)
.autocorrectionDisabled()
.disableAutocorrection(true)
.textInputAutocapitalization(.never)
Topic:
UI Frameworks
SubTopic:
SwiftUI
since upgrading my dev phone to ios26 the pop alerts in my app no longer respond to user touch.
Topic:
UI Frameworks
SubTopic:
SwiftUI
Hi everyone,
I’m encountering the following error when displaying a TextField inside a Form together with a ToolbarItem(placement: .keyboard):
Invalid frame dimension (negative or non-finite).
Environment
This issue reproduces on iPhone 12 mini (iOS 18.6).
The same code does not reproduce on iPhone 15.
I confirmed that explicitly constraining the size of the TextField or Text with .frame(width:height:) does not resolve the issue.
Minimal Reproducible Example
import SwiftUI
struct Test: View {
@State var value: Int = 0
var body: some View {
Form {
TextField("0", value: $value, format: .number)
}
.toolbar {
ToolbarItem(placement: .keyboard) {
Text("Close")
}
}
}
}
Has anyone else encountered this issue? Is this a known bug, or is there a recommended workaround for devices with smaller screen widths such as the iPhone 12 mini?
Thanks in advance for your help!
Best regards,
Naoya Ozawa
Topic:
UI Frameworks
SubTopic:
SwiftUI
FB: FB19828741
Maybe I am doing something wrong with the new LiquidGlass sidebar using iPadOS 26 Beta 7, but when using this code, in stead of the List being centered between the sidebar and the rest of the screen, the cell itself extends beneath the sidebar but the content stays clear of the sidebar, giving a weird visual effect. Not my expected behavior at least.
Any ideas? Or just a bug?
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationSplitView {
Text("Test")
} detail: {
List {
Text("ContentMargin")
}
.contentMargins(.horizontal, 100.0)
}
}
}
#Preview {
ContentView()
}
This was on iPad OS 18:
I'm working with SwiftData and SwiftUI and it's not clear to me if it is good practice to have a @ModelActor directly populate a SwiftUI view. For example when having to combine manual lab results and clinial results from HealthKit. The Clinical lab results are an async operation:
@ModelActor
actor LabResultsManager {
func fetchLabResultsWithHealthKit() async throws -> [LabResultDto] {
let manualEntries = try modelContext.fetch(FetchDescriptor<LabResult>())
let clinicalLabs = (try? await HealthKitService.getLabResults()) ?? []
return (manualEntries + clinicalLabs).sorted {
$0.date > $1.date
}.map {
return LabResultDto(from: $0)
}
}
}
struct ContentView: View {
@State private var labResults: [LabResultDto] = []
var body: some View {
List(labResults, id: \.id) { result in
VStack(alignment: .leading) {
Text(result.testName)
Text(result.date, style: .date)
}
}
.task {
do {
let labManager = LabResultsManager()
labResults = try await labManager.fetchLabResultsWithHealthKit()
} catch {
// Handle error
}
}
}
}
EDIT:
I have a few views that would want to use these labResults so I need an implementation that can be reused. Having to fetch and combine in each view will not be good practice. Can I pass a modelContext to a viewModel?
The calendar widget and buttons shows a lightened / material background behind some content when the widget is in clear / tinted mode (example here: https://developer.apple.com/videos/play/wwdc2025/278?time=72).
How can this be done? I tried applying a material and glass background to a view using the .background(...) modifier, but the background is made white.
Text("Hello")
.padding()
.background {
ContainerRelativeShape()
.fill(.thinMaterial)
}
Text("Hello")
.padding()
.background {
ContainerRelativeShape()
.glassEffect()
}
Is this not supported, a bug, or am I doing something wrong?
Hello Folks,
what's causing the "smart" dismiss after shareLink? this only happens when saving the photos.
view -> opens a popover -> sharelink -> save to photo -> Allow photo Access -> ✅
view -> opens a popover -> sharelink -> save to photo -> [Observe popover dismisses ❌] popover should stay open
Remember to add INFOPLIST_KEY_NSPhotoLibraryAddUsageDescription = save to album in project settings
import SwiftUI
@main
struct sharepopoverDismissApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
struct ContentView: View {
@State private var showingSharePopover = false
@State private var urlToShare: URL = Bundle.main.url(forResource: "BigBuckBunny", withExtension: "mp4") ?? URL(string: "https://www.example.com")!
var body: some View {
VStack {
Button {
showingSharePopover = true
} label: {
Label("Show Share Options", systemImage: "square.and.arrow.up")
.font(.title2)
.padding(.vertical, 10)
.padding(.horizontal, 20)
}
.buttonStyle(.borderedProminent)
.tint(.indigo)
.controlSize(.large)
.shadow(radius: 5)
.popover(isPresented: $showingSharePopover, attachmentAnchor: .point(.center)) {
ShareLinkPopoverView(url: urlToShare)
}
}
.padding()
}
}
struct ShareLinkPopoverView: View {
let url: URL
var body: some View {
VStack(spacing: 20) {
ShareLink(item: url) {
Label("Share Now", systemImage: "square.and.arrow.up")
.font(.headline)
.padding(.vertical, 8)
.padding(.horizontal, 15)
}
.interactiveDismissDisabled()
.buttonStyle(.borderedProminent)
.tint(.green)
.controlSize(.regular)
}
.padding(20)
.presentationCompactAdaptation(.popover)
}
}
Take this piece of code for example:
Menu {
...
} label: {
Image(systemName: "ellipsis.circle")
.resizable()
.foregroundStyle(Color.primary)
.frame(width: 24, height: 24)
.contentShape(.circle)
.padding(.spacing8)
.glassEffect(.regular.interactive(), in: .circle)
}
.tint(nil)
When tapped, the interactive liquid glass effect expands in response, but the expanded glass is then clipped by the original bounds of the view. In this example, the button would briefly show up as a highlighted square due to the clipping.
If I add enough padding around the Menu's label, the expanded glass effect is be able to show unclipped, but this feels like a hack.
Is this a bug in the framework, or am I doing something wrong? I have submitted FB19801519 with screen recording and demo project.
The default style for a segmented picker in iOS 26 is now a capsule shape. Is it possible to get back the previous rounded rectangle shape?
In SwiftUI I have tried using the clipShape, containerShape, and background modifiers, applying a RoundedRectangle shape with a corner radius, to no avail. In UIKit I have tried to adjust the corner configuration for the UISegmentedControl, also to no avail.
Am I missing something really obvious or is it impossible to change the style here? 🤔
In the iOS 26 developer preview, I noticed that the new Liquid Glass style only applies when the user’s home screen theme is set to transparent. Is it possible to allow users to directly set the new Liquid Glass style for widgets, instead of having it tied to the home screen theme setting?
When navigationTransition returns through the return gesture, the original view disappears。
The same problem occurs when using the official example。
https://developer.apple.com/documentation/swiftui/enhancing-your-app-content-with-tab-navigation
xcode Version 16.4 (16F6)
macOS 15.5
How can I remove the "recents" section from long-pressing on my app icon?
I've added the following to my AppDelegate, which removes it from the top MenuBar, but not from the app icon context menu.
My app has registered a custom filetype, but it is not a document based app. Opening files imports them into the app's user library, and so does not make sense to have a "recents" list.
override func buildMenu(with builder: any UIMenuBuilder) {
super.buildMenu(with: builder)
builder.remove(menu: .openRecent)
}
Hi all,
After upgrading to the iOS 26 beta, the scrolling in my SwiftUI chat view is completely broken. The exact same code works perfectly on iOS 18.
Context:
I have a chat view using ScrollViewReader and a vertically-reversed ScrollView (with .rotationEffect(.degrees(180))). Each message row (MessageBubble) uses multiple simultaneousGesture handlers:
Horizontal drag for swipe-to-reply (and other actions: pin, delete)
Long press for showing popover/actions
Vertical scroll for normal chat scrolling
This was working great on iOS 18. In iOS 26 beta, the vertical scroll is either completely disabled, jittery, or hijacked by the message row’s drag gestures, even though .simultaneousGesture is used (see code below).
Minimal Repro Sample
MessageListView.swift
swift
Copy
Edit
ScrollViewReader { proxy in
ScrollView(.vertical, showsIndicators: false) {
LazyVStack(spacing: 0) {
// ... grouped messages
ForEach(...) { ...
MessageBubble(...) // see below
}
Color.clear.frame(height: 8).id("BOTTOM_ANCHOR")
}
.padding(.horizontal, 4)
.rotationEffect(.degrees(180))
}
.rotationEffect(.degrees(180))
}
MessageBubble.swift
struct MessageBubble: View {
// ...
var body: some View {
// horizontal swipe-to-reply gesture
let dragGesture = DragGesture(minimumDistance: 10)
// ...
ZStack {
// ...
HStack { ... }
// ...
.simultaneousGesture(
DragGesture(minimumDistance: 0) // for long press
// ...
)
.simultaneousGesture(dragGesture) // for horizontal swipe
}
// ...
}
}
On iPadOS 26 (up to beta 7), .sheet backgrounds have a dark green tint on Dark Mode and a gray tint on Light Mode. This is clearly noticeable on both the Canvas/Simulator and a physical device.
Here's a sample View that shows the issue:
import SwiftUI
struct ContentView: View {
@State private var isPresenting: Bool = false
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundStyle(.tint)
Text("Hello, world!")
Button("Show Sheet") {
isPresenting.toggle()
}
}
.sheet(isPresented: $isPresenting) {
VStack {
HStack {
Spacer()
Button("Cancel", systemImage: "xmark.circle.fill") {
}
.foregroundStyle(.secondary)
.labelStyle(.iconOnly)
.buttonStyle(.plain)
.contentShape(.circle)
}
TabView {
Tab("Tab 1", systemImage: "cart") {
Text("Hello, tab 1")
}
Tab("Tab 2", systemImage: "cart") {
Text("Hello, tab 2")
}
}
}
.scenePadding()
}
.padding()
.preferredColorScheme(.dark)
}
}
#Preview {
ContentView()
}
Is this the expected behavior with the new OS? Anyone else seeing this?
Topic:
UI Frameworks
SubTopic:
SwiftUI
Hi everyone,
I’m building an iOS 18+ app in Xcode where Apple Maps is central. My goal is to start with the default Apple Maps experience (map view, search bar, pins, directions sheet, etc.) and then customize it for my project.
I tried coding it from scratch using MapKit and SwiftUI, but I wasn’t able to get full parity with the basic features of the Maps app.
My questions:
Is there any sample project, template, or reference that provides the default Apple Maps functionality (views + interactions) as a baseline?
Can I copy these into my Xcode project and then extend/customize them?
If not, what’s the recommended best practice to get as close as possible to the native Maps app before adding my own features?
Any guidance, sample code, or documentation links would be greatly appreciated.