Explore the various UI frameworks available for building app interfaces. Discuss the use cases for different frameworks, share best practices, and get help with specific framework-related questions.

All subtopics
Posts under UI Frameworks topic

Post

Replies

Boosts

Views

Activity

FileExporter's action label always says "Move"
I would like to implement an "Export" dialog using the .fileExporter() view modifier. The following code works correctly, but the FileExporter's action label always says "Move", which is inappropriate for the context. I would like to change it to say "Export", "Save", "Save as", or anything semantically correct. Button("Browse") { showingExporter = true } .buttonStyle(.borderedProminent) .fileExporter( isPresented: $showingExporter, document: document, contentType: .data, defaultFilename: suggestedFilename ?? fileUrl.pathComponents.last ?? "Untitled" ) { result in switch result { case .success(let url): print("Saved to \(url)") onSuccess() case .failure(let error): print(error.localizedDescription) onError(error) } } "document" is a custom FileDocument with a fileWrapper() method implemented like this: func fileWrapper(configuration: WriteConfiguration) throws -> FileWrapper { return FileWrapper(regularFileWithContents: data) } This was tested on iOS 26 beta 3.
Topic: UI Frameworks SubTopic: SwiftUI
0
0
70
1w
iOS 26: .tabViewBottomAccessory - How to open a new view on the tabViewBottomAccessory
If you are currently on the beta of iOS 26, open Apple Music and you'll see a tabViewBottomAccessory that is the mini NowPlayingView. When tapped, it opens the NowPlayingView. Is there a similar way to do this in SwiftUI? Looking through Apple's documentation, they do not specify any way to reproduce the same kind of view transition. This is the Apple Music app with the tabViewBottomAccessory. When clicked it opens the NowPlayingView
0
0
59
1w
SwiftUI & Xcode 26.0 beta3: Using Map in LazyVGrid causes "Observation tracking feedback loop"
The following code causes an error in Xcode 26.0 beta3 in iOS Simulator with iOS 26.0. After starting the App, scroll to the end of the grid and the app will break. Testet with Xcode Playground with platforms: [ .iOS("17.0")], Simplest possible variant: import SwiftUI import MapKit struct ContentView: View { var body: some View { NavigationStack { ScrollView { LazyVGrid(columns: [GridItem()]) { ForEach(1...12, id:\.self) { i in Text("Hello \(i)") .frame(height: 150) } Map { } .frame(height: 150) } } } } } Thrown error: Observation tracking feedback loop detected! Make a symbolic breakpoint at UIObservationTrackingFeedbackLoopDetected to catch this in the debugger. Refer to the console logs for details about recent invalidations; you can also make a symbolic breakpoint at UIObservationTrackingInvalidated to catch invalidations in the debugger. Object receiving repeated [updateProperties] invalidations: <UIKit.NavigationBarContentView: 0x103026000; frame = (0 0; 402 54); gestureRecognizers = <NSArray: 0x600000c26790>; layer = <CALayer: 0x600000c2d4a0>> contentView=0x0000000103026000 These three nested views are necessary to reproduce the error: NavigationStack -> ScrollView -> LazyVGrid In iOS Simulator with iOS 18.0 there is no error message, the CPU raises to 100%. With Xcode 16.4 the program runs error-free. Is there a solution?
3
1
147
1w
AlarmKit alarms only showing on lock screen
I am using AlarmKit to schedule alarms in an app I am working on, however my scheduled alarms only show up on the lock screen. If I am on the home screen or elsewhere I only hear the sound of the alarm, but no UI shows up. Environment: iOS 26 beta 3 Xcode 26 beta 3
Topic: UI Frameworks SubTopic: SwiftUI
0
0
89
1w
Make a grid of `TextField`s in SwiftUI
Code that reproduces the issue import SwiftUI @main struct TextFieldsGridApp: App { @State private var controller = Controller() var body: some Scene { WindowGroup { GridView() .environment(controller) } } } struct GridView: View { @Environment(Controller.self) private var c var body: some View { VStack { ForEach(0..<c.strings.count, id: \.self) { r in HStack { ForEach(0..<4, id: \.self) { c in TextField( "", text: c.strings[r][c] ) .textFieldStyle(.roundedBorder) } } } } .padding() } } #Preview { GridView() .environment(Controller()) } @Observable class Controller { private(set) var strings: [[String]] = Array( repeating: Array(repeating: "A", count: 4), count: 4, ) } Error Cannot convert value of type 'Range<Int>' to expected argument type 'Binding<C>', caused by ForEach(0..<4, id: \.self) { c in. Which I do not get if I say, for example: struct GridView: View { @State private var text = "H" // ... TextField("", text: $text) Environment MacBook Air M1 8GB iOS Sequoia 15.5 Xcode 16.4 Preview: iPhone 16 Pro, iOS 18.5.
Topic: UI Frameworks SubTopic: SwiftUI
1
0
81
1w
Trying to Apply Content Configuration on a UICollectionReusableView
I was trying to register a UICollectionReusableView in my UICollectionView.SupplementaryRegistration handler in order to apply a content configuration to apply the text and secondaryText properties to the reusable view. However, when I try to apply the content configuration on the header view object that I return in my cell registration handler, I get an error that says: "Value of type 'UICollectionReusableView' has no member 'contentConfiguration'". How can apply content configuration to a UICollectionReusableView? This is my code: let headerRegistration = UICollectionView.SupplementaryRegistration<UICollectionReusableView>(elementKind: UICollectionView.elementKindSectionHeader) { header, elementKind, indexPath in // Header configuration is handled in the header's init var configuration = UIListContentConfiguration.plainHeader() configuration.text = "Current Emotional State" configuration.secondaryText = "What best describes how you're feeling right now?" header.contentConfiguration = configuration }
Topic: UI Frameworks SubTopic: UIKit
1
0
109
1w
Preview crashes when using ForEach with a Binding to an array and generics
The following repro case results in a previews crash on Xcode 26 beta 3 (report attached). FB18762054 import SwiftUI final class MyItem: Identifiable, Labelled { var label: String init(_ label: String) { self.label = label } } protocol Labelled { var label: String { get } } struct HelloView: View { let label: String var body: some View { Text(label) } } struct ListView<Element: Labelled & Identifiable>: View { @Binding var elements: [Element] var body: some View { List { ForEach($elements, id: \.id) { $element in HelloView(label: element.label) // crash // Replacing the above with a predefined view works correctly // Text(element.label) } } } } struct ForEachBindingRepro: View { @State var elements: [MyItem] = [ MyItem("hello"), MyItem("world"), ] var body: some View { ListView(elements: $elements) } } #Preview("ForEachBindingRepro") { ForEachBindingRepro() } foreachbindingrepro-2025-07-12-020628.ips
6
0
138
1w
preferredTransition not working when using setViewControllers(_:animated:)
I’m using the new preferredTransition = .zoom(...) API introduced in iOS 18. Here’s a simplified version of what I do on app startup: let listVC = CollectionViewController(collectionViewLayout: layout) let detailVC = DetailViewController() detailVC.preferredTransition = .zoom(sourceViewProvider: { context in let indexPath = IndexPath(row: 0, section: 0) let cell = listVC.collectionView.cellForItem(at: indexPath) return cell }) let nav = UINavigationController() nav.setViewControllers([listVC, detailVC], animated: false) window?.rootViewController = nav window?.makeKeyAndVisible() This is meant to restore the UI state from a previous session — the app should launch directly into the DetailViewController. The Problem When I launch the app with setViewControllers([listVC, detailVC], animated: false), the transition from listVC to detailVC appears correctly (i.e., no animation, as intended), but the drag-to-dismiss gesture does not work. The back button appears, and tapping it correctly triggers the zoom-out transition back to the cell, so the preferredTransition = .zoom(...) itself is properly configured. Interestingly, if I delay the push with a DispatchQueue.main.async and instead do: nav.setViewControllers([listVC], animated: false) DispatchQueue.main.async { nav.pushViewController(detailVC, animated: true) } …then everything works perfectly — including the interactive swipe-to-dismiss gesture — but that introduces an unwanted visual artifact: the user briefly sees the listVC, and then it pushes to detailVC, which I’m trying to avoid. My Question Is there a way to enable the swipe-to-dismiss gesture when using setViewControllers([listVC, detailVC], animated: false) It can be very confusing for users if swipe-to-dismiss only works in certain cases inconsistently. Thanks
2
0
178
1w
iOS 26 beta: infinite loop in UISplitViewController logging
In the Console, when presenting my view in a horizontally compact environment, I see: UINavigationController for collapsing UISplitViewController about to push view controller <UINavigationController: 0x107933c00> This message repeats infinitely, until the Xcode debugger eventually says: QUARANTINED DUE TO HIGH LOGGING VOLUME Of note is that this only occurs in the beta, does not occur when using the iOS 18.x SDK, and only occurs in a compact environment. EDIT: This occurs only when setting the secondary column of a doubleColumn UISplitViewController: splitVC.setViewController(secondary, for: .secondary) EDIT 2 and WORKAROUND: If this action is deferred until after viewDidAppear, it self-resolves: public override func viewDidAppear(_ animated: Bool) { super.viewDidAppear(animated) if let deferredSecondaryViewController { splitVC.showDetailViewController(deferredSecondaryViewController, sender: nil) } }
Topic: UI Frameworks SubTopic: UIKit
0
0
123
1w
UIRequiresFullScreen in iPadOS 26
Our app includes the UIRequiresFullScreen plist key, but the iPadOS 26 betas seem to ignore this. The window handle is still displayed, and while the window aspect ratio seems to be constrained, you can still adjust it and arrange it alongside other apps. We do not want to support windowing or multi-tasking, and the WWDC sessions indicated there would be a way to opt out of the new windowing system. Has UIRequiresFullScreen been silently deprecated, or are we missing something in our implementation?
5
0
205
1w
SwiftUI .toolbar(.keyboard) Not Showing on First Appearance in fullScreenCover (iOS 18)
I’m encountering an issue in iOS 18.5 (and most probably across all iOS 18 versions) where the keyboard toolbar defined with .toolbar(.keyboard) does not appear immediately when a TextField becomes first responder inside a fullScreenCover. Here’s a minimal reproducible example: import SwiftUI struct ContentView: View { @State private var text: String = "" @State private var showSheet: Bool = false var body: some View { NavigationStack { Button("Show Sheet") { showSheet.toggle() } .fullScreenCover(isPresented: $showSheet) { NavigationStack { VStack { Button("Dismiss") { showSheet.toggle() } TextField("Enter text", text: .constant("Hello")) .autocorrectionDisabled() .textInputAutocapitalization(.never) } .padding() .toolbar { ToolbarItemGroup(placement: .keyboard) { toolBar } } } } } } private var toolBar: some View { HStack { Spacer() Button("Done") { UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil) } } } } ✅ Expected Behavior: When the TextField becomes active and the keyboard appears, the custom keyboard toolbar with a “Done” button should also appear immediately. ❌ Actual Behavior: On first presentation of the sheet and focusing the TextField, the toolbar is missing. If I background the app and return, the toolbar appears as expected. Dismissing and re-opening the sheet leads to the same issue (toolbar missing again).
Topic: UI Frameworks SubTopic: SwiftUI
2
0
68
1w
Different toolbar item placement for iPhone vs iPad
On iPhone, I would like to have a more button at the top right of the navigation bar, a search field in the bottom toolbar, and a plus button to the right of the search field. I've achieved this via the code below. But on iPad they should be in the navigation bar at the trailing edge from left to right: plus, more, search field. Just like the Shortcuts app, if there's not enough horizontal space, the search field should collapse into a button, and with even smaller space the search bar should become full-width under the navigation bar. Right now on iPad the search bar is full width under the navigation bar, more at top right, plus at bottom middle, no matter how big the window is. How can I achieve that? Any way to specify them for the system to more automatically do the right thing, or would I need to check specifically for iPhone vs iPad UIDevice to change the code? struct ContentView: View { @State private var searchText = "" var body: some View { NavigationStack { VStack { Text("Hello, world!") } .navigationTitle("Test App") .searchable(text: $searchText) .toolbar { ToolbarItem { Menu { //... } label: { Label("More", systemImage: "ellipsis") } } DefaultToolbarItem(kind: .search, placement: .bottomBar) ToolbarSpacer(.fixed, placement: .bottomBar) ToolbarItem(placement: .bottomBar) { Button { print("Add tapped") } label: { Label("Add", systemImage: "plus") } } } } } }
2
0
60
1w
How to hide scroll edge effect until scroll down
I present a view in a sheet that consists of a navigation stack and a scroll view which has a photo pushed to the top by setting .ignoresSafeArea(edges: .top). The problem is the top of the photo is blurry due to the scroll edge effect. I would like to hide the scroll edge effect so the photo is fully visible when scrolled to the top but let the effect become visible upon scrolling down. Is that possible? struct ContentView: View { @State private var showingSheet = false var body: some View { VStack { Button("Present Sheet") { showingSheet = true } } .sheet(isPresented: $showingSheet) { SheetView() } } } struct SheetView: View { @Environment(\.dismiss) private var dismiss var body: some View { NavigationStack { ScrollView { VStack { Image("Photo") .resizable() .scaledToFill() } } .ignoresSafeArea(edges: .top) .toolbar { ToolbarItem(placement: .cancellationAction) { Button(role: .close) { dismiss() } } ToolbarItem { EditButton() } } } } }
1
0
68
1w
UISearchBar .minimal no background when compiled on Xcode 26
When compiled on Xcode 16.4.0: When compiled on Xcode 26: The code: import SwiftUI struct SearchBarController: UIViewRepresentable { @Binding var text: String var placeholderText: String class Coordinator: NSObject, UISearchBarDelegate { @Binding var text: String init(text: Binding<String>) { _text = text } func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) { text = searchText } } func makeUIView(context: Context) -> UISearchBar { let searchBar = UISearchBar(frame: .zero) searchBar.delegate = context.coordinator searchBar.placeholder = placeholderText searchBar.searchBarStyle = .minimal return searchBar } func updateUIView(_ uiView: UISearchBar, context: Context) { uiView.text = text } func makeCoordinator() -> SearchBarController.Coordinator { return Coordinator(text: $text) } }
2
0
53
1w
UIVisualEffectView using UIGlassEffect does not follow layer.cornerRadius values
Starting on iOS 26 Beta 3, any UIVisualEffectView using a UIGlassEffect will have a default corner radius that cannot be modified by using UIVisualEffectView's layer.cornerRadius. This was working on Beta 1 and Beta 2. On WWDC25 "Build a UIKit app with the new design", a UIVisualEffectView property called cornerConfiguration is used as example for changing the effect's corner radius, but this property does not seem to be available on any of the beta versions. Is there any other way to update the UIGlassEffect corner radius on UIKit?
Topic: UI Frameworks SubTopic: UIKit Tags:
2
1
112
1w
Liquid glass: UIPageViewController inside UITabbarController adding blur effect always in iOS26
When using UIPageViewController inside a UITabBarController on iOS 26 with Liquid Glass adoption, visiting the PageViewController tab applies a blur effect to the navigation bar and tab bar even though the current child view controller of the pageView is not scrollable and does not reach behind these bars. Questions: Is this the expected behavior that the pageview's internal scroll view causes the bars to blur regardless of the page view's child content’s scrollability? If so, is there an official way to make the blur effect appear only when the pageview's current child view controller actually scrolls behind the navigation bar or tab bar, and not in static cases? Tried the same in SwiftUI using TabView and TabView with page style. Facing the same issue there as well. Sample screenshots for reference, Sample SwiftUI code, struct TabContentView: View { var body: some View { TabView { // First Tab: Paging View PagingView() .tabItem { Label("Pages", systemImage: "square.fill.on.square.fill") } // Second Tab: Normal View NavigationStack { ListView() } .tabItem { Label("Second", systemImage: "star.fill") } // Third Tab: Normal View PageView(color: .blue, text: "Page 3") .tabItem { Label("Third", systemImage: "gearshape.fill") } } .ignoresSafeArea() } } struct PagingView: View { var body: some View { TabView { PageView(color: .red, text: "Page 1") PageView(color: .green, text: "Page 2") PageView(color: .blue, text: "Page 3") } .tabViewStyle(.page) // Enables swipe paging .indexViewStyle(.page(backgroundDisplayMode: .always)) .ignoresSafeArea()// Dots indicator } }
1
0
115
1w