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

SwiftUI bottom bar triggers UIKitToolbar hierarchy fault and constraint errors
[Submitted as FB21958289] A minimal SwiftUI app logs framework warnings when a bottom bar Menu is used with the system search toolbar item. The most severe issue is logged as a console Fault (full logs below): Adding 'UIKitToolbar' as a subview of UIHostingController.view is not supported and may result in a broken view hierarchy. Add your view above UIHostingController.view in a common superview or insert it into your SwiftUI content in a UIViewRepresentable instead. This appears to be a framework-level SwiftUI/UIKit integration issue, not custom UIKit embedding in app code. The UI may still render, but the warnings indicate an internal hierarchy/layout conflict. This occurs in simulator and physical device. REPRO STEPS Create a new project then replace ContentView with the code below. Run the app. The view uses NavigationStack + .searchable + .toolbar with: ToolbarItem(placement: .bottomBar) containing a Menu DefaultToolbarItem(kind: .search, placement: .bottomBar) EXPECTED RESULT No view hierarchy or Auto Layout warnings in the console. ACTUAL RESULT Console logs warnings such as: "Adding 'UIKitToolbar' as a subview of UIHostingController.view is not supported..." "Ignoring searchBarPlacementBarButtonItem because its vending navigation item does not match the view controller's..." "Unable to simultaneously satisfy constraints..." (ButtonWrapper/UIButtonBarButton width and trailing constraints) MINIMAL REPRO CODE import SwiftUI struct ContentView: View { @State private var searchText = "" @State private var isSearchPresented = false var body: some View { NavigationStack { List(0..<30, id: \.self) { index in Text("Row \(index)") } .navigationTitle("Toolbar Repro") .searchable(text: $searchText, isPresented: $isSearchPresented) .toolbar { ToolbarItem(placement: .bottomBar) { Menu { Button("Action 1") { } Button("Action 2") { } } label: { Label("Actions", systemImage: "ellipsis.circle") } } DefaultToolbarItem(kind: .search, placement: .bottomBar) } } } } CONSOLE LOG Adding 'UIKitToolbar' as a subview of UIHostingController.view is not supported and may result in a broken view hierarchy. Add your view above UIHostingController.view in a common superview or insert it into your SwiftUI content in a UIViewRepresentable instead. Ignoring searchBarPlacementBarButtonItem because its vending navigation item does not match the view controller's. view controller: <_TtGC7SwiftUI32NavigationStackHostingControllerVS_7AnyView_: 0x106014c00>; vc's navigationItem = <UINavigationItem: 0x105530320> title='Toolbar Repro' style=navigator searchController=0x106131200 SearchBarHidesWhenScrolling-default; vending navigation item <UINavigationItem: 0x106db4270> style=navigator searchController=0x106131200 SearchBarHidesWhenScrolling-explicit Unable to simultaneously satisfy constraints. Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. ( "<NSLayoutConstraint:0x600002171450 _TtC5UIKitP33_DDE14AA6B49FCAFC5A54255A118E1D8713ButtonWrapper:0x106a31fe0.width == _UIButtonBarButton:0x106dc4010.width (active)>", "<NSLayoutConstraint:0x6000021558b0 'IB_Leading_Leading' H:|-(8)-[_UIModernBarButton:0x106a38010] (active, names: '|':_UIButtonBarButton:0x106dc4010 )>", "<NSLayoutConstraint:0x600002170eb0 'IB_Trailing_Trailing' H:[_UIModernBarButton:0x106a38010]-(8)-| (active, names: '|':_UIButtonBarButton:0x106dc4010 )>", "<NSLayoutConstraint:0x60000210aa80 'UIView-Encapsulated-Layout-Width' _TtC5UIKitP33_DDE14AA6B49FCAFC5A54255A118E1D8713ButtonWrapper:0x106a31fe0.width == 0 (active)>" ) Will attempt to recover by breaking constraint <NSLayoutConstraint:0x600002170eb0 'IB_Trailing_Trailing' H:[_UIModernBarButton:0x106a38010]-(8)-| (active, names: '|':_UIButtonBarButton:0x106dc4010 )> Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKitCore/UIView.h> may also be helpful. Failed to send CA Event for app launch measurements for ca_event_type: 0 event_name: com.apple.app_launch_measurement.FirstFramePresentationMetric Failed to send CA Event for app launch measurements for ca_event_type: 1 event_name: com.apple.app_launch_measurement.ExtendedLaunchMetrics
Topic: UI Frameworks SubTopic: SwiftUI Tags:
1
2
125
2w
ProgressView(timerInterval:countsDown:) bar never reaches zero
Consider the following code on iOS: struct ContentView: View { @State private var timerInterval = Date(timeIntervalSince1970: 0) ... Date(timeIntervalSince1970: 0) var body: some View { VStack { ProgressView( timerInterval: timerInterval, countsDown: true ) Button { let now = Date() let then = now.addingTimeInterval(5) timerInterval = now ... then } label: { Text("Start") } } .padding() } } When I tap on the Start button, the progress view starts animating as expected, and its label is displaying the remaining time. However, at the very end, when the countdown reaches zero, the blue bar of the progress view doesn't reach zero and still has some progress left forever. Is this the expected behavior or a bug? Is there a way to make the bar reach zero without implementing my own custom view? Thanks in advance!
Topic: UI Frameworks SubTopic: SwiftUI
0
0
23
2w
Intrinsic content/system fitting size not propagating up to hosting controller.
Overview I have the following view hierarchy that mixes SwiftUI and UIKit: AccordionView └─ VStack ├─ Text ├─ Button └─ UIViewRepresentable └─ UIStackView ├─ UILabel └─ UILabel When tapping the button, the UIViewRepresentable hides and shows its content. This all works as expected. However, in certain circumstances the view's sizing is rendered with the correct size, but the text can often render incorrectly, despite the frame seemingly looking as though it has enough room to render the text. More info Below you can see the UILabel has the correct frame height (the light grey background and coloured borders) but the text is rendered as though it has infinite width along one line. There's a few configurations of my view hierarchy that seem to have this effect. I've added a playground to the bottom of this post of various configurations to show what does and doesn't work, just copy and paste to see for yourself... It seems of the ones that don't work, there's a couple of reasons why that may be: HostedView and TextViewContainer do not do the following (I think we only need to do one of these things for auto layout/stack views to work effectively): a) implement an intrinsic content size b) return a 'good' size for systemLayoutSizeFitting(). UIHostingController shouldn't use intrinsic size (although I'm sure it should) Something related to setting setContentCompressionResistancePriority() or setContentHuggingPriority() but having played about with this it doesn't seem relevant here... I've played around with everything I can think of here but can't find a solution that works for all, although I'm 99% sure it's one or all of the points above. If there are any UIKit gurus out there that can help that would be great! Ive already spent so much time on this 🫨 Playground Swift Playground
0
0
118
2w
Dynamic Type Layout constraint Issue - "My card" label Clipping at 100% Text Size (IOS 26.3.1 or 26.3.2)
Hello, I would like to report a potential Dynamic Type rendering issue observed in Control Center. After increasing the system text size to 100%, the label “My Card” appears visually constrained and partially clipped instead of scaling proportionally according to Dynamic Type guidelines. Steps to reproduce: Open Settings Increase Text Size to 100% Open Control Center Observe the “My Card” label Expected behavior: The label should scale proportionally using preferred text styles and remain fully visible without truncation. Observed behavior: The label appears constrained, suggesting possible fixed height constraints or insufficient layout flexibility. Technical hypothesis: This may be caused by: Fixed height constraints on the text container Non-preferred font usage instead of dynamic text styles Missing adjustsFontForContentSizeCategory configuration Incomplete layout testing across content size categories Given Apple’s emphasis on accessibility and Dynamic Type compliance, I believe this may be worth reviewing in a future update. Has anyone else observed similar behavior?
Topic: UI Frameworks SubTopic: UIKit
1
0
63
2w
Driving NavigationSplitView with something other than List?
Is it possible to drive NavigationSplitView navigation with a view in sidebar (left column) that is not a List? All examples that I have seen from this year only contain List in sidebar. I ask this because I would like to have a more complex layout in sidebar (or first view on iOS) that contains a mix of elements, some of them non-interactive and not targeting navigation. Here’s what I would like to do: import SwiftUI struct Thing: Identifiable, Hashable {     let id: UUID     let name: String } struct ContentView: View {     let things: [Thing]     @State private var selectedThingId: UUID?          var body: some View {         NavigationSplitView {             ScrollView(.vertical) {                 VStack {                     ForEach(things) { thing in                         Button("Thing: \(thing.name) \( selectedThingId == thing.id ? "selected" : "" )") {                             selectedThingId = thing.id                         }                     } SomeOtherViewHere() Button("Navigate to something else") { selectedThingId = someSpecificId }                 }             }         } detail: {             // ZStack is workaround for known SDK bug             ZStack {                 if let selectedThingId {                     Text("There is a thing ID: \(selectedThingId)")                 } else {                     Text("There is no thing.")                 }             }         }     } } This actually works as expected on iPadOS and macOS, but not iOS (iPhone). Tapping changes the selection as I see in the button label, but does not push anything to navigation stack, I remain stuck at home screen. Also filed as FB10332749.
14
5
7.1k
2w
NSTableCellView does not colour its background correctly
In an NSTableView (Appkit), I need to colour a cell background when it is selected. That works OK, except that the colour does not span the full cell width, nor even the text itself: The tableView structure is very basic: I see there is a TextCell at the end that cannot be deleted. What is this ? And the colouring as well: func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? { let p = someDataSource[row] if let cellView = tableView.makeView(withIdentifier: NSUserInterfaceItemIdentifier(rawValue: "Cell"), owner: self) { (cellView as! NSTableCellView).textField?.stringValue = p if selected[row] { (cellView as! NSTableCellView).backgroundColor = theLightBlueColor } else { (cellView as! NSTableCellView).backgroundColor = .clear } return cellView } } I've tried to change size constraints in many ways, to no avail. For instance, I changed Layout to Autoresising : I tried to change TableCellView size to 170 vs 144: Or increase tableColum Width. I have looked at what other object in the NSTableView hierarchy should be coloured without success. Nothing works. What am I missing ?
Topic: UI Frameworks SubTopic: AppKit Tags:
0
0
93
2w
UIToolbar Missing from View Hierarchy Since iOS 26
Since iOS 26, navigationController?.toolbar no longer appears in the view hierarchy, and UIToolbar itself is not visible in the view tree. Is there currently any supported way to access the toolbar’s container view or its underlying view hierarchy? However, the API itself is not deprecated. https://developer.apple.com/documentation/uikit/uinavigationcontroller/toolbar
Topic: UI Frameworks SubTopic: UIKit Tags:
1
0
110
3w
SwiftUI .toolbar(placement: .keyboard) item not exposed to accessibility on iOS 26.1 (affects VoiceOver + XCUITest)
Description On iOS 26.1, a ToolbarItem placed in .keyboard is no longer exposed to the accessibility hierarchy. As a result: VoiceOver cannot focus or activate the toolbar button XCUITest cannot discover the element, making the UI impossible to test TextEditor() .toolbar { ToolbarItem(placement: .keyboard) { Button("Done") { /* action */ } } } This worked correctly on previous iOS versions. The button appears visually but is missing from both VoiceOver navigation and XCUI accessibility queries. Steps to Reproduce Create a new SwiftUI project. Use a simple text field with a keyboard toolbar button. Run on an iOS 26.1 device or simulator. Focus the text field to show the keyboard. Turn on VoiceOver and attempt to navigate to the toolbar button. Run an XCUITest attempting to locate the button
2
1
188
3w
Memory leak in CarPlay when using CPListImageRowItem
Memory leak in CarPlay when using CPListImageRowItem. The following behavior was observed in the CPListTemplate class when using CPListImageRowItem: If a CPListImageRowItem cell is inserted into the screen, the screen starts to leak, even if it contains no elements (CPListImageRowItem(titleList: nil, imagesRow: [], titlesRow: []). Replacing CPListImageRowItem with CPListItem stops the leak. Using the new initializer for iOS 26 does not correct the issue; the screen still leaks. Class reference: https://developer.apple.com/documentation/carplay/cplistimagerowitem
0
0
65
3w
SwiftUI view state resetting after alert is shown
Seeing an issue in iOS 26.2 iPhone 17 simulator (haven't been able to reproduce on device or other simulators), where a view's state is reset after an alert is shown. In this example the first LibraryView has the issue when alert is shown, the second LibraryView maintains state as expected. struct ContentView: View { var body: some View { NavigationStack { List { VStack { LibraryView(title: "Show view (Loss of state)") } LibraryView(title: "Show view (Works as expected)") } } } } /// This view is from a package dependency and wants to control the presentation of the sheet internally public struct LibraryView: View { @State private var isPresented: Bool = false let title: String public init(title: String) { self.title = title } public var body: some View { Button(self.title) { self.isPresented = true } .sheet(isPresented: self.$isPresented) { ViewWithAlert() } } } private struct ViewWithAlert: View { @State private var isPresented: Bool = false @State private var presentedCount = 0 var body: some View { Button("Show Alert, count: \(presentedCount)") { isPresented = true presentedCount += 1 } .alert("Hello", isPresented: self.$isPresented) { Button("OK") { } } } } Any ideas? The issue can be corrected by moving the .sheet to a higher level within the layout (i.e. on the NavigationStack). However, the library wants to control that presentation and not require the integration to present the sheet.
Topic: UI Frameworks SubTopic: SwiftUI
11
1
424
3w
iPadOS 26 – SwiftUI Menu in ToolbarItem shifts during pointer hover when view is presented as sheet
I am observing inconsistent pointer hover behavior for a SwiftUI Menu placed inside a ToolbarItem on iPadOS 26.2 (real device). Scenario: • Screen A is pushed inside a NavigationStack. • Screen B is presented as a sheet (with its own NavigationStack). • Both screens contain the same toolbar Menu item using an SF Symbol (arrow.up.arrow.down). Observed behavior: In the pushed view, hover is mostly stable. In the sheet-presented view, the SF Symbol visibly shifts/jumps when pointer hover activates. The hover highlight shape differs from the native navigation back button. Label-level hoverEffect modifiers do not stabilize the behavior. Minimal example: import SwiftUI struct ContentView: View { @State private var showSheet = false var body: some View { NavigationStack { VStack { Button("Open Sheet") { showSheet = true } } .navigationTitle("Home") .toolbar { ToolbarItem(placement: .topBarTrailing) { Menu { Button("Option A") { } Button("Option B") { } } label: { Image(systemName: "arrow.up.arrow.down") } } } .sheet(isPresented: $showSheet) { SheetView() } } } } struct SheetView: View { var body: some View { NavigationStack { Text("Sheet View") .navigationTitle("Sheet") .toolbar { ToolbarItem(placement: .topBarTrailing) { Menu { Button("Option A") { } Button("Option B") { } } label: { Image(systemName: "arrow.up.arrow.down") } } } } } } This behavior is reproducible 100% on device. Is this expected behavior for Menu inside ToolbarItem when presented as a sheet, or a regression in pointer interaction rendering?
Topic: UI Frameworks SubTopic: SwiftUI
0
0
34
3w
.edgesIgnoringSafeArea(.vertical) combined with .tabViewStyle(.page(indexDisplayMode: .never)) causes "Out of Bounds" layout in Xcode 26 / iOS 26 SDK
I am reporting a regression/behavioral change in the SwiftUI layout engine when building with Xcode 26 (iOS 26 SDK). In previous versions (Xcode 15/16 and iOS 17/18 SDKs), a TabView using .tabViewStyle(.page(indexDisplayMode: .never)) correctly respected the coordinate space when combined with .edgesIgnoringSafeArea(.vertical). However, when compiling with the iOS 26 SDK, the internal views of the TabView render "out of bounds," pushing content vertically beyond the intended safe area boundaries and causing UI overlapping/clipping - an abnormal behavior. TabView(selection: $selectedIndex) { ForEach(0..<data.count, id: \.self) { index in nextPreviousHandlerView(id: data[index]) .tag(index) } } .tabViewStyle(.page(indexDisplayMode: .never)) .edgesIgnoringSafeArea(.vertical) // Causes vertical "jump" out of bounds in Xcode 26
0
0
47
3w
TabView inside NavigationStack is abnormal when using Xcode 26
TabView inside NavigationStack is abnormal when using Xcode 26. The y deviation is about 14. But it is right when using Xcode 16.4. It is also right without NavigationStack. import SwiftUI struct ContentView: View { private enum Tab: Hashable, CaseIterable { case a case b } @State private var currentTab: Tab = .a @State private var path: NavigationPath = NavigationPath() var body: some View { NavigationStack(path: $path) { TabView(selection: $currentTab) { ForEach(Tab.allCases, id: \.self) { tab in switch tab { case .a: Color.blue // .offset(y: -14) case .b: Color.yellow } } } .tabViewStyle(.page(indexDisplayMode: .never)) .ignoresSafeArea(.all) } } }
Topic: UI Frameworks SubTopic: SwiftUI
0
0
49
3w
How to setup UIApplicationDelegate that uses UIScenes for mirroring with AirPlay
Hi! I am developing a game for iOS using Objective-C and C++. I am trying to migrate an app to scene-based life cycle, but having a problem while mirroring screen from iPhone to MacBook using AirPlay. At this moment I don't want to implement multi-window (or multi-scene) support. The only thing I want is to have ability of screen mirroring. From the documentation from here and here I can't understand which UISceneConfiguration should I return. If I define a UIWindowSceneDelegate for the configuration, how should I handle scene:willConnectToSession:options: if the window has been already created for main device screen? Returning nil is not documented. Is there any examples? Also, I would expect that defining UIApplicationSupportsMultipleScenes to NO in Info.plist will automatically disable second scene creating. This is mentioned in documentation here, but this is not true, because I still see second scene creation (its pointer differs from one that was already created) in UIWindowSceneDelegate. What am I doing wrong? Any hints are highly appreciated!
Topic: UI Frameworks SubTopic: UIKit
4
0
116
3w
Smooth appearance switching
Hello every developers. I need your help. Do you know how to attach animation to appearance, like a smooth transition from dark to light and vise versa. My code here: @main struct The_Library_of_BabelonApp: App { @AppStorage("selectedAppearance") private var selectedAppearance = 0 @StateObject private var router = AppRouter() var scheme: ColorScheme? { if selectedAppearance == 1 { return .light } if selectedAppearance == 2 { return .dark } return nil } var body: some Scene { WindowGroup { RootView() .preferredColorScheme(scheme) .environmentObject(router) // this is doesn't work correctly .animation(.smooth(duration: 2), value: selectedAppearance) } } } And my appearance switching looks: struct SettingsView: View { @AppStorage("selectedAppearance") private var selectedAppearance = 0 var body: some View { List { Section(header: Text("Appearance")) { HStack(spacing: 20) { ThemePreview(title: "Light", imageName: "lightTheme", tag: 1, selection: $selectedAppearance) ThemePreview(title: "Dark", imageName: "darkTheme", tag: 2, selection: $selectedAppearance) ThemePreview(title: "System", imageName: "systemMode", tag: 0, selection: $selectedAppearance) } .padding(.vertical, 10) .frame(maxWidth: .infinity) } } } } struct ThemePreview: View { let title: String let imageName: String let tag: Int @Binding var selection: Int var body: some View { Button { selection = tag } label: { VStack { Image(imageName) .resizable() .aspectRatio(contentMode: .fill) .frame(width: 120, height: 80) .clipShape(RoundedRectangle(cornerRadius: 12)) .overlay( RoundedRectangle(cornerRadius: 12) .stroke(selection == tag ? Color.blue : Color.clear, lineWidth: 3) ) Text(title) .font(.caption) .foregroundColor(selection == tag ? .blue : .primary) } } .buttonStyle(.plain) } } I guess my code works but animation working another way, its turn my Section, I don't know.... Thank you in advance
1
0
58
3w
Swipe to go back still broken with Zoom navigation transition.
When you use .navigationTransition(.zoom(sourceID: "placeholder", in: placehoder)) for navigation animation, going back using the swipe gesture is still very buggy on IOS26. I know it has been mentioned in other places like here: https://developer.apple.com/forums/thread/796805?answerId=856846022#856846022 but nothing seems to have been done to fix this issue. Here is a video showing the bug comparing when the back button is used vs swipe to go back: https://imgur.com/a/JgEusRH I wish there was a way to at least disable the swipe back gesture until this bug is fixed.
8
2
535
3w
UIKit flip animation bugged in 26.1
Hello. I have an 12 year old app that still has some objective-c code in it. I have a place where i have a flip animation between 2 view controllers that looks like this: [UIView transitionFromView:origView toView:newViewController.view duration:0.5 options:UIViewAnimationOptionTransitionFlipFromRight completion:nil]; It has looked like this since 2012 at least. In our production release, it works prior to 26.1, but in 26.1 and 26.2, the flip is off-center and looks weird. it's like both edges flip the same way. It's a little bit hard to explain. If seen at least 2 other app store apps that i have installed behave this way too, from 26.1 and onwards. Anyone else seen this? Is there anything that can be done about it? Thankful for thoughts.
17
4
877
3w
Source view disappearing when interrupting a zoom navigation transition
When I use the .zoom transition in a navigation stack, I get a glitch when interrupting the animation by swiping back before it completes. When doing this, the source view disappears. I can still tap it to trigger the navigation again, but its not visible on screen. This seems to be a regression in iOS 26, as it works as expected when testing on iOS 18. Has someone else seen this issue and found a workaround? Is it possible to disable interrupting the transition? Filed a feedback on the issue FB19601591 Screen recording: https://share.icloud.com/photos/04cio3fEcbR6u64PAgxuS2CLQ Example code @State var showDetail = false @Namespace var namespace var body: some View { NavigationStack { ScrollView { showDetailButton } .navigationTitle("Title") .navigationBarTitleDisplayMode(.inline) .navigationDestination(isPresented: $showDetail) { Text("Detail") .navigationTransition(.zoom(sourceID: "zoom", in: namespace)) } } } var showDetailButton: some View { Button { showDetail = true } label: { Text("Show detail") .padding() .background(.green) .matchedTransitionSource(id: "zoom", in: namespace) } } }
Topic: UI Frameworks SubTopic: SwiftUI
17
23
1.6k
3w
Basics - Dice Demo, calculate total score
I've worked through Apple's dice demo for SwiftUI, so far so good. I've got a single Die view with a button to "roll" the die. This works perfectly using the code below: struct DieView: View { init(dieType: DieType) { self.dieValue = Int.random(in: 1...dieType.rawValue) self.dieType = dieType } @State private var dieValue: Int @State private var dieType: DieType var body: some View { VStack { if self.dieType == DieType.D6 { Image(systemName: "die.face.\(dieValue)") .resizable() .frame(width: 100, height: 100) .padding() } else {//self.dieType == DieType.D12{ Text("\(self.dieValue)") .font(.largeTitle) } Button("Roll"){ withAnimation{ dieValue = Int.random(in: 1...dieType.rawValue) } } .buttonStyle(.bordered) } Spacer() } } Now I want to do a DiceSetView with an arbitrary number of dice. I've got the UI working with the following; struct DiceSetView: View { @State private var totalScore: Int = 0 var body: some View { ScrollView(.horizontal) { HStack{ DieView(dieType: DieType.D6) DieView(dieType: DieType.D6) DieView(dieType: DieType.D6) } } HStack{ Button("Roll All"){} .buttonStyle(.bordered) Text("Score \(totalScore)") .font(.callout) } Spacer() } } Where I'm struggling is how to get the total of all the dice in a set and to roll all the dice in a set on a button click. I can't iterate through the dice, and just "click" the buttons in the child views from their parents, and I can't think how it should be structured to achieve this (I'm new to this style of programming!) - can anyone point me in the right direction for how to achieve what I want? I realise that I'm probably missing something fundamentally conceptual here....
Topic: UI Frameworks SubTopic: SwiftUI
0
0
28
3w