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

How to animate `UIHostingController.view` frame when my View's size changes?
I have a UIHostingController on which I have set: hostingController.sizingOptions = [.intrinsicContentSize] The size of my SwiftUI content changes with animation (I update a @Published property on an ObservableObject inside a withAnimation block). However, I notice that my hostingController.view just jumps to the new frame without animating the change. Question: how can I animate the frame changes in UIHostingController that are caused by sizingOptions = [.intrinsicContentSize]
3
1
183
1w
how to custom DatePicker Label
I have a custom UI to display date (for user birthday) and want if the user presses each part of the label , the date selection is displayed, the current issue is , when I try to reduce the DatePicker opacity or set the colorMultipli to clear color, it still clickable on the date area, while my object is a fullWidth object, how can I fix it? This is the code: VStack(alignment: .leading, spacing: 8) { Text("Birthday") .font(.SFProText.font(type: .medium, size: 13)) .foregroundStyle(Color(uiColor: .label)) HStack(alignment: .center) { Text(userProfileAccountInfoviewModel.birthday.getShortFormat(format: "dd MMM yyyy")) .font(.SFProText.font(type: .medium, size: 13)) .foregroundColor(Color(uiColor: .label)) .padding(.horizontal, 13) Spacer() } .frame(height: 44) .contentShape(Rectangle()) .overlay { HStack { DatePicker(selection: $userProfileAccountInfoviewModel.birthday, displayedComponents: .date) {} .labelsHidden() .colorMultiply(.clear) .background(Color.clear) .foregroundStyle(Color.baseBackgroundSecondary) .frame(maxWidth: .infinity) .contentShape(Rectangle()) // .opacity(0.011) Spacer() } } .background(Color.baseBackgroundSecondary) .clipShape(RoundedRectangle(cornerRadius: 4)) }
1
0
249
1w
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
15
21
1.4k
1w
Cannot see appended AttributedString in NSTextView
When I appendAttributedString to [textView textStorage] it does not appear on the scrollable TextView. However when I NSLog the [textView textStorage] the Attributed string is outputted, and is therefore stored in the textView, see below. Occurs every time I ask to see the AttributedString I send to the textView. [textView textStorage] attributedString I need to see the attributedString displayed on the ScrollableTextView, but I don't know why I cannot see it.
2
0
382
1w
How to Center an App Icon Image Vertically in a UITableViewCell
Hello! I'm making a list of app icons for users to choose, but when I increase or decrease the font size, the image is still in the same spot and isn't centered vertically with the text. I have it initialized with a frame with hard-coded values, but I was wondering if there was a better way of doing it, such as with constraints or some sort of image scaling. I've provided code blocks and an image of what is happening. ImageView Configuration // App Icon Image UIImageView *appIconImageView = [[UIImageView alloc] initWithFrame: CGRectMake(12.5, 17, 22.5, 22.5)]; // Configurations UIImageSymbolConfiguration *multicolorConfiguration = [UIImageSymbolConfiguration configurationPreferringMulticolor]; UIImageSymbolConfiguration *sizeConfiguration = [UIImageSymbolConfiguration configurationWithScale: UIImageSymbolScaleSmall]; UIImageSymbolConfiguration *appIconConfiguration = [multicolorConfiguration configurationByApplyingConfiguration: sizeConfiguration]; appIconImageView.preferredSymbolConfiguration = appIconConfiguration; appIconImageView.contentMode = UIViewContentModeScaleAspectFill; self.appIconImage = appIconImageView; [appIconImageView release]; ImageView Constraints [self.appIconImage.firstBaselineAnchor constraintEqualToAnchor: self.contentView.firstBaselineAnchor constant: 5.0], [self.appIconImage.leadingAnchor constraintEqualToAnchor: self.contentView.layoutMarginsGuide.leadingAnchor], // Label [self.colorLabel.leadingAnchor constraintEqualToAnchor:self.appIconImage.trailingAnchor constant: 10], [self.colorLabel.trailingAnchor constraintEqualToAnchor:self.contentView.layoutMarginsGuide.trailingAnchor], [self.colorLabel.topAnchor constraintEqualToAnchor: self.contentView.layoutMarginsGuide.topAnchor], [self.colorLabel.bottomAnchor constraintEqualToAnchor: self.contentView.layoutMarginsGuide.bottomAnchor], Image
Topic: UI Frameworks SubTopic: UIKit Tags:
3
0
328
1w
Autofill Creditcard
We have a native iOS app built with UIKit, and we are experiencing issues with credit card autofill when using the keyboard Quick Type bar. We have reviewed the documentation on Associated Domains, but we haven’t found anything that specifically addresses our issue. Our goal is to autofill all credit card details-including the CVV-in a single step, rather than one field at a time
1
0
44
1w
Wrong position of searchable component on first render
Hey all, I found a weird behaviour with the searchable component. I created a custom bottom nav bar (because I have custom design in my app) to switch between screens. On one screen I display a List component with the searchable component. Whenever I enter the search screen the first time, the searchable component is displayed at the bottom. This is wrong. It should be displayed at the top under the navigationTitle. When I enter the screen a second time, everything is correct. This behaviour can be reproduced on all iOS 26 versions on the simulator and on a physical device with debug and release build. On iOS 18 everything works fine. Steps to reproduce: Cold start of the app Click on Search TabBarIcon (searchable wrong location) Click on Home TabBarIcon Click on Search TabBarIcon (searchable correct location) Simple code example: import SwiftUI struct ContentView: View { @State var selectedTab: Page = Page.main var body: some View { NavigationStack { ZStack { VStack { switch selectedTab { case .main: MainView() case .search: SearchView() } } VStack { Spacer() VStack(spacing: 0) { HStack(spacing: 0) { TabBarIcon(iconName: "house", selected: selectedTab == .main, displayName: "Home") .onTapGesture { selectedTab = .main } TabBarIcon(iconName: "magnifyingglass", selected: selectedTab == .search, displayName: "Search") .onTapGesture { selectedTab = .search } } .frame(maxWidth: .infinity) .frame(height: 55) .background(Color.gray) } .ignoresSafeArea(.all, edges: .bottom) } } } } } struct TabBarIcon: View { let iconName: String let selected: Bool let displayName: String var body: some View { ZStack { VStack { Image(systemName: iconName) .resizable() .renderingMode(.template) .aspectRatio(contentMode: .fit) .foregroundColor(Color.black) .frame(width: 22, height: 22) Text(displayName) .font(Font.system(size: 10)) } } .frame(maxWidth: .infinity) } } enum Page { case main case search } struct MainView: View { var body: some View { VStack { Image(systemName: "globe") .imageScale(.large) .foregroundStyle(.tint) Text("Hello, world!") } .padding() .navigationTitle("Home") } } struct SearchView: View { @State private var searchText = "" let items = [ "Apple", "Banana", "Pear", "Strawberry", "Orange", "Peach", "Grape", "Mango" ] var filteredItems: [String] { if searchText.isEmpty { return items } else { return items.filter { $0.localizedCaseInsensitiveContains(searchText) } } } var body: some View { List(filteredItems, id: \.self) { item in Text(item) } .navigationTitle("Fruits") .searchable(text: $searchText, placement: .navigationBarDrawer(displayMode: .always), prompt: "Search") } }
0
0
58
1w
USSD calls with * and # dont work iOS
I have an application that needs to make a USSD call, but on some devices the * and # don't work on the dialer, on others it does. if let phoneNumber = ussdNumberTextfield.text { let encoded = "telprompt:\(phoneNumber)".addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed)! if let url = URL(string: encoded) { if application.canOpenURL(url){ DispatchQueue.main.async { self.application.open(url, options: [:]) { success in } } } } }
5
0
1.3k
1w
CarPlay on iOS 14 and iOS 15
My app developed with the new Xcode 26 doesn't appear on CarPlay when running on iOS 14–15 devices. My developer has obtained the com.apple.developer.carplay-driving-task permission, but iOS 16+ devices allow my app to display on CarPlay. Can anyone help resolve this issue? Is it because the carplay-driving-task permission is only available for iOS 16+ devices? If I want compatibility with iOS 14–15 devices, do I need to apply to Apple for the carplay-audio permission to use it? Has anyone encountered a similar issue? Thanks!
1
0
84
1w
UICollectionViewCell context menu is clipped when long-pressing a view using UIGlassEffect (iOS 26)
Description I am seeing inconsistent clipping behavior in UICollectionViewCell when presenting a context menu by long press on a subview that uses UIGlassEffect. Summary of behavior: Long-pressing a normal view inside a UICollectionViewCell presents the menu correctly (no clipping). Long-pressing a view wrapped in UIVisualEffectView using UIGlassEffect causes the sub-view with glass effect to be clipped at the cell’s bounds. clipsToBounds = false is set on: the cell the cell’s contentView This behavior is reproducible and appears to be specifically related to UIGlassEffect.
1
0
136
1w
How to set custom height for keyboard extension without resize flicker?
Description I'm developing a custom keyboard extension using UIInputViewController and need to set a specific height of 268 points. The keyboard functions correctly, but there's a visible flicker and resize animation during launch that I cannot eliminate. The Problem When the keyboard launches, iOS provides incorrect heights before settling on the correct one. At launch, the view starts at 0×0. Around 295ms later, iOS sets the frame to 440×956 which is full screen height and wrong. Around 373ms, iOS changes it to 440×452 which is still wrong. Finally around 390ms, iOS settles at 440×268 which matches our constraint. This causes visible flicker as the view resizes three times rapidly. The keyboard appears to shrink from full screen down to the correct height, and users can clearly see this animation happening. What I've Tried I've tried adding a height constraint on self.view which gives me the correct height but causes the visible flicker. I created a custom UIInputView subclass and overrode intrinsicContentSize to return my desired height. iOS completely ignores this and gives random heights like 471pt, 680pt, or 956pt instead. I set allowsSelfSizing to true on my UIInputView subclass. iOS ignores this property. I set preferredContentSize on the view controller. iOS ignores this as well. I tried adding the constraint in viewDidAppear instead of viewDidLoad, thinking iOS might have settled by then. It still causes flicker. I overrode the frame and bounds setters on my UIInputView to clamp the height to my desired value. iOS bypasses these overrides somehow. I overrode layoutSubviews to force the correct height after the super call. iOS still applies its own height. Specific Question What is the correct API or technique to specify a keyboard extension's height that iOS will respect immediately upon launch, without triggering the resize animation sequence? Other third-party keyboards like Grammarly and SwiftKey appear to have solved this problem. Their keyboards appear at the correct height without any visible flicker. How do they achieve this? Expected Outcome The keyboard should appear at 268pt height on the first frame with no visible resize animation. Steps to Reproduce Create a new iOS App project in Xcode and add a Keyboard Extension target. In KeyboardViewController.swift, add a height constraint in viewDidLoad: override func viewDidLoad() { super.viewDidLoad() let heightConstraint = view.heightAnchor.constraint(equalToConstant: 268) heightConstraint.priority = .defaultHigh heightConstraint.isActive = true let label = UILabel() label.text = "Demo Keyboard" label.textAlignment = .center label.translatesAutoresizingMaskIntoConstraints = false view.addSubview(label) NSLayoutConstraint.activate([ label.centerXAnchor.constraint(equalTo: view.centerXAnchor), label.centerYAnchor.constraint(equalTo: view.centerYAnchor) ]) } Build and run on a physical device. Enable the keyboard in Settings, then General, then Keyboard, then Keyboards. Open any app with a text field and switch to the custom keyboard using the globe button. Observe the height changing from around 956pt to 452pt to 268pt with visible animation. Environment iOS 17 and iOS 18 and 26.2, Xcode 16 and Xcode 26, affects all iPhone models tested, reproducible on both simulator and physical device.
0
2
83
1w
CoreAutoLayout -[NSISEngine _flushPendingRemovals] crash
crash stack: Crashed: com.apple.main-thread 0 libsystem_pthread.dylib 0x90c thread_chkstk_darwin + 60 1 libsystem_pthread.dylib 0x90c ___chkstk_darwin + 60 2 CoreAutoLayout 0x14c4 -[NSISEngine _flushPendingRemovals] + 56 3 CoreAutoLayout 0x2de08 -[NSISEngine _coreReplaceMarker:withMarkerPlusDelta:].cold.1 + 64 4 CoreAutoLayout 0x15d78 -[NSISEngine _coreReplaceMarker:withMarkerPlusDelta:] + 204 5 CoreAutoLayout 0x2ce38 -[NSISEngine constraintDidChangeSuchThatMarker:shouldBeReplacedByMarkerPlusDelta:] + 108 6 CoreAutoLayout 0x15f1c -[NSISEngine tryToChangeConstraintSuchThatMarker:isReplacedByMarkerPlusDelta:undoHandler:] + 100 7 CoreAutoLayout 0x2fdbc -[NSLayoutConstraint _tryToChangeContainerGeometryWithUndoHandler:] + 252 8 CoreAutoLayout 0x3020c -[NSLayoutConstraint _setSymbolicConstant:constant:symbolicConstantMultiplier:] + 452 9 CoreAutoLayout 0x30378 -[NSLayoutConstraint setConstant:] + 84 10 UIKitCore 0x51c3c __74-[UIView(UIConstraintBasedLayout) _autoresizingConstraints_frameDidChange]_block_invoke + 140 11 UIKitCore 0x1841174 -[UIView(AdditionalLayoutSupport) _withUnsatisfiableConstraintsLoggingSuspendedIfEngineDelegateExists:] + 112 12 UIKitCore 0x51b28 -[UIView(UIConstraintBasedLayout) _autoresizingConstraints_frameDidChange] + 452 13 UIKitCore 0x2c894 -[UIView _constraints_frameDidChange] + 100 14 UIKitCore 0x18fac08 -[UIView(Geometry) setFrame:] + 576 15 UIKitCore 0x96712c -[UITabBar setFrame:] + 128 16 UIKitCore 0x1666f4 -[_UITabBarControllerVisualStyle updateTabBarLayout] + 360 17 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 18 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 19 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 20 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 21 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 22 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 23 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 24 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 25 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 26 UIKitCore 0x16671c -[_UITabBarControllerVisualStyle updateTabBarLayout] + 400 27 UIKitCore 0x16642c -[UITabBarController _prepareTabBar] + 128 28 UIKitCore 0x166a10 -[UITabBarController _layoutContainerView] + 376 29 UIKitCore 0x1677a8 -[UITabBarController __viewWillLayoutSubviews] + 28 30 UIKitCore 0x147078 -[UILayoutContainerView layoutSubviews] + 176 31 UIKit 0xb14a0 -[UILayoutContainerViewAccessibility layoutSubviews] + 60 for a more detail crash stack, can see attach file: crash.txt crash probabilistic happed after app enter background, and our app support landscape, when crash appear, the system method: /* This method is called when the view controller's view's size is changed by its parent (i.e. for the root view controller when its window rotates or is resized). If you override this method, you should either call super to propagate the change to children or manually forward the change to children. */ - (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id <UIViewControllerTransitionCoordinator>)coordinator API_AVAILABLE(ios(8.0)); is called; but for a normal not crash case, when enter background and rotate device, the viewWillTransitionToSize method is not called until app enter foreground; Are there any suggestions that can help solve this problem, thank you.
2
0
267
1w
Popover in Toolbar Causes Crash in Catalyst App on macOS 26
Hi everyone, I’ve encountered an issue where using a popover inside the toolbar of a Catalyst app causes a crash on macOS 26 beta 5 with Xcode 26 beta 5. Here’s a simplified code snippet: import SwiftUI struct ContentView: View { @State private var isPresentingPopover = false var body: some View { NavigationStack { VStack { } .padding() .toolbar { ToolbarItem { Button(action: { isPresentingPopover.toggle() }) { Image(systemName: "bubble") } .popover(isPresented: $isPresentingPopover) { Text("Hello") .font(.largeTitle) .padding() } } } } } } Steps to reproduce: Create a new iOS app using Xcode 26 beta 5. Enable Mac Catalyst (Match iPad). Add the above code to show a Popover from a toolbar button. Run the app on macOS 26, then click the toolbar button. The app crashes immediately upon clicking the toolbar button. Has anyone else run into this? Any workarounds or suggestions would be appreciated! Thanks!
5
1
235
1w
SwiftUI iOS 26 .safeAreaBar issue with large navigation title
I have some really straight forward code in a sample project. For some reason when the app launches the title is blurred obscured by scrolledgeeffect blur. If I scroll down the title goes small as it should do and all looks fine. If I scroll back to the top, just before it reaches the top the title goes large and it looks correct, but once it actually reaches/snaps to the top, is then incorrectly blurs again. Is there anything obvious I'm doing wrong? Is this a bug? struct ContentView: View { var body: some View { NavigationStack { ScrollView { VStack { Rectangle().fill(Color.red.opacity(0.2)).frame(height: 200) Rectangle().frame(height: 200) Rectangle().frame(height: 200) Rectangle().frame(height: 200) Rectangle().frame(height: 200) } } .safeAreaBar(edge: .top) { Text("Test") } .navigationTitle(Title") } } }
4
1
392
1w
How to implement bullet and numbered list functionality in ios26 attributed string text editor
I'm looking to support toggleable bullet and numbered lists in my IOS 26 app. currently my text editor looks like this @Binding var text: AttributedString var requestFocus: Bool = false @State private var selection = AttributedTextSelection() @FocusState private var isFocused: Bool var body: some View { TextEditor(text: $text, selection: $selection) .scrollContentBackground(.hidden) .background(Color.clear) .focused($isFocused) .safeAreaInset(edge: .bottom) { if isFocused { FormattingToolbar(text: $text, selection: $selection) .padding(.horizontal) .padding(.vertical, 8) .background(Color(UIColor.systemBackground)) } } .onChange(of: requestFocus) { _, newValue in if newValue { isFocused = true } } } } i cant find any useful docs on how to best implement this. anything helps, thanks
Topic: UI Frameworks SubTopic: SwiftUI
3
0
158
1w
Animation Help
Hello, I am trying to use matchedGeometryEffect to animate between an item in a list view and the item's detail view. Right now, I am getting an unwanted cross-fade animation as the view transitions. So the list item moves into place as it should with the modifier, but it fades out as its detail version fades in, which I do not want. I do not want any fading at all, just the movement from one component to the other. How do I stop this? Thanks.
2
0
66
1w
UIKit equivalent of SwiftUI .tabRole(.search)?
In SwiftUI, iOS 18+ provides a dedicated Search tab role: Tab(value: .search, role: .search) { Text("This view is intentionally blank") } This displays Search as a separate tab bar item/slot. Is there an official UIKit equivalent for UITabBarController / UITabBarItem? If not, what is Apple’s recommended UIKit approach to achieve the same UX?
Topic: UI Frameworks SubTopic: UIKit
1
0
124
1w
Picker style .menu doesn't handle nil
Here's the code... import SwiftUI enum Side: String { case left case right } struct SideView: View { @State private var name: String = "" @State private var side: Side? = nil var body: some View { NavigationStack { Form { Section { TextField("Name", text: $name) Picker("Side", selection: $side) { Text("Left").tag(Side.left as Side?) Text("Right").tag(Side.right as Side?) } .pickerStyle(.menu) // displays with "Left" selected even though side is nil // .pickerStyle(.inline) // all the other styles work as expected, nothing initially selected // .pickerStyle(.palette) // .pickerStyle(.navigationLink) } } } } } #Preview("SideView") { SideView() } Even though side is nil the .menu style displays with "Left" selected. Try any of the other styles. They all display with nothing initially selected. As they should when side is nil. This seems like a bug and I've submitted feedback. ID: FB21685273 Whether it's a bug or not has anyone worked around this?
Topic: UI Frameworks SubTopic: SwiftUI
1
0
114
1w