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

TextField.preferesDefaultFocus does not work in alerts
Hi, I am having trouble setting default focus on a TextField that is inside of an alert. I expected TextField to receive default focus when alert is presented but result is that TextField does not receive default focus. This is happening on macOS 15.2, Swift (SwiftUI), Xcode 16.2 but hasn't worked on previous versions as well. Example: ContentView().alert("Sample Alert", isPresented: $present) { AlertView() } message: { Text("Sample alert message.") } struct AlertView: View { @Namespace private var namespace @Environment(\.dismiss) private var dismiss @State private var text = "" var body: some View { VStack { TextField(text: $text, prompt: Text("Enter text")) {} .onSubmit { var _ = print(text) dismiss() } .autocorrectionDisabled() .lineLimit(1) .prefersDefaultFocus(in: namespace) Button("OK") { dismiss() } Button("Cancel", role: .cancel) { dismiss() } } .focusScope(namespace) } }
Topic: UI Frameworks SubTopic: SwiftUI
1
0
205
Jan ’25
Getting Error: Type '()' cannot conform to 'View'
can't see what the problem is .. Im getting the error: Type '()' cannot conform to 'View' struct CalendarView: View { @StateObject private var viewModel = CalendarViewModel() @State private var selectedDate: CalendarDate? @State private var showModal = false var body: some View { VStack { Text("Calendar App") .font(.largeTitle) .padding() GridStack(rows: 5, columns: 7) { row, col in let index = row * 7 + col if index < viewModel.calendarDates.count { let calendarDate = viewModel.calendarDates[index] Text("\(Calendar.current.component(.day, from: calendarDate.date))") .frame(width: 40, height: 40) .background(calendarDate.isSelected ? Color.blue : Color.clear) .cornerRadius(10) .foregroundColor(calendarDate.isSelected ? Color.white : Color.black) .onLongPressGesture { selectedDate = calendarDate showModal = true } } } } .background(Color.gray) .sheet(isPresented: $showModal) { if let date = selectedDate { DateSelectionModal(selectedDate: date) } } } } struct GridStack<Content: View>: View { let rows: Int let columns: Int let content: (Int, Int) -> Content var body: some View { VStack { ForEach(0..<rows) { row in HStack { ForEach(0..<columns) { column in content(row, column) } } } } } } #Preview { CalendarView() }
Topic: UI Frameworks SubTopic: SwiftUI
2
0
190
Feb ’25
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
268
Dec ’24
SFSafariViewController's preferred colors are invalidated after rotation
There are two issues about SFSafariViewController. After rotate from landscape to portrait, The topAnchor is destroyed. The specified bar tint color and control tint color are invalidated.(Returns to system color) Regarding the second issue, I’ve found a temporary workaround. Override the viewWillTransition(to:with:) and keep it empty. Don't call super.viewWillTransition(to:with:). Since UIKit is not open source, I don’t know the exact cause, but I found something that could be the key to the issue. So, I reported it to Apple Feedback Assistant. You can check the details and the sample project in the GitHub repository below. https://github.com/ueunli/SafariViewer
0
0
302
Feb ’25
Suggestion to Add Performance Metrics for SwiftUI in XCTest
As SwiftUI adoption grows, developers face challenges in effectively measuring and optimizing SwiftUI app performance within automated tests. Currently, the only viable approach to analyzing SwiftUI performance is through Profiling (Instruments), which, while powerful, lacks the ability to be incorporated into automated testing workflows. It would be incredibly valuable if XCTest could introduce new performance metrics specifically tailored for SwiftUI, allowing us to write tests against common performance bottlenecks. Suggested Metrics: View Body Evaluation Count – Tracks how often a SwiftUI body is recomputed to detect unnecessary re-renders. Slow View Bodies – Flags SwiftUI views that take a significant amount of time to compute their body. These metrics would help developers identify inefficiencies early, enforce performance best practices through CI/CD pipelines, and ensure a smooth user experience. I believe adding these performance metrics would be a game-changer for SwiftUI development. Thank you for your time and consideration!
1
0
428
Feb ’25
SwiftUI: toolbar jump weirdly in AppleWatch
Here is the reproducible codes: struct JumpView: View { var body: some View { NavigationStack { TabView { Text("Jump") .toolbar { ToolbarItem(placement: .topBarLeading) { Button("Done") {} } } } } } } Run directly in real apple watch device in watchOS 10.0+ (do not debug connecting with Xcode). When raise your wrist the ToolBar Button will jump weirdly.
1
0
372
Feb ’25
Numerous Undefined symbol errors
Getting these two warnings: Could not find or use auto-linked framework 'CoreAudioTypes': framework 'CoreAudioTypes' not found Could not parse or use implicit file '/Applications/Xcode16.0/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator.sdk/System/Library/Frameworks/SwiftUICore.framework/SwiftUICore.tbd': cannot link directly with 'SwiftUICore' because product being built is not an allowed client of it Followed by 100 + errors like below Undefined symbol: _TIFFCleanup & Undefined symbol: _TIFFReadRGBAImageOriented ..... Any ideas? I have tried adding CoreAudioTypes etc. Error is not clear. Am trying to stop using Rosetta
Topic: UI Frameworks SubTopic: General
2
0
781
Dec ’24
Context menu previews are ignoring the parent's scaleEffect() modifier
If you add the .scaleEffect() modifier to a parent view inside of which there are children with contextMenu()-s, the context menu preview unfortunately keeps the original, unscaled size of the child view. This results in a very weird, glitchy user experience. Unfortunately, providing a custom preview that is scaled up also does not help, since even though it is the right size, it gets cropped to the unscaled size of the child view. Adding scaleEffect() to each child element individually (BEFORE the contextMenu() modifier!) does make the problem disappear. However, I would like to avoid this, since my use case is zooming into a complex graph with context menus on its nodes, and having to recalculate the position of each node manually seems to perform much worse than delegating that work to scaleEffect(). Tested on iOS 18.2 (device + emulator) Is there a workaround? Here is a minimal working example that demonstrates the problem: struct ContentView: View { var body: some View { VStack(spacing: 20) { Rectangle() .frame(width: 100, height: 100) .contextMenu { Button("Test") {} Button("Test") {} } Rectangle() .frame(width: 100, height: 100) .contextMenu { Button("Test") {} Button("Test") {} } } .scaleEffect(1.5) } } Screenshot (problem: The two squares are the same size. However, the long-tapped upper square got shrunk down before the context menu got displayed.)
Topic: UI Frameworks SubTopic: SwiftUI
2
0
285
Feb ’25
Rectangle change size by swipe
Hi,, How can I make a rectangle become taller as I swipe down on my trackpad?" struct BlueRectangleView: View { var body: some View { VStack { Rectangle() .fill(Color.blue) .frame(width: 200, height: 100) .cornerRadius(10) .shadow(radius: 5) .padding() } .frame(maxWidth: .infinity, maxHeight: .infinity) .background(Color.white) } } struct BlueRectangleView_Previews: PreviewProvider { static var previews: some View { BlueRectangleView() } }
2
0
279
Jan ’25
SwiftData Migration Fail: What kind of backing data is this?
I'm trying to test migration between schemas but I cannot get it to work properly. I've never been able to get a complex migration to work properly unfortunately. I've removed a property and added 2 new ones to one of my data models. This is my current plan. enum MigrationV1toV2: SchemaMigrationPlan { static var schemas: [any VersionedSchema.Type] { [SchemaV1.self, SchemaV2.self] } static let migrateV1toV2 = MigrationStage.custom( fromVersion: SchemaV1.self, toVersion: SchemaV2.self, willMigrate: { context in print("Inside will migrate") // Get old months let oldMonths = try context.fetch(FetchDescriptor<SchemaV1.Month>()) print("Number of old months:\(oldMonths.count)") for oldMonth in oldMonths { // Convert to new month let newMonth = Month(name: oldMonth.name, year: oldMonth.year, limit: oldMonth.limit) print("Number of transactions in oldMonth: \(oldMonth.transactions?.count)") print("Number of transactions in newMonth: \(newMonth.transactions?.count)") // Convert transactions for transaction in oldMonth.transactions ?? [] { // Set action and direction let action = getAction(from: transaction) let direction = getDirection(from: transaction) // Update category if necessary var category: TransactionCategory? = nil if let oldCategory = transaction.category { category = TransactionCategory( name: oldCategory.name, color: SchemaV2.Category.Colors.init(rawValue: oldCategory.color?.rawValue ?? "") ?? .blue, icon: getCategoryIcon(oldIcon: oldCategory.icon) ) // Remove old category context.delete(oldCategory) } // Create new let new = Transaction( date: transaction.date, action: action, direction: direction, amount: transaction.amount, note: transaction.note, category: category, month: newMonth ) // Remove old transaction from month oldMonth.transactions?.removeAll(where: { $0.id == transaction.id }) // Delete transaction from context context.delete(transaction) // Add new transaction to new month newMonth.transactions?.append(new) } // Remove old month context.delete(oldMonth) print("After looping through transactions and deleting old month") print("Number of transactions in oldMonth: \(oldMonth.transactions?.count)") print("Number of transactions in newMonth: \(newMonth.transactions?.count)") // Insert new month context.insert(newMonth) print("Inserted new month into context") } // Save try context.save() }, didMigrate: { context in print("In did migrate") let newMonths = try context.fetch(FetchDescriptor<SchemaV2.Month>()) print("Number of new months after migration: \(newMonths.count)") } ) static var stages: [MigrationStage] { [migrateV1toV2] } } It seems to run fine until it gets the the line: try context.save(). At this point it fails with the following line: SwiftData/PersistentModel.swift:726: Fatal error: What kind of backing data is this? SwiftData._KKMDBackingData<Monthly.SchemaV1.Transaction> Anyone know what I can do about this?
1
0
435
Jan ’25
Adding a Label with UIImage and Text to the TabSection Header in tvOS 18+
I've been trying to add a header to the tabSection of the tabview in tvos 18+ . init( @TabContentBuilder<SelectionValue> content: () -> Content, @ViewBuilder header: () -> Header ) where Header : View, Footer == EmptyView Here the ehader clearly conforms to View but i cant quite fit the label with uiimage as the icon into this. This Label when i add it to any other view, the image is in the specified 50 x 50 size but inside header it functions weirdly to be of a huge size. but also to note, if i simply hav an icon here, it is correct. So what is the problem here.. can someone help me? im supposed to add the user profile and name in the header. I dont think there's any other way
Topic: UI Frameworks SubTopic: SwiftUI Tags:
0
0
352
Jan ’25
Window color Changed After Exiting Immersive Mode
Create an Empty visionOS App like this. starts in windowed mode, when I enter immersive mode and then exit back to windowed mode, I notice that the window appears dimmer. I start a simple project with settings as image shown below, and took screenShots of my window before and after entering immersive space then quit, compare them, the color value did become dimmer. The issue is reliably repeatable in a given room. If this issue is experienced, adjusting the display brightness to the maximum value and then back to the initial setting will restore the colors to the correct state. Force to exit the app then reopen it can do the same restoration.https://drive.google.com/file/d/1m-a4ghNlSkHhAQuvOCF_IAfcdYeJA14j/view?usp=sharing
1
0
271
Feb ’25
Task cancellation behaviour
Hi everyone, I believe this should be a simple and expected default behavior in a real-world app, but I’m unable to make it work: 1. I have a View (a screen/page in this case) that calls an endpoint using async/await. 2. If the endpoint hasn’t finished, but I navigate forward to a DetailView, I want the endpoint to continue fetching data (i.e., inside the @StateObject ViewModel that the View owns). This way, when I go back, the View will have refreshed with the fetched data once it completes. 3. If the endpoint hasn’t finished and I navigate back to the previous screen, I want it to be canceled, and the @StateObject ViewModel should be deinitialized. I can achieve 1 and 3 using the .task modifier, since it automatically cancels the asynchronous task when the view disappears: view .task { await vm.getData() } I can achieve 1 and 2 using a structured Task in the View (or in the ViewModel, its the same behavior), for example: .onFirstAppearOnly { Task { away vm.getData() } } onFirstAppearOnly is a custom modifier that I have for calling onAppear only once in view lifecycle. Just to clarify, dont think that part is important for the purpose of the example But the question is: How can I achieve all three behaviors? Is this really such an unusual requirement? My minimum deployment target is iOS 15, and I’m using NavigationView + NavigationLink. However, I have also tried using NavigationStack + NavigationPath and still couldn’t get it to work. Any help would be much appreciated. Thank you, folks!
0
0
398
Feb ’25
learning coregraphics help: connecting line to circles
Hi everyone, im in the process of delving more into coregraphics with swiftui, but I am at a roadblock. First I would like to ask, what are some good resources to learn coregraphics? Secondly: I currently have a circle view made and what I want to do is to make my circle view modular so that it can be directly connected to another given circle by a line. How can I do this? For example, I want my circles to represent nodes and be able to connect by lines to other nodes that are related. Thanks in advanced. Here is my code for the circle view: @State private var circleProgress: CGFloat = 0 let timer = Timer.publish(every: 0.016, on: .main, in: .common).autoconnect() private let animationDuration: TimeInterval = 1.5 @Binding var startPoint: CGPoint @Binding var endPoint: CGPoint var body: some View { GeometryReader { geometry in Canvas { context, size in // Circle parameters let circleSize: CGFloat = 50 let circleOrigin = CGPoint( x: size.width / 4, y: size.height / 2 - circleSize / 2 ) let circleRect = CGRect( origin: circleOrigin, size: CGSize(width: circleSize, height: circleSize) ) let circleCenter = CGPoint( x: circleOrigin.x + circleSize / 2, y: circleOrigin.y + circleSize / 2 ) // Animate circle creation var circlePath = Path() circlePath.addArc( center: circleCenter, radius: circleSize / 2, startAngle: .degrees(0), endAngle: .degrees(360 * circleProgress), clockwise: false ) context.addFilter(.shadow(color: .white.opacity(0.6), radius: 5, x: 1, y: 1)) // Add white shadow context.stroke( circlePath, with: .linearGradient( Gradient(colors: [.purple, .white]), startPoint: circleRect.origin, endPoint: CGPoint(x: circleRect.maxX, y: circleRect.maxY) ), lineWidth: 5 ) } .frame(width: 300, height: 150) .onReceive(timer) { _ in // Update circle progress let progressChange = 0.02 / animationDuration if circleProgress < 1.0 { circleProgress = min(circleProgress + progressChange, 1.0) } else { circleProgress = 0.0 // Reset the circle to repeat the animation } // Get the starting and ending points of the Canvas view startPoint = CGPoint(x: geometry.frame(in: .global).minX, y: geometry.frame(in: .global).minY) endPoint = CGPoint(x: geometry.frame(in: .global).maxX, y: geometry.frame(in: .global).maxY) // Print the points for debugging print("Start Point: \(startPoint.x), \(startPoint.y)") print("End Point: \(endPoint.x), \(endPoint.y)") } } .frame(width: 300, height: 150) } }
1
0
544
Jan ’25
not work paragraphStyle in AttributedString
I tried to create a Text View using attributedString. I want to set the line height using paragraphStyle and return the Text, but paragraphStyle is not being applied. Why is that? extension Text { init?(_ content: String, font: StyleType, color: Color = .ppBlack) { var attributedString = AttributedString(content) attributedString.font = Font.custom(font.fontWeight, fixedSize: font.fontSize) attributedString.foregroundColor = color let paragraphStyle = NSMutableParagraphStyle() paragraphStyle.minimumLineHeight = 16 paragraphStyle.maximumLineHeight = 16 paragraphStyle.lineSpacing = 0 attributedString.mergeAttributes(.init([.paragraphStyle: paragraphStyle])) self = Text(attributedString) } }
1
0
332
Feb ’25
Carplay在CPNowPlayingTemplate显示图片的败,且不可点击
System: iOS 18.1.1 When connected to Carplay, after playing a song, check the playback page CPNowPlayingTemplate. This error appears on the BMW car, as shown in the picture: In our project, this is achieved using the following methods: UIImage *image1 = [UIImage imageNamed:@"imageName"];; CPNowPlayingImageButton *button1 = [[CPNowPlayingImageButton alloc] initWithImage:image1 handler:^(__kindof CPNowPlayingButton * _Nonnull action) { //do something }]; UIImage *image2 = [UIImage imageNamed:@"imageName"];; CPNowPlayingImageButton *button2 = [[CPNowPlayingImageButton alloc] initWithImage:image2 handler:^(__kindof CPNowPlayingButton * _Nonnull action) { //do something }]; NSArray<CPNowPlayingButton *> *buttons; buttons = @[button1,button2]; [[CPNowPlayingTemplate sharedTemplate] updateNowPlayingButtons:buttons]; Is there any way to solve this problem?
Topic: UI Frameworks SubTopic: UIKit Tags:
1
0
385
Jan ’25
MacCatalyst Scene Frame needs adjustment
I don't know why, but for my MacCatalyst target, I have to make my view controller Y orgin 36 and the subtract the view height by 36 points, or the view is clipped. The following works in my main UIViewController, but feels super hacky. I'd feel better if I understood the issue and addressed it properly. override func viewWillLayoutSubviews() { super.viewWillLayoutSubviews() #if targetEnvironment(macCatalyst) if view.frame.origin.y < 1 { let f = UIApplication.shared.sceneBounds let newFrame = CGRect(x: 0.0, y: 36, width: f.size.width, height: f.size.height - 36) self.view.frame = newFrame } #endif } My guess is it starts the view under the title bar, but I have these set in the view controller: self.extendedLayoutIncludesOpaqueBars = false self.edgesForExtendedLayout = []
1
0
439
Jan ’25
Validate drag operations with Transferable
Let's say I want to build a simple photo management app on Mac or iPad with Swift UI. This app has multi-window support. My photos are organized inside albums. I should be able to drag photos between windows from one album to another. I struggle to get this working properly with Swift UI. Writing modern code I would like to use Transferable. Let's say my photos are not real files. So I can't use a FileRepresentation. Instead I use CodableRepresentation and encode an identifier. This identifier is later used to drive the move operation between folders. I ran into some limitations here Transferable seems to be meant for copy-like Drag & Drop operations. I have no possible to get a "move" cursor on macOS (it's always the copy cursor with the green + sign). Also the API reads like it is about importing/exporting – not moving. When using dropDestination on ForEach, I completely lack the possibility to deny a drop (e.g. when a photo is already part of the album). I'd like to have modifier key to switch between copying and moving. Sometimes a drop should be redirected to a different index. How to do that? Is there any chance to do this with Transferable? It even doesn't seem to be easy with NSItemProvider and onDrop/onDrag? Or should we still use a plain old UICollectionView/NSCollectionView, if we want to have more sophisticated control over drag/drop validation?
4
0
444
Jan ’25
Using AsyncStream vs @Observable macro in SwiftUI (AVCam Sample Code)
I want to understand the utility of using AsyncStream when iOS 17 introduced @Observable macro where we can directly observe changes in the value of any variable in the model(& observation tracking can happen even outside SwiftUI view). So if I am observing a continuous stream of values, such as download progress of a file using AsyncStream in a SwiftUI view, the same can be observed in the same SwiftUI view using onChange(of:initial) of download progress (stored as a property in model object). I am looking for benefits, drawbacks, & limitations of both approaches. Specifically, my question is with regards to AVCam sample code by Apple where they observe few states as follows. This is done in CameraModel class which is attached to SwiftUI view. // MARK: - Internal state observations // Set up camera's state observations. private func observeState() { Task { // Await new thumbnails that the media library generates when saving a file. for await thumbnail in mediaLibrary.thumbnails.compactMap({ $0 }) { self.thumbnail = thumbnail } } Task { // Await new capture activity values from the capture service. for await activity in await captureService.$captureActivity.values { if activity.willCapture { // Flash the screen to indicate capture is starting. flashScreen() } else { // Forward the activity to the UI. captureActivity = activity } } } Task { // Await updates to the capabilities that the capture service advertises. for await capabilities in await captureService.$captureCapabilities.values { isHDRVideoSupported = capabilities.isHDRSupported cameraState.isVideoHDRSupported = capabilities.isHDRSupported } } Task { // Await updates to a person's interaction with the Camera Control HUD. for await isShowingFullscreenControls in await captureService.$isShowingFullscreenControls.values { withAnimation { // Prefer showing a minimized UI when capture controls enter a fullscreen appearance. prefersMinimizedUI = isShowingFullscreenControls } } } } If we see the structure CaptureCapabilities, it is a small structure with two Bool members. These changes could have been directly observed by a SwiftUI view. I wonder if there is a specific advantage or reason to use AsyncStream here & continuously iterate over changes in a for loop. /// A structure that represents the capture capabilities of `CaptureService` in /// its current configuration. struct CaptureCapabilities { let isLivePhotoCaptureSupported: Bool let isHDRSupported: Bool init(isLivePhotoCaptureSupported: Bool = false, isHDRSupported: Bool = false) { self.isLivePhotoCaptureSupported = isLivePhotoCaptureSupported self.isHDRSupported = isHDRSupported } static let unknown = CaptureCapabilities() }
0
0
376
Dec ’24