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
615
Jun ’25
SwiftUI: Picker text color not changing until reloading view
My picker looks like this: Picker("Color", selection: $backgroundColor.animation(), content: { ForEach(TransactionCategory.Colors.allCases, id: \.self) { color in Text(color.rawValue) .tag(color) .foregroundStyle(color.getColor()) } }) This changes a tint color which is applied to the entire tabview. I can see that it's working because the buttons in the top tab bar are changing color as I change the picker value. However, the color of the text inside the picker is not changing until I go back one view and then come back to this view. I tried setting an ID on the picker and then updating it when the picker value changes, but that didn't work. Any ideas?
0
2
511
Dec ’24
Keep ScrollView position when adding items on the top using onAppear / onScrollTargeVisibilityChange
Related Post: Keep ScrollView position when adding items on the top I was trying to implement a message view using ScrollView + LazyVStack. This view requires pagination so I used onScrollTargeVisibilityChange modifier to detect if the first item appears on screen and a new page needs to be loaded. I learnt from the above post that scrollPositon modifier can help keep the scroll position. I tested the method mentioned in that post -- use a button to add new items to the top -- and it worked. However, when use onScrollTargeVisibilityChange modifier to add items, the view automatically scrolls to the top and cause the following loop: first item in the list appears on screen --> load and insert more items to the top --> scroll view scrolls to top --> first item appears --> load more data --> scroll to top --> first item ... --> more data... --> top ... Until it generates the error ScrollTargetVisibilityChange tried to update multiple times per frame. Here is the simplified code. struct Item: Identifiable { var id: UUID = .init() var content: String } struct ScrollViewTest: View { @State private var items: [Item] = (0...30).map {Item(content:"\($0)")}.reversed() @State private var itemID: Item.ID? @State private var page: Int = 0 var body: some View { ScrollView { LazyVStack { ForEach(items) {item in Text(item.content) .frame(height: 30) } } .scrollTargetLayout() } .scrollPosition(id: $itemID) .defaultScrollAnchor(.bottom) .onScrollTargetVisibilityChange(idType: Item.ID.self) { onScreenItemIDs in if onScreenItemIDs.first == items.first?.id { page += 1 let newItems = (page*30+1 ... (page+1)*30).map {Item(content:"\($0)")} items.insert(contentsOf: newItems.reversed(), at: 0) } } .toolbar { Button("Add") { page += 1 let newItems = (page*30+1 ... (page+1)*30).map {Item(content:"\($0)")} items.insert(contentsOf: newItems.reversed(), at: 0) } } } } I want to load data while scrolling without the need of pressing any buttons. How can I solve this problem?
0
1
279
Dec ’24
What's the best way to support Genmoji with SwiftUI?
I want to support Genmoji input in my SwiftUI TextField or TextEditor, but looking around, it seems there's no SwiftUI only way to do it? If none, it's kind of disappointing that they're saying SwiftUI is the path forward, but not updating it with support for new technologies. Going back, does this mean we can only support Genmoji through UITextField and UIViewRepresentable? or there more direct options? Btw, I'm also using SwiftData for storage.
0
1
612
Nov ’24
Why is ScrollView / LazyVStack retaining Views which causes memory leaks in the end?
Recently I noticed how my ViewModels aren't deallocating and they end up as a memory leaks. I found something similar in this thread but this is also happening without using @Observation. Check the source code below: class CellViewModel: Identifiable { let id = UUID() var color: Color = Color.red init() { print("init") } deinit { print("deinit") } } struct CellView: View { let viewModel: CellViewModel var body: some View { ZStack { Color(viewModel.color) Text(viewModel.id.uuidString) } } } @main struct LeakApp: App { @State var list = [CellViewModel]() var body: some Scene { WindowGroup { Button("Add") { list.append(CellViewModel()) } Button("Remove") { list = list.dropLast() } ScrollView { LazyVStack { ForEach(list) { model in CellView(viewModel: model) } } } } } } When I tap the Add button twice in the console I will see "init" message twice. So far so good. But then I click the Remove button twice and I don't see any "deinit" messages. I used the Debug Memory Graph in Xcode and it showed me that two CellViewModel objects are in the memory and they are owned by the CellView and some other objects that I don't know where are they coming from (I assume from SwiftUI internally). I tried using VStack instead of LazyVStack and that did worked a bit better but still not 100% "deinits" were in the Console. I tried using weak var struct CellView: View { weak var viewModel: CellViewModel? .... } but this also helped only partially. The only way to fully fix this is to have a separate class that holds the list of items and to use weak var viewModel: CellViewModel?. Something like this: class CellViewModel: Identifiable { let id = UUID() var color: Color = Color.red init() { print("init") } deinit { print("deinit") } } struct CellView: View { var viewModel: CellViewModel? var body: some View { ZStack { if let viewModel = viewModel { Color(viewModel.color) Text(viewModel.id.uuidString) } } } } @Observable class ListViewModel { var list = [CellViewModel]() func insert() { list.append(CellViewModel()) } func drop() { list = list.dropLast() } } @main struct LeakApp: App { @State var viewModel = ListViewModel() var body: some Scene { WindowGroup { Button("Add") { viewModel.insert() } Button("Remove") { viewModel.drop() } ScrollView { LazyVStack { ForEach(viewModel.list) { model in CellView(viewModel: model) } } } } } } But this won't work if I want to use @Bindable such as @Bindable var viewModel: CellViewModel? I don't understand why SwiftUI doesn't want to release the objects?
0
1
497
Dec ’24
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
285
Dec ’24
OSLog Logger & SwiftUI
Hi, Are there any macros that can be used with Logger to automatically capture the SwiftUI function that the message originates from? Currently, I am using something similar to: Logger.misc.error("In \(#fileID), \(#function): \(error)") Currently, the #function only tells me that it originates in body... Ideally, I'd like to be able to tell if it was with an onAppear, onChange, Button, alert, etc... I realize I can manually enter this, but was wondering if there was a more automated way to capture this info. Thx,
Topic: UI Frameworks SubTopic: SwiftUI
0
0
241
Dec ’24
icloud password reset UI does not show buttons.
As can be seen in the screenshot attached, I can not see the options in this window. A prompt window before this also did not show any buttons in the visible space. However, I made a guess and could get to this window by clicking on what I think was "Ok" or something similar. But on this I could not do any action and had to force quit the app.
Topic: UI Frameworks SubTopic: General Tags:
0
0
258
Dec ’24
Detect when a tvOS top shelf tile/slide transition occurs?
Our tvOS app makes use of top shelf Carousel style slides to promote our content. We would like to detect when tvOS transitions between individual top shelf slides, regardless of whether the slide transition is made by a user (via the Siri remote), or by the system idle auto-transition. Has anyone achieved this, maybe there are undocumented system hooks or events we can listen to?
0
0
467
Nov ’24
widgetextension Get availableInputs
I want to get the availableInputs list in widgetextension, but it always returns only the phone's microphone. I have confirmed that I have connected additional Bluetooth devices. Why is this? If I want to get the information I want, how should I do it?
Topic: UI Frameworks SubTopic: SwiftUI
0
0
163
Dec ’24
On a navigation bar created by a DocumentGroup, items disappear after renaming the file from the automatic Rename button in the Title Menu
On an iPad or iPhone running iPadOS / iOS 18.2 (built with Xcode 16.2), run the WritingApp sample code from https://developer.apple.com/documentation/SwiftUI/Building-a-document-based-app-with-SwiftUI from WWDC24 Then add the following struct to the project: struct NavigationBarToolbar: ToolbarContent { var body: some ToolbarContent { ToolbarItem(placement: .secondaryAction) { Button("Button 1", systemImage: "1.circle") { } } ToolbarItem(placement: .secondaryAction) { Button("Button 2", systemImage: "2.circle") { } } ToolbarItem(placement: .secondaryAction) { Button("Button 3", systemImage: "3.circle") { } } ToolbarItem(placement: .secondaryAction) { Button("Button 4", systemImage: "4.circle") { } } ToolbarItem(placement: .secondaryAction) { Button("Button 5", systemImage: "5.circle") { } } } } Comment out the original toolbar in the sample project and replace with: .toolbar(content: NavigationBarToolbar.init) Run the project and open or create a document Click on the TitleMenu and choose Rename, in order to rename the file Type in a new name and press Enter. Notice how the items of the toolbar disappear —— This issue has been submitted as feedback with number FB16100225 This issue is linked to the following feedbacks: FB14855728 FB14855668 FB14849205 FB12343963 FB15164292
0
1
282
Dec ’24
Diffable Data Source Warning: Non-Thread Confined Updates
Hello, I’ve encountered a warning while working with UITableViewDiffableDataSource. Here’s the exact message: Warning: applying updates in a non-thread confined manner is dangerous and can lead to deadlocks. Please always submit updates either always on the main queue or always off the main queue - view=<UITableView: 0x7fd79192e200; frame = (0 0; 375 667); clipsToBounds = YES; autoresize = W+H; gestureRecognizers = <NSArray: 0x600003f3c9f0>; backgroundColor = <UIDynamicProviderColor: 0x60000319bf80; provider = <NSMallocBlock: 0x600003f0ce70>>; layer = <CALayer: 0x6000036e8fa0>; contentOffset: {0, -116}; contentSize: {375, 20}; adjustedContentInset: {116, 0, 49, 0}; dataSource: <TtGC5UIKit29UITableViewDiffableDataSourceOC17ArticleManagement21DiscardItemsViewModel17SectionIdentifierSS: 0x600003228270>> OS: iOS Version: iOS 17+, Xcode Version: 16.0, Frameworks: UIKit, Diffable Data Source, View: UITableView used with a UITableViewDiffableDataSource. Steps to Reproduce: Using a diffable data source with a table view. Applying snapshot updates in the data source from a main thread. Warning occurs intermittently during snapshot application. Expected Behavior: The snapshot should apply without warnings, provided the updates are on a main thread. Actual Behavior: The warning suggests thread safety issues when applying updates on non-thread-confined queues. Questions: Is there a recommended best practice to handle apply calls in diffable data sources with thread safety in mind? Could this lead to potential deadlocks if not addressed? Note :- I confirm I am always reloading / reconfiguring data source on main thread. Please find the attached screenshots for the reference. Any guidance or clarification would be greatly appreciated!
0
0
599
Dec ’24
Data fetching issue from SensorKit
I want SensorKit data for research purposes in my current application. I have applied for and received permission from Apple to access SensorKit data. During implementation, I encountered an issue in which no data was being retrieved despite granting all the necessary permissions. I am using did CompleteFetch & didFetchResult delegate methods for retrieving data from Sensorkit. CompleteFetch method calls but where I can find different event data like Device usage, Ambient Light, etc? & didFetchResult method does not call. Methods I am using: 1. func sensorReader(_ reader: SRSensorReader, didCompleteFetch fetchRequest: SRFetchRequest) 2. func sensorReader(_ reader: SRSensorReader, fetching fetchRequest: SRFetchRequest, didFetchResult result: SRFetchResult<AnyObject>) -> Bool Could anyone please assist me in resolving this issue? Any guidance or troubleshooting steps would be greatly appreciated.
0
0
332
Feb ’25
UIPasteboard
To store the data, I used the following api: (nullable UIPasteboard *)pasteboardWithName:(UIPasteboardName)pasteboardName create:(BOOL)create The official document says that starting from iOS10, clipboard data does not support persistence, but from the test practice, I use this clipboard to save the data always exists, no matter uninstall and reinstall the APP, restart the phone, or even update the system, then what scenarios may lead to the clipboard data is deleted, using this scheme to store data is reliable?
Topic: UI Frameworks SubTopic: UIKit Tags:
0
0
204
Dec ’24
Conflict between offerCodeRedemption and Camera
Hello, I implemented offerCodeRedemption recently on my app in my subscription/onboarding flow. When I did, it broke my camera functionality (elsewhere in the app; totally unrelated code). I was able to fix the issue when implementing the old "AppStore.presentOfferCodeRedeemSheet" code with UIKit. I'm not sure why this is happening, but it seemed like a bug to me.
Topic: UI Frameworks SubTopic: SwiftUI
0
0
133
Feb ’25
Opening recent files from Dock with MacCatalyst app
We are developing an MacOS app from our iOS app using MacCatalyst. If I press long on the app icon on the Dock, a list of recent files appears. If I tap one one of these files nothing happens. I would expect the scene delegate function: func scene(_ scene: UIScene, openURLContexts URLContexts: Set<UIOpenURLContext>) would be called but it is not. Can somebody maybe explain what I am missing here? The list of recent files also appears in the Menu under File > Open recent files. There I can tap on a file and it it is opened correctly using the scene delegate method mentioned above. The files can also be opened with the app using the Finder, so the associated file types with the app are correct.
0
0
291
Jan ’25
Potential Issue in "Display Distinct Layouts Per Section" Documentation Example
Hi everyone, I was exploring the Display Distinct Layouts Per Section section of the Apple documentation and noticed a potential issue in the example code provided. Specifically, in the createLayout method of the TwoColumnViewController in the sample project, the item size appears to be incorrectly described. The documentation states that the item size is ignored because the items are organized in columns, but in practice, the size is considered. When running the sample project without any modifications, the layout doesn't behave as described or expected. Here’s what I observed: The items are not displayed as intended in a two-column layout. Modifying the item size explicitly affects the layout, contrary to the documentation's claim that the size is ignored. This seems to be a mismatch between the documentation and the actual implementation. Could this be clarified or corrected? Has anyone else encountered this issue? If so, are there any recommended adjustments to the sample code to achieve the intended layout? Thanks in advance for any insights or updates on this! https://developer.apple.com/documentation/uikit/views_and_controls/collection_views/implementing_modern_collection_views#4461906
Topic: UI Frameworks SubTopic: UIKit
0
2
260
Nov ’24
How to Visualize Data in a DataFrame Using Charts
I want to visualize the data stored in a DataFrame using various charts (barmark, sectormark, linemark, etc.). My questions are as follows: Can a DataFrame be used directly within a chart? If so, could you provide a simple example? If it cannot be used directly, what is the correct way to use it? Could you provide an example? Thank you for your help. Best regards.
0
1
371
Jan ’25