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

A Summary of the WWDC25 Group Lab - UI Frameworks
At WWDC25 we launched a new type of Lab event for the developer community - Group Labs. A Group Lab is a panel Q&A designed for a large audience of developers. Group Labs are a unique opportunity for the community to submit questions directly to a panel of Apple engineers and designers. Here are the highlights from the WWDC25 Group Lab for UI Frameworks. How would you recommend developers start adopting the new design? Start by focusing on the foundational structural elements of your application, working from the "top down" or "bottom up" based on your application's hierarchy. These structural changes, like edge-to-edge content and updated navigation and controls, often require corresponding code modifications. As a first step, recompile your application with the new SDK to see what updates are automatically applied, especially if you've been using standard controls. Then, carefully analyze where the new design elements can be applied to your UI, paying particular attention to custom controls or UI that could benefit from a refresh. Address the large structural items first then focus on smaller details is recommended. Will we need to migrate our UI code to Swift and SwiftUI to adopt the new design? No, you will not need to migrate your UI code to Swift and SwiftUI to adopt the new design. The UI frameworks fully support the new design, allowing you to migrate your app with as little effort as possible, especially if you've been using standard controls. The goal is to make it easy to adopt the new design, regardless of your current UI framework, to achieve a cohesive look across the operating system. What was the reason for choosing Liquid Glass over frosted glass, as used in visionOS? The choice of Liquid Glass was driven by the desire to bring content to life. The see-through nature of Liquid Glass enhances this effect. The appearance of Liquid Glass adapts based on its size; larger glass elements look more frosted, which aligns with the design of visionOS, where everything feels larger and benefits from the frosted look. What are best practices for apps that use customized navigation bars? The new design emphasizes behavior and transitions as much as static appearance. Consider whether you truly need a custom navigation bar, or if the system-provided controls can meet your needs. Explore new APIs for subtitles and custom views in navigation bars, designed to support common use cases. If you still require a custom solution, ensure you're respecting safe areas using APIs like SwiftUI's safeAreaInset. When working with Liquid Glass, group related buttons in shared containers to maintain design consistency. Finally, mark glass containers as interactive. For branding, instead of coloring the navigation bar directly, consider incorporating branding colors into the content area behind the Liquid Glass controls. This creates a dynamic effect where the color is visible through the glass and moves with the content as the user scrolls. I want to know why new UI Framework APIs aren’t backward compatible, specifically in SwiftUI? It leads to code with lots of if-else statements. Existing APIs have been updated to work with the new design where possible, ensuring that apps using those APIs will adopt the new design and function on both older and newer operating systems. However, new APIs often depend on deep integration across the framework and graphics stack, making backward compatibility impractical. When using these new APIs, it's important to consider how they fit within the context of the latest OS. The use of if-else statements allows you to maintain compatibility with older systems while taking full advantage of the new APIs and design features on newer systems. If you are using new APIs, it likely means you are implementing something very specific to the new design language. Using conditional code allows you to intentionally create different code paths for the new design versus older operating systems. Prefer to use if #available where appropriate to intentionally adopt new design elements. Are there any Liquid Glass materials in iOS or macOS that are only available as part of dedicated components? Or are all those materials available through new UIKit and AppKit views? Yes, some variations of the Liquid Glass material are exclusively available through dedicated components like sliders, segmented controls, and tab bars. However, the "regular" and "clear" glass materials should satisfy most application requirements. If you encounter situations where these options are insufficient, please file feedback. If I were to create an app today, how should I design it to make it future proof using Liquid Glass? The best approach to future-proof your app is to utilize standard system controls and design your UI to align with the standard system look and feel. Using the framework-provided declarative API generally leads to easier adoption of future design changes, as you're expressing intent rather than specifying pixel-perfect visuals. Pay close attention to the design sessions offered this year, which cover the design motivation behind the Liquid Glass material and best practices for its use. Is it possible to implement your own sidebar on macOS without NSSplitViewController, but still provide the Liquid Glass appearance? While technically possible to create a custom sidebar that approximates the Liquid Glass appearance without using NSSplitViewController, it is not recommended. The system implementation of the sidebar involves significant unseen complexity, including interlayering with scroll edge effects and fullscreen behaviors. NSSplitViewController provides the necessary level of abstraction for the framework to handle these details correctly. Regarding the SceneDelagate and scene based life-cycle, I would like to confirm that AppDelegate is not going away. Also if the above is a correct understanding, is there any advice as to what should, and should not, be moved to the SceneDelegate? UIApplicationDelegate is not going away and still serves a purpose for application-level interactions with the system and managing scenes at a higher level. Move code related to your app's scene or UI into the UISceneDelegate. Remember that adopting scenes doesn't necessarily mean supporting multiple scenes; an app can be scene-based but still support only one scene. Refer to the tech note Migrating to the UIKit scene-based life cycle and the Make your UIKit app more flexible WWDC25 session for more information.
Topic: UI Frameworks SubTopic: General
0
0
660
Jun ’25
otential Optimization or Bug in UINavigationController Push Operation in iOS 18
Issue Description: In iOS 18, when setting the root view controller of a UINavigationController and immediately pushing another view controller, the root view controller's lifecycle methods, such as viewDidLoad(), are not called as expected. This issue does not occur in previous iOS versions. There is no mention of this behavior in the iOS 18 release notes, and it is causing significant issues in our application. Steps to Reproduce: Set the root view controller of a UINavigationController. Immediately push another view controller. Observe that the root view controller's lifecycle methods, such as viewDidLoad(), are not called. Example Code: Swift import UIKit class HomeViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() print("HomeViewController viewDidLoad") } } class SecondViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() print("SecondViewController viewDidLoad") } } @UIApplicationMain class AppDelegate: UIResponder, UIApplicationDelegate { var window: UIWindow? func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { window = UIWindow(frame: UIScreen.main.bounds) let home = HomeViewController() let rootNav = UINavigationController(rootViewController: home) window?.rootViewController = rootNav window?.makeKeyAndVisible() let secondViewController = SecondViewController() home.navigationController?.pushViewController(secondViewController, animated: true) return true } } Expected Behavior: The root view controller's lifecycle methods, such as viewDidLoad(), should be called when setting it as the root view controller of a UINavigationController. Actual Behavior: In iOS 18, the root view controller's lifecycle methods are not called when it is set as the root view controller and another view controller is immediately pushed. Impact: This issue affects the proper initialization and setup of the root view controller, causing significant disruptions in our application's workflow. Device Information: iOS Version: iOS 18 Test Devices: iPhone 15, iPhone 16 Additional Information: We would appreciate any insights or updates on whether this is an intended optimization or a potential bug. This issue is causing significant disruption to our application, and a timely resolution would be greatly appreciated.
3
0
467
Dec ’24
How to determine the default duration of a long-press
Using gesture recognizers it is easy to implement a long-press gesture to open a menu, show a preview or something else on the iOS platform. And you can provide the duration the user must hold down the finger until the gesture recognizer fires. But I could not yet find out how to determine the default duration for a long-press gesture that is configured in the system settings within the "accessibility" settings under "Haptic Touch" (the available options are fast, standard and slow here). Is it possible to read out this setting, so my App can adapt to this system setting as well?
1
0
356
Jan ’25
SwiftUI: How to create different background colors for List sections?
I'm trying to achieve a specific UI design in SwiftUI where the bottom section of my List has a different background color than the top section. For example in the Medications portion of the Health app, the "Your Medications" Section has a different background than the top "Log" Section. How do I achieve this?: Here some example code. I wonder if I am supposed to use two Lists instead. If I use two Lists though and nest it in a ScrollView, the height of the lists needs to be specified. I am working with dynamic content, though so I don't think that is ideal. class ProtocolMedication {} // Example model struct HomeView: View { @Query private var protocolMedications: [ProtocolMedication] var body: some View { NavigationStack { List { // Upper sections with default background Section { Text("Content 1") } header: { Text("Log") } // Bottom section that needs different background Section { ForEach(protocolMedications) { medication in Text(medication.name) } } header: { Text("Your Medications") } } .listStyle(.insetGrouped) } } }
1
0
691
Dec ’24
NavigationSplitView detail view not updating
I have a NavigationSplitView with all three columns, and NavigationLinks in the sidebar to present different Lists for the content column. When a list item is selected in the content view, I want to present a view in the detail view. Since different detail views should be presented for different content views, I represent state like this (some details omitted for space): // Which detail view to show in the third column enum DetailViewKind: Equatable { case blank case localEnv(RegistryEntry) case package(SearchResult) } // Which link in the sidebar was tapped enum SidebarMenuItem: Int, Hashable, CaseIterable { case home case localEnvs case remoteEnvs case packageSearch } // Binds to a DetailViewKind, defines the activate SidebarMenuItem struct SidebarView: View { @State private var selectedMenuItem: SidebarMenuItem? @Binding var selectedDetailView: DetailViewKind var body: some View { VStack(alignment: .leading, spacing: 32) { SidebarHeaderView() Divider() // Creates the navigationLinks with a SidebarMenuRowView as labels SidebarMenuView(selectedMenuItem: $selectedMenuItem, selectedDetailView: $selectedDetailView) Spacer() Divider() SidebarFooterView() } .padding() .frame(alignment: .leading) } } struct SidebarMenuRowView: View { var menuItem: SidebarMenuItem @Binding var selectedMenuItem: SidebarMenuItem? @Binding var selectedDetailView: DetailViewKind private var isSelected: Bool { return menuItem == selectedMenuItem } var body: some View { HStack { Image(systemName: menuItem.systemImageName).imageScale(.small) Text(menuItem.title) Spacer() } .padding(.leading) .frame(height: 24) .foregroundStyle(isSelected ? Color.primaryAccent : Color.primary) .background(isSelected ? Color.menuSelection : Color.clear) .clipShape(RoundedRectangle(cornerRadius: 10)) .navigationDestination(for: SidebarMenuItem.self) { item in navigationDestinationFor(menuItem: item, detailView: $selectedDetailView) } .onTapGesture { if menuItem != selectedMenuItem { selectedMenuItem = menuItem } } } } // Determines which detail view to present struct DetailView: View { @Binding var selectedDetailView: DetailViewKind var innerView: some View { switch selectedDetailView { case .blank: AnyView(Text("Make a selection") .font(.subheadline) .foregroundStyle(.secondary) .navigationSplitViewColumnWidth(min: 200, ideal: 350)) case .localEnv(let regEntry): AnyView(EnvironmentDetailView(regEntry: regEntry)) case .package(let searchResult): AnyView(PackageDetailView(searchResult: searchResult)) } } var body: some View { innerView } } struct ContentView: View { @State private var detailView: DetailViewKind = .blank var body: some View { NavigationSplitView { SidebarView(selectedDetailView: $detailView) .navigationSplitViewColumnWidth(175) } content: { HomeView() .navigationSplitViewColumnWidth(min: 300, ideal: 450) } detail: { DetailView(selectedDetailView: $detailView) } } } My issue is that the detail view is not updated when the ContentView's detailView property is updated. I've verified that the value itself is changing, but the view is not. I searched around to see why this would be (this is my first Swift/SwiftUI application) and from what I gather a @Binding alone will not cause a view to be updated, that binding either needs to be used in the view hierarchy, or it needs to be stored as a @State property that gets updated when the binding value changes. I added a dummy @State property to DetailView and that still doesn't work, so I'm a little confused: struct DetailView: View { @Binding var selectedDetailView: DetailViewKind @State private var dummyProp: DetailViewKind? var innerView: some View { switch selectedDetailView { case .blank: AnyView(Text("Make a selection") .font(.subheadline) .foregroundStyle(.secondary) .navigationSplitViewColumnWidth(min: 200, ideal: 350)) case .localEnv(let regEntry): AnyView(EnvironmentDetailView(regEntry: regEntry)) case .package(let searchResult): AnyView(PackageDetailView(searchResult: searchResult)) } } var body: some View { innerView.onChange(of: selectedDetailView) { dummyProp = selectedDetailView } } } Any ideas?
Topic: UI Frameworks SubTopic: SwiftUI
1
0
443
Jan ’25
sourceImageURL in imagePlaygroundSheet isn't optional
I can't shake the "I don't think I did this correctly" feeling about a change I'm making for Image Playground support. When you create an image via an Image Playground sheet it returns a URL pointing to where the image is temporarily stored. Just like the Image Playground app I want the user to be able to decide to edit that image more. The Image Playground sheet lets you pass in a source URL for an image to start with, which is perfect because I could pass in the URL of that temp image. But the URL is NOT optional. So what do I populate it with when the user is starting from scratch? A friendly AI told me to use URL(string: "")! but that crashes when it gets forced unwrapped. URL(string: "about:blank")! seems to work in that it is ignored (and doesn't crash) when I have the user create the initial image (that shouldn't have a source image). This feels super clunky to me. Am I overlooking something?
1
0
448
Jan ’25
How can I integrate my own text changes into UITextView's undo manager?
I have an app that uses UITextView for some text editing. I have some custom operations I can do on the text that I want to be able to undo, and I'm representing those operations in a way that plugs into NSUndoManager nicely. For example, if I have a button that appends an emoji to the text, it looks something like this: func addEmoji() { let inserting = NSAttributedString(string: "😀") self.textStorage.append(inserting) let len = inserting.length let range = NSRange(location: self.textStorage.length - len, length: len) self.undoManager?.registerUndo(withTarget: self, handler: { view in view.textStorage.deleteCharacters(in: range) } } My goal is something like this: Type some text Press the emoji button to add the emoji Trigger undo (via gesture or keyboard shortcut) and the emoji is removed Trigger undo again and the typing from step 1 is reversed If I just type and then trigger undo, the typing is reversed as you'd expect. And if I just add the emoji and trigger undo, the emoji is removed. But if I do the sequence above, step 3 works but step 4 doesn't. The emoji is removed but the typing isn't reversed. Notably, if step 3 only changes attributes of the text, like applying a strikethrough to a selection, then the full undo chain works. I can type, apply strikethrough, undo strikethrough, and undo typing. It's almost as if changing the text invalidates the undo manager's previous operations? How do I insert my own changes into UITextView's NSUndoManager without invalidating its chain of other operations?
4
0
1.7k
Dec ’24
UIDocumentPickerViewController
I'm upgrading my app from minVersion iOS 11 to iOS 12. My compiler says that UIDocumentMenuViewController with UIDocumentPickerViewController is deprecated, they recommend to use directly the last one. So I change the code. fileprivate func openDocumentPicker() { let documentPicker = UIDocumentPickerViewController( documentTypes: [ "com.adobe.pdf", "org.openxmlformats.wordprocessingml.document", // DOCX "com.microsoft.word.doc" // DOC ], in: .import ) documentPicker.delegate = self view.window?.rootViewController?.present(documentPicker, animated: true, completion: nil) } When I open the picker in iOS 17.2 simulator and under it is well shown, like a page sheet. But in iOS 18.0 and up at first it opens like a page sheet with no content but then it is displayed as a transparent window with no content. Is there any issue with this component and iOS 18? If I open the picker through UIDocumentMenuViewControllerDelegate in an iphone with iOS 18.2 it is well shown. Image in iOS 18.2 with the snippet The same snippet in iOS 17.2 (and expected in older ones)
Topic: UI Frameworks SubTopic: UIKit Tags:
0
0
348
Jan ’25
FirstResponderView/FirstResponderIndexPath in TableView
I found when I put a webView on the screen and then remove it, several properties in TableView including firstResponderView, FirstResponderIndexPath, and FirstResponderViewType have changed. These properties are hidden and I cannot change them. firstResponderView strong holds my cell, resulting in my cell not being able to call didEndDisplayCell when it slides out of the screen as expected. What should I do to avoid firstResponderView from strong holding my cell, or what should I do to release it?
1
0
392
Dec ’24
Keyboard will not show when setting focus on a SwiftUI text field from a button in an ornament on visionOS
Using a button that is placed in the bottom ornament to set focus on a text field will not display the keyboard properly while a button embedded in the view will behave as expected. To demonstrate the issue, simply run the attached project on Vision Pro with visionOS 1.1 and tap the Toggle 2 button in the bottom ornament. You’ll see that the field does have focus but the keyboard is now visible. Run the same test with Toggle 1 and the field will get focus and the keyboard will show as expected. import SwiftUI import RealityKit import RealityKitContent struct ContentView: View { @State private var text = "" @State private var showKeyboard = false @FocusState private var focusedField: FocusField? private enum FocusField: Hashable { case username case password } var body: some View { VStack { TextField("Test", text: $text) .focused($focusedField, equals: .username) Text("Entered Text: \(text)") .padding() Button("Toggle 1") { // This button will work and show the keyboard if focusedField != nil { focusedField = nil } else { focusedField = .username } } Spacer() } .padding() .toolbar { ToolbarItem(placement: .bottomOrnament) { Button("Toggle 2") { // This button will set focus properly but not show the keyboard if focusedField != nil { focusedField = nil } else { focusedField = .username } } } } } } Is there a way to work around this? FB13641609
1
0
757
Jan ’25
Bug in iOS 18 with NSTimeZone and DatePicker
iOS 18 broke some functionality in my Objective-C app with regard to using the DatePicker. The key lines are as follows: datePicker.timeZone = [NSTimeZone timeZoneForSecondsFromGMT:timezoneOffset]; datePicker.date = [NSDate date]; When timezoneOffset is -29380, the value for San Francisco, the Date Picker is a whole MONTH off. It shows November instead of December. But when it is -29359, the value for Seattle, which is in the same time zone (PST), it shows the correct month. In fact, even towns surrounding San Francisco usually return the correct value. Some other cities in other time zones also cause the Date Picker to be a month off.
7
0
761
Jan ’25
iOS18 UIPinchGestureRecognizer finger change
Before ios18, when two fingers are switched to single fingers, the printing scale value will not change. When switching to two fingers again, the pinch and zoom printing scale will change. The same operation is performed after ios18, and two fingers are switched to single fingers. Switch back to two fingers, and the scale printing will not change. code here: - (void)pinchGesture:(UIPinchGestureRecognizer *)recognizer { NSSet <UIEvent*> *events = [recognizer valueForKey:@"_activeEvents"]; UIEvent *event = [events anyObject]; if (recognizer.state == UIGestureRecognizerStateBegan) { NSLog(@"---- begin finger count: %d scale: %f",event.allTouches.count,recognizer.scale); recognizer.scale = 1.0; } else if (recognizer.state == UIGestureRecognizerStateChanged) { NSLog(@"---- change finger count: %d scale: %f",event.allTouches.count,recognizer.scale); // recognizer.scale = 1.0; } log image for iOS 17.7 log image for ios18.0.2
Topic: UI Frameworks SubTopic: UIKit Tags:
0
0
290
Jan ’25
CallKit
I am working on Agora Voice Call and using CallKit to manage incoming and outgoing calls. Issue: When I accept a call, CallKit goes behind my app. I want CallKit to remain in front of my app. Please guide me.
0
0
304
Dec ’24
https://forums.developer.apple.com/forums/post/question
Hi everyone, I’m working on an iOS app using both UITableViewDiffableDataSource and SwiftUI, and I’m facing two separate but puzzling issues: UITableViewDiffableDataSource Not Reusing Cells on first applying after initial Snapshot. After applying first time it is working as expected from second time. SwiftUI View’s inside UITableViewCell onDisappear Not Triggering the on first changes of snapshot after initial snapshot. With normal UITableView it is working fine. Issue causing - it is causing player &amp; cells to retain memory extensively Sample gist code for reproducing with diffable (DiffableTableViewExampleViewController) and working fine without diffable (RegularTableViewExampleViewController) https://gist.github.com/SURYAKANTSHARMA/d83fa9e7e0de309e27485100ba5aed17 Any insights or suggestions for these issues would be greatly appreciated! Thanks in advance!
0
0
224
Jan ’25
How to Maintain Background Color Consistency During ZoomTransitions in SwiftUI?
I’m currently working on a SwiftUI project and trying to implement a transition effect similar to ZoomTransitions. However, I’ve run into an issue. When transitioning from Page A to Page B using .navigationTransition(.zoom(sourceID: "world", in: animation)), Page A shrinks as expected, but its background color changes to the default white instead of the color I preset. I want the background color of Page A to remain consistent with my preset during the entire transition process. Here’s a simplified version of my code: Page A PartnerCard() .matchedTransitionSource(id: item.id, in: animation) Page B ``.navigationTransition(.zoom(sourceID: "world", in: animation))
Topic: UI Frameworks SubTopic: SwiftUI
0
0
280
Jan ’25
what it that func in CoreText ?
I can use CGContextShowText to display character. and what I should use in CoreText? I find there is NSAttributedString but there is lack of setShouldAntialias and setAllowsAntialiasing(Bool) in NSAttributedString I DO NOT want to use Antialiase which means I want to set Antialiase to FALSE when I display characters
1
0
333
Dec ’24
Identifying SwiftUI list cells in XCUITest
In my macOS app I have a SwiftUI list that starts like this: List(selection: $selection) { HStack { Label("Staging", systemImage: "arrow.up.square") Spacer() WorkspaceStatusBadge(unstagedCount: model.statusCounts.unstaged, stagedCount: model.statusCounts.staged) } (where WorkspaceStatusBadge is a custom view that just contains a Text) I'm trying to set the accessibility ID of that first cell so I can find it in XCUITest. If I apply the accessibilityIdentifier() modifier to the HStack, it instead sets the ID of the two static text elements inside it, and the cell still has no ID. I could find the cell based on the ID of the child staticText, but I have some other cases where this doesn't work as well. If I use .accessibilityElement() on the HStack, then XCUI sees a cell containing a Group element with the ID. This might be workable, but it's certainly not ideal. So how do I set the ID of the cell itself?
3
0
469
Jan ’25
Custom app icon on macOS
I would like to provide a way to choose an app icon as a reward for using the referral feature of the app. I found that setting the image via NSApp.applicationIconImage works, but only when the app is running, and the app icon is reset on the next launch. I also found NSDockTile plugin APIs, and that seems to be the way, but it won't be allowed on the Mac App Store. Is there really no way to do it legit way and pass the Mac App Store review? Seems to be another really strange limitation imposed.
Topic: UI Frameworks SubTopic: AppKit Tags:
1
0
360
Feb ’25
searchable issue on iOS 18
Starting with iOS 18, the behavior of searchable and searchSuggestions differs from previous versions. In iOS 17.5, searchSuggestions remained visible even after selecting an item and navigating away. However, in iOS 18, searchSuggestions are dismissed after navigation. Is there a way to keep searchSuggestions visible after navigation, as in iOS 17.5? struct ContentView: View { @State private var query = "" var body: some View { NavigationStack { Color.red .searchable(text: $query) .searchSuggestions { NavigationLink("Element") { Color.blue } } } } } iOS 18.1 iOS 17.5
2
0
443
Jan ’25