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

Screen capture notification in MacOs catalyst
We have a IOS app and we are using the same app for Mac Catalyst. In IOS we are able to detect when user take the screenshot using UIApplicationUserDidTakeScreenshotNotification. But in MACCatalyst it is not working. As per docs UIApplicationUserDidTakeScreenshotNotification and UIScreenCapturedDidChangeNotification are both supported for MacCatalyst 13.1+. But I am not getting screen shot notifications using both
3
0
531
Feb ’25
My SwiftUI menu item renders differently in a MenuBarExtra / NSStatusBar
Hi, I'm working on an app that will mostly live in the menu bar. I'm trying to make a menu item that looks similar to the Tailscale app's menu: Note: I'm inspired by how Tailscale's menu is rendered: I have made a View that shows my avatar, name, and optionally the company I work for: import SwiftUI struct MenuWhoAmI: View { var username: String var binding: String? var body: some View { HStack { AsyncImage(url: URL(string: "https://avatars.githubusercontent.com/u/76716")!){ image in image.resizable().scaledToFit() } placeholder: { ProgressView() } .clipShape(Circle()) VStack(alignment: .leading) { Text(username) if let binding = binding { Text("\(binding)").foregroundStyle(.secondary) } } } } } #Preview { VStack(alignment: .leading) { MenuWhoAmI(username: "grahamc").padding() Divider() MenuWhoAmI(username: "grahamc", binding: "DeterminateSystems").padding() }.padding() } I tried using it in my menu bar: import SwiftUI @main struct DeterminateApp: App { var body: some Scene { MenuBarExtra("Determinate", image: "MenuIcon") { MenuWhoAmI(username: "grahamc") Button("Two") {} Button("Three") {} Divider() Button("Quit") { NSApplication.shared.terminate(nil) }.keyboardShortcut("q") }.menuBarExtraStyle(.menu) } } and it renders differently: After reading the forums and documentation, I understood the MenuBarExtra only renders certain elements. I then tried to use an NSStatusBar with an AppDelegate: import AppKit import SwiftUI @main struct DeterminateApp: App { @NSApplicationDelegateAdaptor private var appDelegate: AppDelegate var body: some Scene { Window("Authentication", id: "login") {} } } class AppDelegate: NSObject, NSApplicationDelegate, ObservableObject { private var statusItem: NSStatusItem! func applicationDidFinishLaunching(_ notification: Notification) { statusItem = NSStatusBar.system.statusItem(withLength: NSStatusItem.variableLength) if let button = statusItem.button { button.image = NSImage(named: NSImage.Name("MenuIcon")) } statusItem.menu = NSHostingMenu(rootView: Group { Button(action: { print("hi") }) { MenuWhoAmI(username: "grahamc") } }) } } and still, the avatar/name doesn't render like I'd expect, missing the circle clipping: ...and I'm a bit mystified. How can I make this menu render the way I'm trying for? Thank you!
1
0
517
Jan ’25
SwiftUIKit Got double back button and blank screen
I tried to update my ios from 17.2 to 18.1 on my iphone 14 pro. I use this device for testing my apps. when i go to my sdk, i got double back button and when i clicked the back button it will go to blank screen here is the ss double back button got blank screen its never happened on ios 17 and below i use coordinator and UINavigationController anyone have solutions?
1
0
296
Jan ’25
NSDocumentController subclass with remembered document options
Hi all, I am trying to allow users of my app to select extra options when opening documents, and to remember those options when re-opening documents at launch. So far best idea I have is: Subclass NSDocumentController to provide an NSOpenPanel.accessoryView with the options Create a URL bookmark for each opened file and keep a mapping of bookmarks to options On launch and when the recent documents list changes, prune the stored mappings to match only the recent items Has anyone done this before, or know of a better approach? Thank you.
Topic: UI Frameworks SubTopic: AppKit
0
0
306
Feb ’25
swiftui fileimporter inside UIHostingController
I'm working on an old iOS app that started with objective-C + UIKit and has being migrated to Swift + SwiftUI. Currently its code is mostly Swift + SwiftUI but it has still some objective-C and some UIKit ViewControllers. One of the SwiftUI views uses fileImporter to open Files App and select a file from the device. This has been working well until iOS 18 is launched. With iOS 18 the file picker is not launching correctly and is frozen in every simulator (the unique real device I've could test with iOS 18 seemed to work correctly). I managed to clone my project and leave it with the minimal amount of files to reproduce this error. This is the code: AppDelegate.h #import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicationDelegate> {} @property (strong, nonatomic) UIWindow *window; @end AppDelegate.m #import "AppDelegate.h" #import "MyApp-Swift.h" @interface AppDelegate () @end @implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; self.window.backgroundColor = [UIColor whiteColor]; [self.window makeKeyAndVisible]; FirstViewBuilder *viewBuilder = [[FirstViewBuilder alloc] init]; [viewBuilder show]; return YES; } @end FirstViewBuilder.swift import SwiftUI @objc class FirstViewBuilder: NSObject { private var view: UIHostingController<FirstView> @objc override init() { self.view = MyHostingController(rootView: FirstView()) } @objc func show() { let app = UIApplication.shared.delegate as? AppDelegate let window = app?.window window?.backgroundColor = .white // Use navigationController or view directly depending on use window?.rootViewController = view } } FirstView.swift import SwiftUI struct FirstView: View { @State var hasToOpenFilesApp = false var body: some View { VStack(alignment: .leading, spacing: 0) { Button("Open Files app") { hasToOpenFilesApp = true }.fileImporter(isPresented: $hasToOpenFilesApp, allowedContentTypes: [.text]) { result in switch result { case .success(let url): print(url.debugDescription) case .failure(let error): print(error.localizedDescription) } } } } } And finally, MyHostingController import SwiftUI class MyHostingController<Content>: UIHostingController<Content> where Content: View { override init(rootView: Content) { super.init(rootView: rootView) } @objc required dynamic init?(coder aDecoder: NSCoder) { fatalError("init(coder:) has not been implemented") } override func viewDidLoad() { super.viewDidLoad() navigationItem.hidesBackButton = true } } Launching this in an iPhone 13 Pro (18.2) simulator I click on Open Files App, it takes 2 seconds to open it, and it opens full screen (not like a modal). Buttons on the top are behind the status bar and buttons at the bottom are behind the Home indicator. But it's worse because the user can't interact with this view, it's frozen. I created a fresh SwiftUI project just with this unique view and the fileimport worked as expected so I thought the problem was due to embed the SwiftUI view inside the UIHostingController. So I made these modifications to the minimal project: Remove the files AppDelegate, FirstViewBuilder and MyHostingController. Create this SwiftUI App file import SwiftUI @main struct MyApp: App { var body: some Scene { WindowGroup { FirstView() } } } And again the same problem with iOS 18. But if I launch this exact project in an iPhone 13 Pro (17.4) simulator and open the files apps (now it opens almost instantly) it works OK and shows the file picker as a modal, as expected, and I can interact with it and select files. Last thing I've tried is removing LaunchScreen.xib from my project and Launch screen interface file base name key from my info.plist but the problem keeps happening. I guess it must be due to my project configuration (too old) but I have no more ideas of where to look at. The possibility of having a fresh SwiftUI project and "move" the old project to the new one could take me several weeks and I discard it by the moment. Could I use another method to select files from SwiftUI views with iOS 18?
2
0
479
Feb ’25
Is UIApplication.setAlternateIconName still available to use?
I writing swift code to change the app icon using setAlternateIconName and flutter MethodChannel to invoke swift. UIApplication.shared.setAlternateIconName(iconName) { error in if let error = error { print("Error setting alternate icon: \(error.localizedDescription)") result(FlutterError(code: "ICON_CHANGE_ERROR", message: error.localizedDescription, details: nil)) // Send error back to Flutter } else { print("App icon changed successfully!") result(nil) // Success! } } But I got an error message the requested operation couldn't be completed because the feature is not supported when using it on iOS 17+. So, Is setAlternateIconName still available? PS. In XCode, the code hinting shows that setAlternateIconName is still not deprecated.
Topic: UI Frameworks SubTopic: UIKit Tags:
1
0
291
Feb ’25
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
478
Jan ’25
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
353
Feb ’25
Implement two lists side by side with SwiftUI on iPad
I'm currently building an App using a TabView as the main navigation method. In my app I would like to build a page similar to the Top Charts in the native App Store App with two lists side by side: So far I came up with this code (simplified demo): import SwiftUI struct Demo: View { var body: some View { TabView { Tab("Main Tab", systemImage: "tray.and.arrow.down.fill") { NavigationStack { HStack { List { Text("Left List") } List { Text("Right List") } } .navigationTitle("Demo") .navigationBarTitleDisplayMode(.inline) } } } } } #Preview { Demo() } However, I’m encountering a couple of issues: • Scrolling to the top of the left list doesn’t trigger the toolbar background effect, and the content overlaps with the tabs in a strange way. Scrolling to the top of the right list works as expected. • The navigation title is always hidden. I haven’t been able to find a solution to these problems. What would be the correct approach? Thank you!
1
0
579
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
457
Jan ’25
SwiftUI Text is larger when empty
I have a simple SwiftUI Text: Text(t) .font(Font.system(size: 9)) Strangely its ideal height seems to be larger when it is empty. I initially observed this in a custom Layout container that wasn't working quite right. Eventually I looked at the height returned by v.dimensions(in:), and found that when t is non-empty the height is 11; when empty, it's 14. Subsequently I observed similar behaviour in a regular VStack container. Has anyone seen anything similar? Are there any properties that could affect this behaviour? (This is on a watch - I don't know if that matters.)
0
0
308
Jan ’25
collectionView(_:shouldBeginMultipleSelectionInteractionAt:) triggered by trackpad click
In my collection view I have allowsSelection, allowsSelectionDuringEditing, and allowsMultipleSelectionDuringEditing set to true. In my delegate's collectionView(_:shouldBeginMultipleSelectionInteractionAt:) I return true unconditionally, getting me the desired behavior of triggering edit mode with a two-finger swipe. So far so good. The problem is that collectionView(_:shouldBeginMultipleSelectionInteractionAt:) is also called on a single-finger click from a trackpad. Tapping one of my cells is supposed to open a sub-screen, so with this happening there's no way to navigate my screen using a trackpad. This also goes against the documentation, which says this delegate method is supposed to get called because of a two-finger swipe. Is there a way to keep that call from happing from a trackpad click? Or a way to distinguish whether I'm getting the call because of an actual two finger swipe?
Topic: UI Frameworks SubTopic: UIKit Tags:
2
0
256
Feb ’25
How to drag drop to reorder items in a horizontal scroll view?
Hi, I thought that drag drop reorder should be very easy with SwiftUI, but apparently I was wrong (unless I'm missing something). It seems to me that SwiftUI's drag-drop reorder is only easy for List, which supports .onMove modifier. However, for UI like Grid, a horizontal ScrollView with items in a HStack, I don't see any easy approach to implement this. For example, ScrollView(.horizontal) { HStack { ForEach(items) { ItemView(item) } } } Does anyone know what's the best way to implement drag drop reorder for this horizontal scroll view?
4
0
605
Jan ’25
CarPlay - Navigation app icon
Hi, Despite having CarPlay capabilities authorised for our navigation app, our users are seeing some odd behaviour in the appearance of the icon in the sidebar menu on the side of the CarPlay display. The documentation suggests the quickbar will show the most recently used: navigation app, Open our app in CarPlay Switch to another non-navigation app via CarPlay sidebar Note that our navigation app remains in sidebar Switch back to our navigation app Search for destination, select, tap 'Let's Go' to start navigation Switch to a non-navigation app via CarPlay sidebar Note that our app is replaced by another navigation app in the sidebar (Google/Apple), despite being the most recently used Any ideas?
2
0
351
Jan ’25
Form - Multiplatform - Alignment off - HStack ?
Not sure what could cause this. the UI align differently running on iPhone versus running on Mac. If I remove the HStack, it works but I still would like to know why, and if there is a way to make it right on both platforms. Thank you here is my code @State private var viewModel = FirmwareSelectionViewModel() var body: some View { Form { Section("Setup Name") { TextField ( "", text: $viewModel.setupName ) .foregroundColor(.green ) .disableAutocorrection(true) .onSubmit { print ("On Submit") } } Section("Battery") { HStack() { Text("Volt") TextField("", value: $viewModel.Vnominal, format: .number) .textFieldStyle(.roundedBorder) .foregroundColor(.green ) #if !os(macOS) .keyboardType(.decimalPad) #endif .onChange(of: viewModel.Vnominal) { viewModel.checkEntryValidity() print("Updated Vnominal: \(viewModel.Vnominal)") } Text("Ah") TextField("", value: $viewModel.batteryCapacity, format: .number) .textFieldStyle(.roundedBorder) .foregroundColor(.green ) #if !os(macOS) .keyboardType(.decimalPad) #endif .onChange(of: viewModel.batteryCapacity) { viewModel.checkEntryValidity() print("Updated Battery Capacity: \(viewModel.batteryCapacity)") } } } Section("Firmware Type") { Picker(selection: $viewModel.selectedType, label: EmptyView()) { ForEach(TypeOfFirmware.allCases) { type in Text(type.rawValue).tag(type as TypeOfFirmware) .foregroundColor(.green ) } } .pickerStyle(SegmentedPickerStyle()) Picker(selection: $viewModel.selectedFirmware, label: EmptyView()) { ForEach(viewModel.availableFirmware) { firmware in Text(firmware.rawValue.capitalized).tag(firmware as Firmware) } } .pickerStyle(SegmentedPickerStyle()) } } .onChange(of: viewModel.selectedType) { viewModel.resetFirmwareSelection() } .navigationTitle("Firmware Selection") } }
Topic: UI Frameworks SubTopic: SwiftUI
0
0
182
Jan ’25
high internal cpu usage
Hi, I am developing a new SwiftUI app. Running under OSX, I see very high cpu usage (I am generating lots of gpu based updates which shouldn't affect the cpu). I have used the profiler to ensure my swift property updates are minimal, yet the cpu usage is high coming from SwiftUI. It seems the high cpu usage is coming from NSAppearance, specifically, CUICopyMeasurements - for a single button??? But the swift updates don't show any buttons being updating
Topic: UI Frameworks SubTopic: SwiftUI
0
0
275
Feb ’25
Bidirectional Text Rendering Issue in Swift UILabel for Arabic
I'm encountering an issue displaying a large HTML string (over 11470 characters) in a UILabel. Specifically, the Arabic text within the string is rendering left-to-right instead of the correct right-to-left direction. I've provided a truncated version of the HTML string and the relevant code snippet below. I've tried setting the UILabel's text alignment to right, but this didn't resolve the issue. Could you please advise on how to resolve this bidirectional text rendering problem? The results of the correct and incorrect approaches are shown in the image below. Here's the relevant Swift code: let labelView: UILabel = { let label = UILabel() label.textAlignment = .right label.translatesAutoresizingMaskIntoConstraints = false label.numberOfLines = 0 label.semanticContentAttribute = .forceRightToLeft label.backgroundColor = .white label.lineBreakMode = .byWordWrapping return label }() //Important!! //It must exceed 11470 characters. let htmlString = """ &lt;p style=\"text-align: center;\"&gt;&lt;strong&gt;İSTİÂZE&lt;/strong&gt;&lt;/p&gt; &lt;p&gt;Nahl sûresindeki:&lt;/p&gt; &lt;p dir="rtl" lang="ar"&gt; فَاِذَا قَرَاْتَ الْقُرْاٰنَ فَاسْتَعِذْ بِاللّٰهِ مِنَ الشَّيْطَانِ الرَّج۪يمِ &lt;/p&gt; &lt;p&gt;&lt;strong&gt;“&lt;/strong&gt;&lt;strong&gt;Kur’an okuyacağın zaman kovulmuş şeytandan hemen Allah’a sığın!&lt;/strong&gt;&lt;strong&gt;”&lt;/strong&gt; (Nahl 16/98) emri gereğince Kur’ân-ı Kerîm okumaya başlarken:&lt;/p&gt; &lt;p dir="rtl" lang="ar"&gt;اَعُوذُ بِاللّٰهِ مِنَ الشَّيْطَانِ الرَّج۪يمِ&lt;/p&gt; &lt;p&gt;&lt;em&gt;“Kovulmuş şeytandan Allah’a sığınırım” &lt;/em&gt;deriz. Bu sözü söylemeye “istiâze&lt;em&gt;” denilir. “Eûzü”&lt;/em&gt;, sığınırım, emân dilerim, yardım taleb ederim, gibi anlamlara gelir. It must exceed 11470 characters.&lt;/p&gt; “”” if let data = htmlString.data(using: .utf8) { let options: [NSAttributedString.DocumentReadingOptionKey: Any] = [ .documentType: NSAttributedString.DocumentType.html, .characterEncoding: String.Encoding.utf8.rawValue ] do { let attributedString = try NSAttributedString(data: data, options: options, documentAttributes: nil) labelView.attributedText = attributedString } catch { print("HTML string işlenirken hata oluştu: \(error)") } } I'm using iOS 18.2 and Swift 6. Any suggestions on how to correct the bidirectional text rendering?
0
0
380
Jan ’25
Excessive ressource usage with NavigationLinks in LazyVStack
When a large number of NavigationLinks is within a LazyVStack (or LazyVGrid), ressource usage gets higher (and stays high) the further a user scrolls down. A simple example to reproduce this: NavigationStack { ScrollView { LazyVStack { ForEach(0..<5000) { number in NavigationLink(value: number) { Text("Number \(number)") } } } } .navigationDestination(for: Int.self) { number in Text("Details for number \(number)") } } List does not exhibit this behavior but is not suitable for my use case.
1
0
255
Jan ’25
QLPreviewingController can access previewed file, but cannot load files referenced by the previewed file
I have an app on the Mac App Store (so sandboxed) that includes a QuickLook Preview Extension that targets Markdown files. It established a QLPreviewingController instance for the macOS QuickLook system to access and it works. I'm in the process of updating it so that it displays inline images referenced in the file as well as styling the file's text. However, despite setting Downloads folder read-only access permission (and user-selected, though I know that shouldn't be required: no open/save dialogs here) in the extension's entitlements, Sandbox refuses too allow access to the test image: I always get a deny(1) file-read-data error in the log. FWIW, the test file is referenced in the source Markdown as an absolute unix file path. I've tried different signings and no joy. I’ve tried placing the referenced image in various other locations. Also no joy. All I can display is the error-case bundle image for 'missing image'. Question is, is this simply something that QuickLook extensions cannot do from within the sandbox, or am I missing something? Is there anything extra I can do to debug this?
0
0
413
Jan ’25
SwiftUI navigationDestination will make child view's stateObject init multi times with sheet modifier.
Below is my sample code. On the Home page, when I click "show sheet," the sheet page expands, and the StateObject inside the sheet is initialized once. However, when I click "show Fullscreen" and then click "show sheet" inside the fullscreen page, the sheet gets initialized twice. However, if I remove navigationDestination, this issue does not occur. This problem causes the network request in the sheet page to be triggered multiple times. Can someone tell me the reason? enum TestRouter: String, Hashable { case test var targetView: some View { Text("test") } var title: String { return "test title" } } @MainActor struct NavigationInnerView<Content>: View where Content: View { var contentView: () -> Content @MainActor public init(@ViewBuilder contentView: @escaping () -> Content) { self.contentView = contentView } var body: some View { NavigationStack() { contentView() .navigationDestination(for: TestRouter.self) { route in route.targetView } } .navigationViewStyle(StackNavigationViewStyle()) } } struct ContentView: View { @State var showFullScreen: Bool = false @State var showSheet: Bool = false var contentView: some View { VStack { VStack { Text("Home") Button { showFullScreen = true } label: { Text("show fullscreen") } Button { showSheet = true } label: { Text("show sheet ") } } } } var body: some View { NavigationInnerView { contentView .fullScreenCover(isPresented: $showFullScreen) { NavigationInnerView { FullScreenContentView() } } .sheet(isPresented: $showSheet) { NavigationInnerView { SheetContentView() } } } } } class FullScreenViewModel: ObservableObject { @Published var content: Bool = false init() { print("Full Screen ViewModel init") } } struct FullScreenContentView: View { @Environment(\.dismiss) var dismiss @State var showSheet: Bool = false @StateObject var viewModel: FullScreenViewModel = .init() init() { print("Full screen view init") } var body: some View { VStack { Text("FullScreen") Button { dismiss() }label: { Text("dismiss") } Button { showSheet = true } label: { Text("show sheet") } } .sheet(isPresented: $showSheet) { NavigationInnerView { SheetContentView() } } } } class SheetViewModel: ObservableObject { @Published var content: Bool = false init() { print("SheetViewModel init") } } struct SheetContentView: View { @Environment(\.dismiss) var dismiss @StateObject var viewModel = SheetViewModel() init() { print("sheet view init") } var body: some View { Text("Sheet") Button { dismiss() } label: { Text("dismiss") } } } #Preview { ContentView() }
3
0
376
Feb ’25