Thanks for being a part of WWDC25!

How did we do? We’d love to know your thoughts on this year’s conference. Take the survey here

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

Some sharing extensions disabled when running iOS app with Mac Catalyst
When I run my iOS app on a Mac using Mac Catalyst, several sharing options that show up on an iOS device in a share sheet are absent on the Mac. Clicking on Edit Extensions, I see Mail, Message and AirDrop, their switches are on and disabled. All three items show up when I share from Safari or Notes. How can I make Mail, Message and AirDrop available? For example, when sharing data, no share extensions are shown. For text, only Simulator, Shortcuts and Copy are shown.
0
0
30
5d
Draw SwiftUI.Form style pop-up button with NSPopUpButton in AppKit
In SwiftUI on macOS, A menu-style Picker is drawn as a pop-up button. It generally looks and behaves the same as an NSPopUpButton in AppKit. SwiftUI introduced iOS-like looking UI for settings in macOS, and consequently, the Picker also has its own style when placed inside a Form. A Form-style Picker displays only up/down chevrons and draws the background only when the mouse hovers over it. It also changes its width dynamically based on the selected item. Form { Picker("Animal:", selection: $selection) { ForEach(["Dog", "Cow"], id: \.self) { Text($0) } .pickerStyle(.menu) } You can find it, for instance, in the Print dialog. My question is: I couldn't find a way to draw an NSPopUpButton in AppKit with this style. Does anyone know how to achieve this in AppKit? Some might say I should just use SwiftUI straightforwardly, but I would like to use it in a print panel accessory that currently still avoids using SwiftUI but its dialog has SwiftUI.Form-looking.
0
0
32
5d
Dynamically resizing NSPreferencePane content
Is it not possible to dynamically change or constrain an NSPreferencePane's mainView size? I have looked all over and this doesn't seem to be mentioned anywhere. The most I can seemingly do is set the frame and hope the user doesn't resize the window. class scor: NSPreferencePane { override func mainViewDidLoad() { mainView = NSHostingView(rootView: ContentView()) mainView.frame = NSMakeRect(0, 0, 668, 1048) } } Here is a screenshot, just with a simple webview as a test, note the scrollbar: My storyboard is just from the default prefpane Xcode template, nothing special. I looked at the header file for NSPreferencePane and came up with nothing. All I can think of is that this is impossible due to the way they are implemented? The only thing we seemingly have access to is mainView, so I can't like constrain the size of mainView to its parent, for example. Additionally, if I make a new preference pane, and make a button or other view that I choose to resize to fill horizontally and vertically, it does that, but not really? Here is what that looks like: The behaviour is similar to the previous preference pane, the width does adapt correctly, the height stays the same, forever. Not that it really matters but I am using macOS 14.7.6 on an M2 air
0
0
31
5d
Search field as in Mail App
How can i achieve the same behavior as the bottom bar on the Mail app? Button -> Search Field -> Button right now, if do as follows, they overlap as if they are not in the same space NavigationStack { VStack { HeaderView() ListView() } } .toolbar(.hidden, for: .tabBar) .searchable(text: $searchText) .searchToolbarBehavior(.minimize) .toolbar { ToolbarItem(placement: .bottomBar) { Button { } label: { Label("Button1", systemImage: "person") } } ToolbarItem(placement: .bottomBar) { Button { } label: { Label("Button2", systemImage: "person") } } }
1
0
61
5d
SwiftUI @State var not sync in .popover
struct ContentView: View { @State var visable: Bool = false @State var visableHiddenMenu: Bool = false var body: some View { VStack { Button("xxxx") { visableHiddenMenu = true print("visableHiddenMenu \(visableHiddenMenu)") visable.toggle() } .popover(isPresented: $visable) { VStack { let _ = print("visableHiddenMenu2 \(visableHiddenMenu)") Text("xxxx") } .onAppear { print("appear \(visableHiddenMenu)") visableHiddenMenu = visableHiddenMenu } } } .padding() } } the print is visableHiddenMenu true visableHiddenMenu2 false appear true so why visableHiddenMenu2 print false?
4
0
62
5d
Displaying an editing hierarchy in macOS
The SwiftUI Navigation structures work in ways that are not intuitive to me. For example, I am trying to display a set of data that represents rankings contained in a balloting system that I have created. The ballots all have candidates that are ranked from highest preference to lowest. Normally, I try to work backwards in SwiftUI, so I built the ballot editor to take a binding to the ballot itself: struct BallotEditor: View { @Binding var ballot: Election.Ballot var maxRank: Int var body: some View { VStack { ForEach($ballot.rankings) { $ranking in CandidateRankingPicker(maxRanking: maxRank, ranking: $ranking) } } } } This is embedded into a view with a list of ballots: struct BallotsView: View { @Binding var document: ElectionDocument var body: some View { List($document.ballots) { $ballot in NavigationLink { BallotEditor(ballot: $ballot, maxRank: document.election.candidates.count) .padding() } label: { BallotListElementView(ballot: ballot) } } } } This portion works in the editor. When the ballot is selected, the editor populates the selected candidate choices, and the editing works. However, when I attempt to insert BallotsView into a TabView, the NavigationLink stops working as expected. I didn't think NavigationLink was the proper way to do this, but it had been working. TabView { Tab("Ballots", systemImage: "menucard") { BallotsView(document: $document) } Tab { CandidateView() } label: { Text("Candidates") } .tabViewStyle(.sidebarAdaptable) } This is my third iteration. I have tried using a List with selection, but in that case, I am unable to pass the binding to the detail view. I just don't understand how this works, and I am preparing a version in Cocoa so that I don't have to deal with it anymore.
1
0
38
5d
Xcode 26 - New Swift 6.2 Concurrency Sendable Closure Problems
I'm running into a seemingly unsolvable compile problem with the new Xcode 26 and Swift 6.2. Here's the issue. I've got this code that was working before: NSAnimationContext.runAnimationGroup({(context) -> Void in context.duration = animated ? 0.5 : 0 clipView.animator().setBoundsOrigin(p) }, completionHandler: { self.endIgnoreFrameChangeEvents() }) It's very simple. The clipView is a scrollView.contentView, and "animated" is a bool, and p is an NSPoint It captures those things, scrolls the clip view (animating if needed) to the point, and then calls a method in self to signal that the animation has completed. I'm getting this error: Call to main actor-isolated instance method 'endIgnoreFrameChangeEvents()' in a synchronous nonisolated context So, I don't understand why so many of my callbacks are getting this error now, when they worked before, but it is easy to solve. There's also an async variation of runAnimationGroup. So let's use that instead: Task { await NSAnimationContext.runAnimationGroup({(context) -> Void in context.duration = animated ? 0.5 : 0 clipView.animator().setBoundsOrigin(p) }) self.endIgnoreFrameChangeEvents() } So, when I do this, then I get a new error. Now it doesn't like the first enclosure. Which it was perfectly happy with before. Here's the error: Sending value of non-Sendable type '(NSAnimationContext) -> Void' risks causing data races Here are the various overloaded definitions of runAnimationGroup: open class func runAnimationGroup(_ changes: (NSAnimationContext) -> Void, completionHandler: (@Sendable () -> Void)? = nil) @available(macOS 10.7, *) open class func runAnimationGroup(_ changes: (NSAnimationContext) -> Void) async @available(macOS 10.12, *) open class func runAnimationGroup(_ changes: (NSAnimationContext) -> Void) The middle one is the one that I'm trying to use. The closure in this overload isn't marked sendable. But, lets try making it sendable now to appease the compiler, since that seems to be what the error is asking for: Task { await NSAnimationContext.runAnimationGroup({ @Sendable (context) -> Void in context.duration = animated ? 0.5 : 0 clipView.animator().setBoundsOrigin(p) }) self.endIgnoreFrameChangeEvents() } So now I get errors in the closure itself. There are 2 errors, only one of which is easy to get rid of. Call to main actor-isolated instance method 'animator()' in a synchronous nonisolated context Call to main actor-isolated instance method 'setBoundsOrigin' in a synchronous nonisolated context So I can get rid of that first error by capturing clipView.animator() outside of the closure and capturing the animator. But the second error, calling setBoundsOrigin(p) - I can't move that outside of the closure, because that is the thing I am animating! Further, any property you're going to me animating in runAnimationGroup is going to be isolated to the main actor. So now my code looks like this, and I'm stuck with this last error I can't eliminate: let animator = clipView.animator() Task { await NSAnimationContext.runAnimationGroup({ @Sendable (context) -> Void in context.duration = animated ? 0.5 : 0 animator.setBoundsOrigin(p) }) self.endIgnoreFrameChangeEvents() } Call to main actor-isolated instance method 'setBoundsOrigin' in a synchronous nonisolated context There's something that I am not understanding here that has changed about how it is treating closures. This whole thing is running synchronously on the main thread anyway, isn't it? It's being called from a MainActor context in one of my NSViews. I would expect the closure in runAnimationGroup would need to be isolated to the main actor, anyway, since any animatable property is going to be marked MainActor. How do I accomplish what I am trying to do here? One last note: There were some new settings introduced at WWDC that supposedly make this stuff simpler - "Approchable Concurrency". In this example, I didn't have that turned on. Turning it on and setting the default to MainActor does not seem to have solved this problem. (All it does is cause hundreds of new concurrency errors in other parts of my code that weren't there before!) This is the last new error in my code (without those settings), but I can't see any way around this one. It's basically the same error as the others I was getting (in the callback closures), except with those I could eliminate the closures by changing APIs.
5
0
119
5d
WKWebView touch event listener misdirect in iOS 18.5
Hello, after the IOS update 18.5, all elements with an touch-event listener inside a wkWebview seem to offset a touch-events origin x and y location by a factor of 0.666. Triggering any other element with an touch-event listener at that location instead. If there is not on an element with an touch-event listener at the offset location, nothing happens. Only if the offset origin is coincidentally still inside the actually touched element, the touch-event gets dispatched correctly. This effects only the event listener: "touchstart", "touchmove" and "touchend". click-event listeners still work, and trigger on the correct element. Confusing are the contents of the touch-events being dispatched. The attributes "pageX" and "pageY" report the correct position touched, yet "target" gives the (wrong) Element at the offset location. The offset location can be found in "targetTouches[0].pageX" and "targetTouches[0].pageY". The offset factor can be influenced by the "width" value of this header tag: "". If the width value is 240 the factor changes to 1.333, and the value 320 actually fixes this offset completely. Device: Iphone XS with IOS 18.5 <html> <head> <meta content="text/html; charset=UTF-8" http-equiv="content-type"/> <!--<meta name="viewport" content="width=240, user-scalable=no"/>--> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="apple-mobile-web-app-status-bar-style" content="black"/> <meta name="format-detection" content="telephone=no"/> <link rel="apple-touch-icon" href="applogo"/> </head> <body> <style> div{ height:70px; width: 100%; margin-top: 7px; background-color: #f7f7f7; } </style> <div id="Feedback" style="background-color:white;font-size:10px;"></div> <div id="A" ontouchstart="insertTouchFeedback">Element A</div> <div id="B">Element B</div> <div id="C">Element C</div> <div id="D">Element D</div> <div id="E">Element E</div> <div id="F">Element F</div> <div id="G">Element G</div> <script> const feedback = document.getElementById("Feedback"); function insertTouchFeedback(event){ const offsetX = event.pageX - event.targetTouches[0].pageX; const offsetY = event.pageY - event.targetTouches[0].pageY; feedback.innerHTML = ` Hit on ${event.pageX}x${event.pageY} <br/> Actually triggers "${event.target.innerHTML}" at ${event.targetTouches[0].pageX}x${event.targetTouches[0].pageY} <br/> Offset ${offsetX}x${offsetY} <br/> Factor ${event.targetTouches[0].pageX / event.pageX} x ${event.targetTouches[0].pageY / event.pageY} `; } document.getElementById("A").addEventListener("touchstart", insertTouchFeedback); document.getElementById("B").addEventListener("touchstart", insertTouchFeedback); document.getElementById("C").addEventListener("touchstart", insertTouchFeedback); document.getElementById("D").addEventListener("touchstart", insertTouchFeedback); document.getElementById("E").addEventListener("touchstart", insertTouchFeedback); document.getElementById("F").addEventListener("touchstart", insertTouchFeedback); document.getElementById("G").addEventListener("touchstart", insertTouchFeedback); </script> </body> </html> We use WKWebView within Objective-C. Any idea whet goes wrong would be great! Thanks!
Topic: UI Frameworks SubTopic: UIKit
0
0
17
5d
Using .glassEffect in Charts
Hi, I was wondering if it's possible (and advisable) to use the new glass effects available in iOS 26 in Swift Charts? For example, in a chart like the one in the image I've attached to this post, I was looking to try adding a .glassEffect modifier to the BarMarks to see how that would look and feel. However, it seems it's not available directly on the BarMark (ChartContent) type, and I'm having trouble adding it in other ways too, such as using in on the types I supply to modifiers like foregroundStyle or clipShape. Am I missing anything? Maybe it's just not advisable or necessary to use glass effects within Charts?
3
0
76
5d
How to listen for Locale change event in iOS using NSLocale.currentLocaleDidChangeNotification?
I have the following function private func SetupLocaleObserver () { NotificationCenter.default.addObserver ( forName: NSLocale.currentLocaleDidChangeNotification, object: nil, queue: .main ) {_ in print ("Locale changed to: \(Locale.current.identifier)"); } } I call this function inside the viewDidLoad () method of my view controller. The expectation was that whenever I change the system or app-specific language preference, the locale gets changed, and this change triggers my closure which should print "Locale changed to: " on the console. However, the app gets terminated with a SIGKILL whenever I change the language from the settings. So, it is observed that sometimes my closure runs, while most of the times it does not run - maybe the app dies even before the closure is executed. So, the question is, what is the use of this particular notification if the corresponding closure isn't guaranteed to be executed before the app dies? Or am I using it the wrong way?
1
0
46
6d
iOS 26 UIKIt: Where's the missing cornerConfiguration property of UIViewEffectView?
In WWDC25 video 284: Build a UIKit app with the new design, there is mention of a cornerConfiguration property on UIVisualEffectView. But this properly isn't documented and Xcode 26 isn't aware of any such property. I'm trying to replicate the results of that video in the section titled Custom Elements starting at the 19:15 point. There is a lot of missing details and typos in the code associated with that video. My attempts with UIGlassEffect and UIViewEffectView do not result in any capsule shapes. I just get rectangles with no rounded corners at all. As an experiment, I am trying to recreate the capsule with the layers/location buttons in the iOS 26 version of the Maps app. I put the following code in a view controller's viewDidLoad method let imgCfgLayer = UIImage.SymbolConfiguration(hierarchicalColor: .systemGray) let imgLayer = UIImage(systemName: "square.2.layers.3d.fill", withConfiguration: imgCfgLayer) var cfgLayer = UIButton.Configuration.plain() cfgLayer.image = imgLayer let btnLayer = UIButton(configuration: cfgLayer, primaryAction: UIAction(handler: { _ in print("layer") })) var cfgLoc = UIButton.Configuration.plain() let imgLoc = UIImage(systemName: "location") cfgLoc.image = imgLoc let btnLoc = UIButton(configuration: cfgLoc, primaryAction: UIAction(handler: { _ in print("location") })) let bgEffect = UIGlassEffect() bgEffect.isInteractive = true let bg = UIVisualEffectView(effect: bgEffect) bg.contentView.addSubview(btnLayer) bg.contentView.addSubview(btnLoc) view.addSubview(bg) btnLayer.translatesAutoresizingMaskIntoConstraints = false btnLoc.translatesAutoresizingMaskIntoConstraints = false bg.translatesAutoresizingMaskIntoConstraints = false NSLayoutConstraint.activate([ btnLayer.leadingAnchor.constraint(equalTo: bg.contentView.leadingAnchor), btnLayer.trailingAnchor.constraint(equalTo: bg.contentView.trailingAnchor), btnLayer.topAnchor.constraint(equalTo: bg.contentView.topAnchor), btnLoc.centerXAnchor.constraint(equalTo: bg.contentView.centerXAnchor), btnLoc.topAnchor.constraint(equalTo: btnLayer.bottomAnchor, constant: 15), btnLoc.bottomAnchor.constraint(equalTo: bg.contentView.bottomAnchor), bg.centerXAnchor.constraint(equalTo: view.safeAreaLayoutGuide.centerXAnchor), bg.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 40), ]) The result is pretty close other than the complete lack of capsule shape. What changes would be needed to get the capsule shape? Is this even the proper approach?
1
0
65
6d
Xcode26 build app with iOS26, UISplitViewController UI issue
Our project using UISplitViewController as the root view controller for whole app. And when using the xocde26 to build app in iOS26, the layout of page is uncorrect. for iPhone, when launch app and in portrait mode, the app only show a blank page: and when rotate app to landscape, the first view controller of UISplitViewController's viewControllers will float on second view controller: and this float behavior also happens in iPad: below is the demo code: AppDelegate.swift: import UIKit @main class AppDelegate: UIResponder, UIApplicationDelegate { let window: UIWindow = UIWindow() func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { let vc = SplitViewController(primary: TabBarViewController(), secondary: ViewController()) window.rootViewController = vc window.makeKeyAndVisible() return true } } SplitViewController: import UIKit class SplitViewController: UISplitViewController { init(primary: UIViewController, secondary: UIViewController) { super.init(nibName: nil, bundle: nil) preferredDisplayMode = .oneBesideSecondary presentsWithGesture = false delegate = self viewControllers = [primary, secondary] } required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") } override func viewDidLoad() { super.viewDidLoad() } } extension SplitViewController: UISplitViewControllerDelegate { } TabBarViewController.swift: import UIKit class FirstViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .red tabBarItem = UITabBarItem(title: "Home", image: UIImage(systemName: "house"), tag: 0) } } class SecondViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .purple tabBarItem = UITabBarItem(title: "Setting", image: UIImage(systemName: "gear"), tag: 1) } } class TabBarViewController: UITabBarController { override func viewDidLoad() { super.viewDidLoad() let firstVC = FirstViewController() let secondVC = SecondViewController() tabBar.backgroundColor = .orange viewControllers = [firstVC, secondVC] } } ViewController.swift: import UIKit class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .systemPink } } And I have post a feedback in Feedback Assistant(id: FB18004520), the demo project code can be found there.
1
1
94
6d
How to replace layoutManager with textLayoutManager for a flexible dynamic height UITextView
In order to create a UITextView like that of the Messages app whose height grows to fits its contents (number of lines), I subclassed UITextView and customized the intrinsicContentSize like so: override var intrinsicContentSize: CGSize { var size = super.intrinsicContentSize if size.height == UIView.noIntrinsicMetric { layoutManager.glyphRange(for: textContainer) size.height = layoutManager.usedRect(for: textContainer).height + textContainerInset.top + textContainerInset.bottom } return size } As noted at WWDC, accessing layoutManager will force TextKit 1, we should instead use textLayoutManager. How can this code be migrated to support TextKit 2?
3
0
73
6d
The new iOS 26 navigation bar is far too high in landscape orientation
There are apps which are designed to be used primarily in landscape orientation. Music apps often fall into this category, like GarageBand. The new iOS 26 navigation bar in landscape mode is MUCH higher than in previous SDKs. I am maintaining and shipping a professional piano tuning app which is designed to be used in landscape orientation and the new higher navigation bar significantly reduces the amount of vertical screen real estate for it, leading to visual problems. These screenshots illustrate the difference in nav bar height between iOS 16 and iOS26 and the result it has on my app: I know that I can completely disable the new UI with the UIDesignRequiresCompatibility Info.plist key. But going forward it would be great to have a solution that does not completely prevent liquid glass UI in my app. I know that landscape orientation iPhone apps are not the main focus of UIKit, but please note that there are valid professional use cases for it.
Topic: UI Frameworks SubTopic: UIKit
3
0
94
6d
SwiftUI List features within complex grids of content
Our app displays complex, data-driven layouts that can display grids of items in addition to full width rows (essentially, nested lists). We'd like to be able to preserve cell/item portability (i.e., display in any content strip) and allow them to carry capabilities like swipe actions. In UIKit we have features in compositional layout that allow for this. However, in SwiftUI the only support seems to be at the List level. Nesting a List within a ScrollView to get swipe actions feels like a dark road. We've rolled our own swipe actions system, but we'd much rather use a native solution. Any other options here? Improvement ticket here FB17994843.
1
1
38
6d