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

Swift charts displaying wrong theme through UIHostingController
Hi there, I'm currently using UIHostingController to display swift charts in uikit. The problem im facing is that the UIHostingController isn't outputting the intended theme. When the simulator/phone is on dark mode the view is still in light mode. Iv'e tried to force the view to use dark mode with: .environment(\.colorScheme, .dark) But it doesn't seem to help. Here's how I implement the UIHostingController to my view: let controller = UIHostingController(rootView: StatVC()) controller.view.translatesAutoresizingMaksIntoConstraints = false addChild(controller) controller.didMove(toParent: self) view.addSubview(controller.view) where StatVC() is the swiftui view which contains the swift chart.
1
0
1.2k
Feb ’25
UITabBarController y psoition issue for iOS 18
I am trying to give bottom padding to tabbar i.e ** tabBarFrame.origin.y = view.frame.height - tabBarHeight - 30** but it is not moving up from bottom, it gets sticked to bottom = 0 and the tabbar content moving up taher than tabbar itself.. Code snippet is - `i override func viewDidLayoutSubviews() { super.viewDidLayoutSubviews() let tabBarHeight: CGFloat = 70 // Custom height for the capsule tab bar var tabBarFrame = tabBar.frame tabBarFrame.size.height = tabBarHeight tabBarFrame.size.width = view.frame.width - 40 tabBarFrame.origin.y = view.frame.height - tabBarHeight - 30 tabBarFrame.origin.x = 20 tabBar.frame = tabBarFrame tabBar.layer.cornerRadius = tabBarHeight / 2 tabBar.clipsToBounds = true view.bringSubviewToFront(tabBar) }` Can anyone please help to resolve the issue for iOS 18, it is coming in iOS 18 rest previous versions are fine with the code.
0
0
327
Jan ’25
Widget archival failed due to image being too large
I'm trying to setup a widget to pull an image down from a webserver and I'm running into an error of Widget archival failed due to image being too large [9] - (1024, 1024), totalArea: 1048576 > max[718080.000000]. I've tried two different approaches to resolve this error and both have failed to resolve the image. I've also confirmed that I'm getting the image in the AppIntentTimelineProvider. private func getImageUI(urlString: String) -> UIImage? { guard let url = URL(string: urlString) else { return nil } guard let imageData = try? Data(contentsOf: url) else { return nil } return UIImage(data: imageData)?.resizedForWidget() } Is there another approach I could take on addressing this issue so the image appears on the widget? Simple approach extension UIImage { func resized(toWidth width: CGFloat, isOpaque: Bool = true) -> UIImage? { let canvas = CGSize(width: width, height: CGFloat(ceil(width/size.width * size.height))) let format = imageRendererFormat format.opaque = isOpaque return UIGraphicsImageRenderer(size: canvas, format: format).image { _ in draw(in: CGRect(origin: .zero, size: canvas)) } } } extension UIImage { /// Resize the image to strictly fit within WidgetKit’s max allowed pixel area (718,080 pixels) func resizedForWidget(maxArea: CGFloat = 718_080.0, isOpaque: Bool = true) -> UIImage? { let originalWidth = size.width let originalHeight = size.height let originalArea = originalWidth * originalHeight print("🔍 Original Image Size: \(originalWidth)x\(originalHeight) → Total Pixels: \(originalArea)") // ✅ If the image is already within the limit, return as is if originalArea <= maxArea { print("✅ Image is already within the allowed area.") return self } // 🔄 Calculate the exact scale factor to fit within maxArea let scaleFactor = sqrt(maxArea / originalArea) let newWidth = floor(originalWidth * scaleFactor) // Use `floor` to ensure area is always within limits let newHeight = floor(originalHeight * scaleFactor) let newSize = CGSize(width: newWidth, height: newHeight) print("🛠 Resizing Image: \(originalWidth)x\(originalHeight) → \(newWidth)x\(newHeight)") // ✅ Force bitmap rendering to ensure the resized image is properly stored let format = UIGraphicsImageRendererFormat() format.opaque = isOpaque format.scale = 1 // Ensures we are not letting UIKit auto-scale it back up let renderer = UIGraphicsImageRenderer(size: newSize, format: format) let resizedImage = renderer.image { _ in self.draw(in: CGRect(origin: .zero, size: newSize)) } print("✅ Final Resized Image Size: \(resizedImage.size), Total Pixels: \(resizedImage.size.width * resizedImage.size.height)") return resizedImage } } These are logs from a failed image render if that helps 🔍 Original Image Size: 720.0x1280.0 → Total Pixels: 921600.0 🛠 Resizing Image: 720.0x1280.0 → 635.0x1129.0 ✅ Final Resized Image Size: (635.0, 1129.0), Total Pixels: 716915.0
1
0
488
Feb ’25
Scaling a collection of positioned views to parent (macOS)?
I have a view that lets the user position and size a bunch of subviews. I use .frame() and .position() to accomplish this. Right now, if the user resizes the window, the views stay where they are, anchored to the top-left corner. What I'd like is for the views to scale as a whole with window, maintaining their relative position, and their aspect ratios. I can apply .scaleEffect(_:anchor:) to the containing view, and it scales them the way I want, but I'm not sure how to tie it to the window. My first thought is to use a GeometryReader, but I don't really know what the "original" size would have been in order to compute a scale factor. How else might I accomplish this?
Topic: UI Frameworks SubTopic: SwiftUI
1
0
248
Jan ’25
Apple Maps annotations and markers
In Apple's Maps app, an annotation is made up of a circle shape or rounded rectangles with a glyph-image. When selecting an annotation, the annotation animates into a balloon marker (see attached GIF). How does Apple Maps solve this - from custom annotation to balloon marker with spring animation? I switched my Maps implementation from SwiftUI to UIKit with a UIViewRepresentable to support annotation clustering - and it works beautifully. But how to subclass an MKAnnotationView (or MKMarkerAnnotationView <- the balloon) to enable selection and animation as in Apple Maps? MKMarkerAnnotationView only show balloon markers and I tried everything inside MKAnnotationView (CALayer, etc.)
1
0
410
Feb ’25
Toolbar symbol rendering does not behave as expected
Hello everyone, I've been having a bit of trouble with the .symbolRenderingMode(_:) modifier. When trying to apply it to a single button in a toolbar, it does not work at all. The symbol is always rendered as monochrome. However, I've realised that with this little hack I can achieve the expected results, but this is not ideal. .toolbar { HStack { Button("", action: {}) // The hack Button("Button", systemImage: "line.3.horizontal.decrease.circle.fill", action: {}) .symbolRenderingMode(.hierarchical) .foregroundStyle(.blue) } } I've submitted a bug report (FB16129223) but in the meantime, is this my only solution ? Side note: the foregroundStyle(_:) modifier is ignored as well.
1
0
417
Dec ’24
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
332
Jan ’25
What is the designated way to do custom background drawing in TextKit 2 when using UITextView/NSTextView?
In TextKit 1, I can override drawBackground(forGlyphRange:at:) in NSLayoutManager to do custom background drawing. However, I'm not too sure what the designated way of doing background drawing is in TextKit 2. One thing I've tried is to do custom drawing in my own CALayer that's used in the configureRenderingSurface delegate callback, but I'm unsure if we are suppose to use this API and steal the textViewportLayoutController.delegate away from _UITextLayoutcanvasView?
4
0
2.9k
Jan ’25
.sheet or .fullScreenSheet Looping when presenting Image Picker on visionOS
I am having issues with my app on visionOS. It works fine on iOS. The app is presenting a ImagePicker, I had tried converting to PhotoPicker and the behavior did not change. The relevant code is in the EditGreetingCardView - // // Created by Michael Rowe on 1/2/24. // import AVKit import SwiftData import SwiftUI struct EditGreetingCardView: View { @Environment(\.modelContext) private var modelContext @Environment(\.dismiss) private var dismiss @Query(sort: \EventType.eventName) private var events: [EventType] var greetingCard: GreetingCard? private var editorTitle: String { greetingCard == nil ? "Add Greeting Card" : "Edit Greeting Card" } @State var frontImageSelected: Image? = Image("frontImage") @State var sourceType: UIImagePickerController.SourceType = .photoLibrary @State var frontPhoto = false @State var captureFrontImage = false var eventTypePassed: EventType? @State private var eventType: EventType? @State private var cardName = "" @State private var cardManufacturer = "" @State private var cardURL = "" @State private var cardUIImage: UIImage? @State private var cameraNotAuthorized = false @State private var isCameraPresented = false @State private var newEvent = false @AppStorage("walkthrough") var walkthrough = 1 init(eventTypePassed: EventType?) { if let eventTypePassed { _eventType = .init(initialValue: eventTypePassed) } } init(greetingCard: GreetingCard?) { self.greetingCard = greetingCard _eventType = .init(initialValue: greetingCard?.eventType) } var body: some View { NavigationStack { Form { Section("Occasion") { Picker("Select Occasion", selection: $eventType) { Text("Unknown Occasion") .tag(Optional<EventType>.none) //basically added empty tag and it solve the case if events.isEmpty == false { Divider() ForEach(events) { event in Text(event.eventName) .tag(Optional(event)) } } } } .foregroundColor(Color("AccentColor")) Section("Card details") { } .foregroundColor(Color("AccentColor")) Section("Card Image") { HStack(alignment: .center){ Spacer() ZStack { Image(uiImage: cardUIImage ?? UIImage(named: "frontImage")!) .resizable() .aspectRatio(contentMode: .fit) .shadow(radius: 10 ) Image(systemName: "camera.fill") .foregroundColor(.white) .font(.largeTitle) .shadow(radius: 10) .frame(width: 200) .onTapGesture { self.frontPhoto = true } .actionSheet(isPresented: $frontPhoto) { () -> ActionSheet in #if !os(visionOS) ActionSheet( title: Text("Choose mode"), message: Text("Select one."), buttons: [ ActionSheet.Button.default(Text("Camera"), action: { checkCameraAuthorization() self.captureFrontImage.toggle() self.sourceType = .camera }), ActionSheet.Button.default(Text("Photo Library"), action: { self.captureFrontImage.toggle() self.sourceType = .photoLibrary }), ActionSheet.Button.cancel() ] ) #else ActionSheet( title: Text("Choose mode"), message: Text("Select one."), buttons: [ ActionSheet.Button.default(Text("Photo Library"), action: { self.captureFrontImage.toggle() self.sourceType = .photoLibrary }), ActionSheet.Button.cancel() ] ) #endif } .fullScreenCover(isPresented: $captureFrontImage) { #if !os(visionOS) ImagePicker( sourceType: sourceType, image: $frontImageSelected) .interactiveDismissDisabled(true) #else ImagePicker( image: $frontImageSelected) .interactiveDismissDisabled(true) #endif } } .frame(width: 250, height: 250) Spacer() } } } .alert(isPresented: $cameraNotAuthorized) { Alert( title: Text("Unable to access the Camera"), message: Text("To enable access, go to Settings > Privacy > Camera and turn on Camera access for this app."), primaryButton: .default(Text("Settings")) { openSettings() } , secondaryButton: .cancel() ) } .toolbar { } .onAppear { } .onChange(of: frontImageSelected) { oldValue, newValue in cardUIImage = newValue?.asUIImage() } } } }
Topic: UI Frameworks SubTopic: SwiftUI
2
0
278
Feb ’25
How to share 'back facing' iOS camera app at same time Eye Tracking app needs 'front facing' camera?
While using my xmas present of a new iPhone and iOS 18.2, I figured I'd try the Eye Tracker app. I've been working with clients successfully using Tobii and other existing eye trackers. In my limited tests, Apple has room for improvement. My main issue is with the camera app which cannot be used at the same time while using the Eye Tracker app. I get an error popup from Apple: Camera is use by another app The image below is from my app showing the popup message "Camera in use by another app", but the same error occurs on the installed camera app. This error is from Apple, not my app. For terminology: 'front' camera is the one pointing at the user (the selfi camera) while 'back' camera is the main one with multiple lenses. Eye tracking needs the 'front' camera. It seems when an app uses the camera, it takes over both the front and back facing cameras (since you might swap them). Thus another app, especially Eye Tracking, cannot use just the front facing camera at the same time. That limits use of Eye Tracking, in particular one cannot take pictures or click any buttons on an app that uses the camera. Anyone know of a way for an app to not take over both front and back cameras at the same time? If I can separate them, the Eye Tracker could use the front camera while the camera uses the back camera.
1
0
407
Jan ’25
TextField .alignmentGuide in Form leading point varies?
I have a Form with a custom TextField which uses a custom Text(). When I use .alignmentGuide on the Text() it seems the origin reference point varies with the length of, but not by the length of, the TextField label String. This is a problem when in a Form. My workaround has been to not use a TextField label but enclose the each TextField in a LabeledContent and then I can set the width of the label and align off of that. How does Form cause TextField to set it's width and why if using .alignmentGuide on Text() does the TextField label length even matter?
Topic: UI Frameworks SubTopic: SwiftUI
1
0
225
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
278
Jan ’25
How do I make a UIViewRepresentable beneath SwiftUI elements ignore touches to these elements?
Hello, and an early "Merry Christmas" to all, I'm building a SwiftUI app, and one of my Views is a fullscreen UIViewRepresentable (SpriteView) beneath a SwiftUI interface. Whenever the user interacts with any SwiftUI element, the UIView registers a hit in touchesBegan(). For example, my UIView has logic for pinching (not implemented via UIGestureRecognizer), so whenever the user holds down a SwiftUI element while touching the UIView, that counts as two touches to the UIView which invokes the pinching logic. Things I've tried to block SwiftUI from passing the gesture down to the UIView: Adding opaque elements beneath control elements Adding gestures to the elements above Adding gesture masks to the gestures above Converting eligible elements to Buttons (since those seem immune) Adding SpriteViews beneath those elements to absorb gestures So far nothing has worked. As long as the UIView is beneath SwiftUI elements, any interactions with those elements will be registered as a hit. The obvious solution is to track each SwiftUI element's size and coordinates with respect to the UIView's coordinate space, then use exclusion areas, but this is both a pain and expensive, and I find it hard to believe this is the best fix for such a seemingly basic problem. I'm probably overlooking something basic, so any suggestions will be greatly appreciated
0
0
434
Dec ’24
In iOS 18, UINavigationController continuously executes pushViewController, and the lifecycle method is not executed when the viewController enters the stack
let home = homeViewController() let rootNav = UINavigationController(rootViewController: home) window?.rootViewController = rootNav window?.makeKeyAndVisible() let second = SecondViewController() home.navigationController?.pushViewController(second, animated: false) let third = ThirdViewController() home.navigationController?.pushViewController(third, animated: false) After the above is executed, the viewdidload and other related lifecycle methods in the SecondViewController are not executed。 Except for iOS18, other versions don't have this problem, so it's not a bug in iOS18, or iOS18 has optimized UINavigationController
Topic: UI Frameworks SubTopic: UIKit
2
0
584
Jan ’25
INUIHostedViewControlling ViewController's Life Cycle Events not being Called
I am implementing a new Intents UI Extension and am noticing that the viewWillDisappear, viewDidDisappear, and deinit methods are not being called on my UIViewController that implements INUIHostedViewControlling, when pressing the "Done" button and dismissing the UIViewController. This causes the memory for the UI Extension to slowly increase each time I re-run the UI Extension until it reaches the 120MB limit and crashes. Any ideas as to what's going on here and how to solve this issue? Worth noting that while the memory does continuously increase on iOS versions before iOS 17, only in 17 and later does the 120MB memory limit kick in and crash the extension.
2
0
498
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
382
Jan ’25
iPad - Bluetooth Peripheral MTU No More Than 20 Bytes
All, Thanks in advance! I'm having a very hard time increasing the MTU to any value beyond 20. The research I've done states iOS 16.1 and beyond supports up to 512 bytes. Yet, the peripheral device will only read 20 bytes. It's to be noted that I'm using Expo SDK 51 Bare Workflow, and the react-native-ble-plx library. I have the app functioning as both Central and Peripheral on iOS 18.1 devices, and data is successfully being written and read to the characteristic. Because the Expo app is Bare Workflow, I'm able to make any configurations via Xcode, and if there is any patches needed to the react-native-ble-plx library, we have the architecture to support that too. I wanted to provide that context before being recommended to go to the Expo forums (which I have/will be). I also added the CoreBluetooth framework to the project in hopes that would overwrite the react-native-ble-plx imports, but I noticed react-native-ble-plx uses Swift while CoreBluetooth is Objective-C. Looking forward to your responses!
1
0
595
Jan ’25
SwiftUI Issues on iOS 16: App Freezes, Buttons Unresponsive, and Missing Data (Works Fine on iOS 17)
Hi everyone, I’m experiencing significant issues with my SwiftUI app when running on iOS 16. These issues are not present in iOS 17, where everything works as expected. I’m hoping someone can provide insights or suggestions on how to address these problems. The Problems App Freezing: In certain views, the app becomes completely unresponsive when running on iOS 16. There are no clear patterns or console logs pointing to the source of the freeze. Unresponsive Buttons: Buttons stop working in some views. Tapping them does nothing, even though the logic and bindings are correct. Missing Data: Data fetched from services (remote APIs) or local storage doesn’t show up in the UI. Expected Behavior The app should handle user interactions and display data correctly on both iOS 16 and iOS 17, without freezes or unresponsive elements. Environment: Xcode Version: Xcode 15.4 Deployment Target: iOS 16 Testing Devices: iPhone 14 with iOS 17.6.1, iPhone 13 with iOS 18.1.1, iPhone 8 with iOS 16.4, iPhone 12 with 16.4, iPhone 8 Plus with iOS 16.0, iPhone 8 Plus with 16.7.10
Topic: UI Frameworks SubTopic: SwiftUI
3
0
341
Jan ’25