Explore the various UI frameworks available for building app interfaces. Discuss the use cases for different frameworks, share best practices, and get help with specific framework-related questions.

All subtopics
Posts under UI Frameworks topic

Post

Replies

Boosts

Views

Activity

SwiftUI and UIImage memory leak
I’m experiencing significant performance and memory management issues in my SwiftUI application when displaying a large number of images using LazyVStack within a ScrollView. The application uses Swift Data to manage and display images. Here’s the model I’m working with: @Model final class Item { var id: UUID = UUID() var timestamp: Date = Date.now var photo: Data = Data() init(photo: Data = Data(), timestamp: Date = Date.now) { self.photo = photo self.timestamp = timestamp } } extension Item: Identifiable {} The photo property is used to store images. However, when querying Item objects using Swift Data in a SwiftUI ScrollView, the app crashes if there are more than 100 images in the database. Scrolling down through the LazyVStack loads all images into memory leading to the app crashing when memory usage exceeds the device’s limits. Here’s my view: A LazyVStack inside a ScrollView displays the images. struct LazyScrollView: View { @Environment(\.modelContext) private var modelContext @State private var isShowingPhotosPicker: Bool = false @State private var selectedItems: [PhotosPickerItem] = [] @Query private var items: [Item] var body: some View { NavigationStack { ScrollView { LazyVStack { ForEach(items) { item in NavigationLink { Image(uiImage: UIImage(data: item.photo)!) .resizable() .scaledToFit() } label: { Image(uiImage: UIImage(data: item.photo)!) .resizable() .scaledToFit() } } } } .navigationTitle("LazyScrollView") .photosPicker(isPresented: $isShowingPhotosPicker, selection: $selectedItems, maxSelectionCount: 100, matching: .images) .onChange(of: selectedItems) { Task { for item in selectedItems { if let data = try await item.loadTransferable(type: Data.self) { let newItem = Item(photo: data) modelContext.insert(newItem) } } try? modelContext.save() selectedItems = [] } } } } } Based on this: How can I prevent SwiftUI from loading all the binary data (photo) into memory when the whole view is scrolled until the last item? Why does SwiftUI not free memory from the images that are not being displayed? Any insights or suggestions would be greatly appreciated. Thank you! I will put the full view code in the comments so anyone can test if needed.
2
0
700
Jan ’25
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
288
Feb ’25
How to remove margins around built-in views?
I want to have my own background and foreground colors for some views and I am having a bit of trouble. I cannot figure out how to remove the margins around some built-in views. One example is below. The ScrollView portion is always black or white, depending on whether I am I dark mode or not. I've added various colors and borders to see what is going on below. I've also tried adding the modifiers to the Scroll View rather than the TextEditor and it doesn't work at all. If I don't have the .frame modifier on the ScrollView, the TextEditor moves to the top of its frame for some reason. I've played with .contentMargins, .edgeInsets, etc. with no luck How do I get the TextEditor to fill the entire ScrollView without the margin? Thanks! import SwiftUI struct TextEditorView: View { @Binding var editString: String var numberOfLines: Int var lineHeight: CGFloat { UIFont.preferredFont(forTextStyle: .body).lineHeight } var viewHeight: CGFloat { lineHeight * CGFloat(numberOfLines) + 8 } var body: some View { ScrollView([.vertical], showsIndicators: true) { TextEditor(text: $editString) .border(Color.red, width: 5) .foregroundStyle(.yellow) .background(.blue) .frame(minHeight:viewHeight, maxHeight: viewHeight) .scrollContentBackground(.hidden) } .frame(minHeight:viewHeight, maxHeight: viewHeight) } }
0
0
198
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
336
Feb ’25
Variable modification in forEach
Hi! I'm trying to do a forEach loop on an array of objects. Here's my code : ForEach($individus) { $individu in if individu.reussite == true { individu.score -= 10 } else { individu.score = (individu.levees * 10) + 20 + individu.score } } I have an error on the code in the 'if' saying that "Type '()' cannot conform to 'View'", but I have no idea on how solving this problem.
Topic: UI Frameworks SubTopic: SwiftUI
2
0
261
Jan ’25
`Text` (Label) text color issue during app resuming from suspended (changes from black to light or vice versa, depending on current appearance mode).
Its important to note that this same app did not have this issue in iOS 17. Ever since iOS 18 I have noticed that when application written in SwiftUI uses Label with the default color (which auto changes between light and dark appearance), from time to time when resuming an application that has been in the background, the color of those labels (only the Label elements) switches from the opposite to the correct one. Here is an example: Steps to reproduce Phone is in dark appearance Open app Labels text color is white and labels background is black Go to home so that app is on background Wait random time (does not happen all the time), some times 1 min some times 10 Reopen the application. During the opening transition the Label text color was changed while the app was in suspended mode to the light appearance variant (black) Once the app opening transition finishes the Label text color switches back to the correct color for dark appearance (white) Same issue happens if you start from light appearance. I cannot reproduce this on Xcode simulators, I have tried to force memory warning to check if that has anything to do with it but that also does not cause the issue to appear on simulators. For now I can only reproduce this on real device. Screenshots Here is screenshots of the above example: During transition After transition
Topic: UI Frameworks SubTopic: SwiftUI
4
0
397
Feb ’25
UICalendarView with decorations - change day height
Is there any way to change the height of the "day" cells in the UICalendarView? The view is very tall on the screen and I'd like to shorten it so I can put more content below it without using a scroll view. I'm using SwiftUI with a UICalendarView with UIViewRepresentable. The calendar will have default decorations to indicate a date with events.
Topic: UI Frameworks SubTopic: SwiftUI
0
0
209
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
282
Jan ’25
How to initialize @Observable object in View via @State?
When I switched to observable, I noticed a strange behavior of the ViewModel. The ViewModel is created 3x times. And my question is: How to properly initialize the ViewModel via state? Below is a minimal example with log output: ViewModel INIT : EBBB2C41 ViewModel INIT : D8E490DA ViewModel INIT : 54407300 ViewModel DEINIT: D8E490DA @Observable final class ViewModel { @ObservationIgnored let idd: UUID init() { idd = UUID() print("ViewModel INIT : \(idd.uuidString.prefix(8))") } deinit { print("ViewModel DEINIT: \(idd.uuidString.prefix(8))") } } struct SimpleView: View { @Environment(ViewModel.self) private var viewModel var body: some View { @Bindable var viewModel = viewModel Text("SimpleView: \(viewModel.idd.uuidString.prefix(8))") } } struct ContentView: View { @State private var viewModel = ViewModel() var body: some View { SimpleView() .environment(mainViewModel) } }
1
0
435
Feb ’25
SwiftUI - Drag gesture blocks scroll gesture only on iPhone 11
I'm pretty new to Swift and SwiftUI. I'm making my first app for sorting a gallery with some extra features. I was using my own iPhone for testing and just started testing my app on other Apple products. Everything works fine on iPad Air M1, iPhone 15 Pro, iPhone 15 Pro Max, iPhone 13, iPhone XS (Simulator), and iPhone 11 Pro (Simulator). However, when I tried to show my app to a family member with an iPhone 11, I came across an issue. Issue Description: My app takes all photos from iPhone's native gallery, then you can sort it by some spesific filters and delete pictures. It just looks like the native gallery. (I can add photos later if needed) You can just scroll the gallery by swiping up and down. You can press the select button and start selecting pictures to delete. I recently added a drag-to-select-multiple-pictures feature. This makes it feel more like the native iOS experience, eliminating the need to tap each picture individually. However, on the iPhone 11, the moment you open the app, you can't scroll. Scrolling is completely locked. You can still select pictures by tapping or dragging, so it's not a touch area issue. The same issue persists on the iPhone 11 simulator. And I think I found the problematic part in my (sadly messy) ContentView.swift file; ScrollView { RefreshControl(coordinateSpace: .named("refresh")) { await viewModel.refreshMediaItems() } LazyVGrid(columns: gridColumns, spacing: UIDevice.current.userInterfaceIdiom == .pad ? 12 : 4) { let items = viewModel.filteredItems(typeFilter: mediaTypeFilter, specialFilter: specialFilter) ForEach(Array(zip(items.indices, items)), id: \.1.id) { index, item in MediaThumbnailView( item: item, isSelected: selectedItems.contains(item.id), viewModel: viewModel, onLongPress: { if !isSelectionMode { toggleSelectionMode() selectedItems.insert(item.id) } }, onTap: { if isSelectionMode { toggleSelection(item: item) } else { viewModel.selectItem(item) } } ) .aspectRatio(1, contentMode: .fit) .background( GeometryReader { geometry in let frame = geometry.frame(in: .named("grid")) Color.clear.preference( key: ItemBoundsPreferenceKey.self, value: [ItemBounds(id: item.id, bounds: frame, index: index)] ) } ) } } .padding(.horizontal, 2) .coordinateSpace(name: "grid") .onPreferenceChange(ItemBoundsPreferenceKey.self) { bounds in itemBounds = Dictionary(uniqueKeysWithValues: bounds.map { ($0.id, $0) }) itemIndices = Dictionary(uniqueKeysWithValues: bounds.map { ($0.id, $0.index) }) } .gesture( DragGesture(minimumDistance: 0) .onChanged { gesture in if isSelectionMode { let location = gesture.location if !isDragging { startDragging(at: location, in: itemBounds) } updateSelection(at: location, in: itemBounds) } } .onEnded { _ in endDragging() } ) } .coordinateSpace(name: "refresh") } you can see the .gesture(.... part. I realised that this DragGesture and ScrollView blocks each other (somehow only on iPhone 11) highPriorityGesture also won't work. When I change it with simultaneousGesture, scroll starts to work again. BUT - since it's simultaneous, when multiple selection mode is activated, when I'm dragging my finger gallery also starts to scroll and it becomes a very unpleasant experience. After this issue I realised on native gallery iOS locks scroll when you are dragging for multiple selection and just when you release your finger you can scroll again even if the multiple selection mode is active. I tried a million things, asked claude, chatgpt etc. etc. Found some similar issues on stackoverflow but they were all related to iOS 18, not spesific to an iPhone. My app works fine on iOS 18 (15 Pro Max) iOS 18 drag gesture blocks scrollview Here are the some of the things I've tried: using highPriorityGesture and simultenousgesture together, tried to lock the scroll briefly while dragging, implement much complicated versions of these things with the help of claude, try to check if isSelectionMode is true or not All of them broke other things/won't work. Probably there's something pretty simple that I'm just missing; but iPhone 11 being the single problematic device confuses me. I don't want to mess too much with my already fragile logic.
1
0
797
Jan ’25
How to return a UIMenu for read-only UITextView
I have a UITextView being added at runtime to a UIImageView as the result of doing text recognition. It's set to be editable = NO and selectable = YES. When I set the text and select it, it asks the delegate for the menu to display via: textView:editMenuForTextInRange:suggestedActions: The suggested items contains many UIAction and UICommand objects that have private methods or do not have the destructive attribute set, yet they are destructive. Some of these are: promptForReplace: transliterateChinese: _insertDrawing: _showTextFormattingOptions: I need to return a menu that has only non-destructive commands in it. First, why isn't UITextView sending only non-destructive suggested commands when its editable is NO? Second, how can I filter the array of suggested commands when it's impossible to know if they're destructive (as some are missing that attribute)? In addition to that, even non-destructive commands are causing an unrecognized selector exception, such as the Speak command, which it is sending to my view controller instead of to the UITextView, which is the only thing that knows what the text is that it should speak.
Topic: UI Frameworks SubTopic: UIKit
0
0
181
Feb ’25
Monintoring Picture in Picture is hide in Device Edge.
I am developing a custom Picture in Picture (PiP) app that plays videos. The video continues to play even when the app goes to the background, but I would like to be able to get the bool value when the PiP is hidden on the edge, as shown in the attached image. The reason why we need this is because we don't want the user to consume extra network bandwidth, so we want to pause the video when the PiP is hidden on the edge of the screen. Please let me know if this is possible. This can be done in the foreground or in the background.
1
0
345
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
354
Jan ’25
How does the widget in iOS17 configure this kind of page?
I tried to use AppIntentConfiguration in iOS17 to fail to achieve such a dynamic configuration. code: struct ConfigurationAppIntent: WidgetConfigurationIntent {     static var title: LocalizedStringResource { "位置" }     static var description: IntentDescription { "选择位置以展示城市天气" }     @Parameter(title: "Select City", optionsProvider: CityOptionsProvider())     var selectedCity: String? }
Topic: UI Frameworks SubTopic: SwiftUI
0
0
168
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
192
Feb ’25
Confusion about units for new WeatherKit visibility items
I am really confused by some of the new data returned in WeatherKit for iOS 18. The visibility (of an object) was already being returned in HourWeather as a Measurement. iOS 18 added max/min visibility (of terrain) in DayWeather. BUT instead of a Measurement it's just a Double. HourWeather: /// The distance at which an object can be clearly seen. /// /// The amount of light and weather conditions like fog, mist, and smog affect visibility. public var visibility: Measurement<UnitLength> DayWeather's comment: /// The maximum distance at which terrain is visible for the day. /// /// The amount of light, and weather conditions like fog, mist, and smog affect visibility. @available(iOS 18.0, macOS 15.0, tvOS 18.0, watchOS 11.0, visionOS 2.0, *) public var maximumVisibility: Double This makes it sound like the new items are also a distance and not a percentage. Why wasn't Measurement used so the unit would be clear? Documentation doesn't explain this either. I'm hoping that this isn't being returned in the unit used by the current locale because my app lets you specify what unit to use for temperature, length, etc regardless of locale. Since all the temperature, length, etc data returned had used Measurement that was possible. The iOS weather app refers to the lowest/highest visibility in my preferred unit, which is miles.
1
0
412
Jan ’25
iOS Architecture Research - Help a student
Hi everyone! I'm thrilled to share that I'm conducting a field research as part of my final university project, focused on iOS architecture. The goal is to dive deeper into the best practices, challenges, and trends in the iOS development world. To make this research truly impactful, I need your help! If you're an iOS developer, I’d love it if you could take a few minutes to answer a short survey. Your insights and experiences will be invaluable for my research, and I greatly appreciate your support! Here is the link: https://docs.google.com/forms/d/e/1FAIpQLSdf9cacfA7my1hnlazyl7uJraa2oTsQ7dJBWvFtZ_4vbYenRA/viewform?usp=send_form Thank you so much in advance for helping me out—feel free to share this post with others who might also be interested. Let’s build something amazing together! 💡✨
0
0
318
Feb ’25
iPhone mirroring and controlling
One of my clients is interested in developing a system similar to BrowserStack for internal team usage. Could you please guide me on how to approach the development of this system? Specifically, the project requires: Full iPhone screen recording. Capturing and executing click events on the iPhone. Do I need to obtain permission from Apple for these functionalities?
0
0
377
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
273
Feb ’25