I would like to have different fill colors in my chart. What I want to achieve is that if the values drop below 0 the fill color should be red. If they are above the fill color should be red. My code looks as follows:
import SwiftUI
import Charts
struct DataPoint: Identifiable {
let id: UUID = UUID()
let x: Int
let y: Int
}
struct AlternatingChartView: View {
enum Gradients {
static let greenGradient = LinearGradient(gradient: Gradient(colors: [.green, .white]), startPoint: .top, endPoint: .bottom)
static let blueGradient = LinearGradient(gradient: Gradient(colors: [.white, .blue]), startPoint: .top, endPoint: .bottom)
}
let data: [DataPoint] = [
DataPoint(x: 1, y: 10),
DataPoint(x: 2, y: -5),
DataPoint(x: 3, y: 20),
DataPoint(x: 4, y: -8),
DataPoint(x: 5, y: 15),
]
var body: some View {
Chart {
ForEach(data) { data in
AreaMark(
x: .value("Data Point", data.x),
y: .value("amount", data.y))
.interpolationMethod(.catmullRom)
.foregroundStyle(data.y < 0 ? Color.red : Color.green)
LineMark(
x: .value("Data Point", data.x),
y: .value("amount", data.y))
.interpolationMethod(.catmullRom)
.foregroundStyle(Color.black)
.lineStyle(StrokeStyle.init(lineWidth: 4))
}
}
.frame(height: 200)
}
}
#Preview {
AlternatingChartView()
}
The result looks like this:
I also tried using
foregroundStyle(by:)
and
chartForegroundStyleScale(_:)
but the result was, that two separate areas had been drawn. One for the below and one for the above zero datapoints.
So, what would be the right approach to have two different fill colors?
SwiftUI
RSS for tagProvide views, controls, and layout structures for declaring your app's user interface using SwiftUI.
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
Applying glass effect, providing a shape isn't resulting in the provided shape rendering the interaction correctly.
.glassEffect(.regular.tint(Color(event.calendar.cgColor)).interactive(), in: .rect(cornerRadius: 20))
results in properly drawn view but interactive part of it is off. light and shimmer appear as a capsule within the rect.
The example code below shows what I am trying to achieve: When the user types a '*', it should be replaced with a '×'.
It looks like it works, but the cursor position is corrupted, even though it looks OK, and the diagnostics that is printed below shows a valid index. If you type "12*34" you get "12×43" because the cursor is inserting before the shown cursor instead of after.
How can I fix this?
struct ContentView: View {
@State private var input: String = ""
@State private var selection: TextSelection? = nil
var body: some View {
VStack {
TextField("Type 12*34", text: $input, selection: $selection)
.onKeyPress(action: {keyPress in
handleKeyPress(keyPress)
})
Text("Selection: \(selectionAsString())")
}.padding()
}
func handleKeyPress(_ keyPress: KeyPress) -> KeyPress.Result {
if (keyPress.key.character == "*") {
insertAtCursor(text: "×")
moveCursor(offset: 1)
return KeyPress.Result.handled
}
return KeyPress.Result.ignored
}
func moveCursor(offset: Int) {
guard let selection else { return }
if case let .selection(range) = selection.indices {
print("Moving cursor from \(range.lowerBound)")
let newIndex = input.index(range.lowerBound, offsetBy: offset, limitedBy: input.endIndex)!
let newSelection : TextSelection.Indices = .selection(newIndex..<newIndex)
if case let .selection(range) = newSelection {
print("Moved to \(range.lowerBound)")
}
self.selection!.indices = newSelection
}
}
func insertAtCursor(text: String) {
guard let selection else { return }
if case let .selection(range) = selection.indices {
input.insert(contentsOf: text, at: range.lowerBound)
}
}
func selectionAsString() -> String {
guard let selection else { return "None" }
switch selection.indices {
case .selection(let range):
if (range.lowerBound == range.upperBound) {
return ("No selection, cursor at \(range.lowerBound)")
}
let lower = range.lowerBound.utf16Offset(in: input)
let upper = range.upperBound.utf16Offset(in: input)
return "\(lower) - \(upper)"
case .multiSelection(let rangeSet):
return "Multi selection \(rangeSet)"
@unknown default:
fatalError("Unknown selection")
}
}
}
Topic:
UI Frameworks
SubTopic:
SwiftUI
How to achieve the same navigation bar style as in the Design foundations from idea to interface - WWDC25 video?
Screenshot: https://imgur.com/a/huzsm1H
There's no new navigationBarTitleDisplayMode that has action buttons aligned with the title.
I'm trying to make a Swift Chart where 24 AreaMarks an hour apart on X axis over a day display a vertical gradient.
The gradient is vertical and is essentially [Color.opacity(0.1),Colour,Color.opacity(0.1]
The idea here is where the upper and lower points of each AreaMark are the same or close to each other in the Y axis, the chart essentially displays a line, where they are far apart you get a nice fading vertical gradient.
However, it seems that the .alignsMarkStylesWithPlotArea modifier is always set for AreaMarks even if manually applying it false.
Investigating further, I've learnt that with AreaMarks in a series, Swift Charts seems to only listen to the first foreground style set in. I've created some sample code to demonstrate this.
struct DemoChartView: View {
var body: some View {
Chart {
AreaMark(x: .value("Time", Date().addingTimeInterval(0)), yStart: .value("1", 40), yEnd: .value("2", 60))
.foregroundStyle(LinearGradient(colors: [.pink, .teal], startPoint: .top, endPoint: .bottom))
.alignsMarkStylesWithPlotArea(false)
AreaMark(x: .value("Time", Date().addingTimeInterval(3600)), yStart: .value("1", 44), yEnd: .value("2", 58))
.foregroundStyle(LinearGradient(colors: [.orange, .yellow], startPoint: .top, endPoint: .bottom))
.alignsMarkStylesWithPlotArea(false)
AreaMark(x: .value("Time", Date().addingTimeInterval(03600*2)), yStart: .value("1", 50), yEnd: .value("2", 90))
.foregroundStyle(LinearGradient(colors: [.green, .blue], startPoint: .top, endPoint: .bottom))
.alignsMarkStylesWithPlotArea(false)
}
}
}
Which produces this:
So here, all the different .foregroundStyle LinearGradients are being ignored AND the .alignsMarkStylesWithPlotArea(false) is also ignored - the amount of pink on the first mark is different to the second and third 🤷♂️
Has anyone encountered this. Are AreaMarks the correct choice or are they just not setup to create this type of data display. Thanks
I'm implementing infinite scrolling with Swift Charts where additional historical data loads when scrolling near the beginning of the dataset. However, when new data is loaded, the chart's scroll position jumps unexpectedly.
Current behavior:
Initially loads 10 data points, displaying the latest 5
When scrolling backwards with only 3 points remaining off-screen, triggers loading of 10 more historical points
After loading, the scroll position jumps to the 3rd position of the new dataset instead of maintaining the current view
Expected behavior:
Scroll position should remain stable when new data is loaded
User's current view should not change during data loading
Here's my implementation logic using some mock data:
import SwiftUI
import Charts
struct DataPoint: Identifiable {
let id = UUID()
let date: Date
let value: Double
}
class ChartViewModel: ObservableObject {
@Published var dataPoints: [DataPoint] = []
private var isLoading = false
init() {
loadMoreData()
}
func loadMoreData() {
guard !isLoading else { return }
isLoading = true
let newData = self.generateDataPoints(
endDate: self.dataPoints.first?.date ?? Date(),
count: 10
)
self.dataPoints.insert(contentsOf: newData, at: 0)
self.isLoading = false
print("\(dataPoints.count) data points.")
}
private func generateDataPoints(endDate: Date, count: Int) -> [DataPoint] {
var points: [DataPoint] = []
let calendar = Calendar.current
for i in 0..<count {
let date = calendar.date(
byAdding: .day,
value: -i,
to: endDate
) ?? endDate
let value = Double.random(in: 0...100)
points.append(DataPoint(date: date, value: value))
}
return points.sorted { $0.date < $1.date }
}
}
struct ScrollableChart: View {
@StateObject private var viewModel = ChartViewModel()
@State private var scrollPosition: Date
@State private var scrollDebounceTask: Task<Void, Never>?
init() {
self.scrollPosition = .now.addingTimeInterval(-4*24*3600)
}
var body: some View {
Chart(viewModel.dataPoints) { point in
BarMark(
x: .value("Time", point.date, unit: .day),
y: .value("Value", point.value)
)
}
.chartScrollableAxes(.horizontal)
.chartXVisibleDomain(length: 5 * 24 * 3600)
.chartScrollPosition(x: $scrollPosition)
.chartXScale(domain: .automatic(includesZero: false))
.frame(height: 300)
.onChange(of: scrollPosition) { oldPosition, newPosition in
scrollDebounceTask?.cancel()
scrollDebounceTask = Task {
try? await Task.sleep(for: .milliseconds(300))
if !Task.isCancelled {
checkAndLoadMoreData(currentPosition: newPosition)
}
}
}
}
private func checkAndLoadMoreData(currentPosition: Date?) {
guard let currentPosition,
let earliestDataPoint = viewModel.dataPoints.first?.date else {
return
}
let timeInterval = currentPosition.timeIntervalSince(earliestDataPoint)
if timeInterval <= 3 * 24 * 3600 {
viewModel.loadMoreData()
}
}
}
I attempted to compensate for this jump by adding:
scrollPosition = scrollPosition.addingTimeInterval(10 * 24 * 3600)
after viewModel.loadMoreData(). However, this caused the chart to jump in the opposite direction by 10 days, rather than maintaining the current position.
What's the problem with my code and how to fix it?
Hello, I am wondering if it is possible to have a Line Mark with different line styles. I am trying to create a Line Mark where part of the line is solid and another part of the line is dashed. Even with a conditional it only displays one or the other. Is it currently possible in SwiftCharts to do something like the attached image? Thank you.
If you try to add a graph for a function in Apple Notes you can see that numbers marking coordinates are positioned along the axes (see screenshot 1).
But when I am making my own plot view with Swift Charts I don't see that option. Marks for X axis are positioned at the bottom, and marks for Y axis are positioned to the right. I don't see an API that can configure them to be shown along the axes.
Is there something that I am missing? Or is Apple just using some private API for that?
I could make a custom overlay to display these marks, but then I will have to adjust them while zooming myself, which can be problematic.
Hello there!
I wanted to give a native scrolling mechanism for the Swift Charts Graph a try and experiment a bit if the scenario that we try to achieve might be possible, but it seems that the Swift Charts scrolling performance is very poor.
The graph was created as follows:
X-axis is created based on a date range,
Y-axis is created based on an integer values between moreless 0-320 value.
the graph is scrollable horizontally only (x-axis),
The time range (x-axis) for the scrolling content was set to one year from now date (so the user can scroll one year into the past as a minimum visible date (.chartXScale).
The X-axis shows 3 hours of data per screen width (.chartXVisibleDomain).
The data points for the graph are generated once when screen is about to appear so that the Charts engine can use it (no lazy loading implemented yet).
The line data points (LineMark views) consist of 2880 data points distributed every 5 minutes which simulates - two days of continuous data stream that we want to present. The rest of the graph displays no data at all.
The performance result:
The graph on the initial loading phase is frozen for about 10-15 seconds until the data appears on the graph.
Scrolling is very laggy - the CPU usage is 100% and is unacceptable for the end users.
If we show no data at all on the graph (so no LineMark views are created at all) - the result is similar - the empty graph scrolling is also very laggy.
Below I am sharing a test code:
@main
struct ChartsTestApp: App {
var body: some Scene {
WindowGroup {
ContentView()
Spacer()
}
}
}
struct LineDataPoint: Identifiable, Equatable {
var id: Int
let date: Date
let value: Int
}
actor TestData {
func generate(startDate: Date) async -> [LineDataPoint] {
var values: [LineDataPoint] = []
for i in 0..<(1440 * 2) {
values.append(
LineDataPoint(
id: i,
date: startDate.addingTimeInterval(
TimeInterval(60 * 5 * i) // Every 5 minutes
),
value: Int.random(in: 1...100)
)
)
}
return values
}
}
struct ContentView: View {
var startDate: Date {
return endDate.addingTimeInterval(-3600*24*30*12) // one year into the past from now
}
let endDate = Date()
@State var dataPoints: [LineDataPoint] = []
var body: some View {
Chart {
ForEach(dataPoints) { item in
LineMark(
x: .value("Date", item.date),
y: .value("Value", item.value),
series: .value("Series", "Test")
)
}
}
.frame(height: 200)
.chartScrollableAxes(.horizontal)
.chartYAxis(.hidden)
.chartXScale(domain: startDate...endDate) // one year possibility to scroll back
.chartXVisibleDomain(length: 3600 * 3) // 3 hours visible on screen
.onAppear {
Task {
dataPoints = await TestData().generate(startDate: startDate)
}
}
}
}
I would be grateful for any insights or suggestions on how to improve it or if it's planned to be improved in the future.
Currently, I use UIKit CollectionView where we split the graph into smaller chunks of the graph and we present the SwiftUI Chart content in the cells, so we use the scrolling offered there. I wonder if it's possible to use native SwiftUI for such a scenario so that later on we could also implement some kind of lazy loading of the data as the user scrolls into the past.
Hi!
I'm building an app that uses Swift Charts to visualize stock market data, and I'm encountering a couple of issues.
The stock API I’m using provides data only for the trading days when the market is open. The problem is that I need to skip over the missing dates (non-trading days) in the chart, but still keep the x-axis formatted correctly (e.g., group ticks by month). If I convert the dates to String to handle missing data, I lose the correct x-axis formatting, and the date labels become inaccurate among with its data.
Here’s som of the code I’m using for parsing the dates and structuring the data:
struct StockDataPoint: Identifiable, Decodable {
var id: String { datetime }
let datetime: String
let close: String
var date: Date {
datetime.toDate() ?? Date()
}
var closePrice: Double {
Double(close) ?? 0.0
}
}
extension String {
func toDate() -> Date? {
let formatter = DateFormatter()
formatter.locale = Locale(identifier: "en_US_POSIX")
formatter.timeZone = TimeZone(abbreviation: "UTC")
formatter.dateFormat = self.count == 10 ? "yyyy-MM-dd" : "yyyy-MM-dd HH:mm:ss"
return formatter.date(from: self)
}
}
And:
LineMark(
x: .value("Datum", point.date),
y: .value("Pris", point.closePrice)
)
.interpolationMethod(.cardinal)
.lineStyle(StrokeStyle(lineWidth: 0.7))
.foregroundStyle(.linearGradient(colors: [.blue, .yellow, .orange], startPoint: .bottomTrailing, endPoint: .topLeading))
.frame(height: 300)
.background(Color.black.opacity(0.6))
.chartYScale(
domain: (
(stockAPI.stockData.map { $0.closePrice }.min() ?? 0) * 0.98
...
(stockAPI.stockData.map { $0.closePrice }.max() ?? 100) * 1.02
)
)
.chartXAxis {
AxisMarks(values: .automatic(desiredCount: 5)) { value in
AxisGridLine().foregroundStyle(Color.gray.opacity(0.5))
AxisTick().foregroundStyle(Color.gray)
AxisValueLabel().foregroundStyle(Color.gray)
}
}
.chartYAxis {
AxisMarks(values: .automatic(desiredCount: 5)) { value in
AxisGridLine().foregroundStyle(Color.gray.opacity(0.5))
AxisTick().foregroundStyle(Color.gray)
AxisValueLabel().foregroundStyle(Color.gray)
}
}
What I need help with:
Skipping missing dates on the x-axis and show correct data for corresponding days.
Keeping the x-axis well formatted (grouped by month, accurate labels).
Thanks in advance for any suggestions!
There are hundreds of functions in my project that require creating shortcuts, but AppShortcutsProvider only supports up to 10 AppShortcut declarations, so I used over 100 AppIntents for users to manually add shortcuts (I did not add them to AppShortcutsProvider); The problem now is that I hope all the AppIntents I declare have specific names and function icons. I have tried my best to configure AppIntents with the query document, but the default display in the shortcut app is the icon of this application instead of the function icon I set. My code is as follows:
struct ResizeImageIntent: AppIntent {
static var title: LocalizedStringResource = "修改图片尺寸"
static var description: IntentDescription = IntentDescription("快速打开修改图片尺寸功能")
static var openAppWhenRun: Bool = true
func perform() async throws -> some IntentResult {
if let url = URL(string: "toolbox://resizeimage") {
await UIApplication.shared.open(url)
}
return .result()
}
}
The following is the code with icon configuration added:
struct VideoParseIntent: AppIntent {
static var title: LocalizedStringResource = "万能解析"
static var description: IntentDescription = IntentDescription("快速打开万能解析功能")
static var openAppWhenRun: Bool = true
// 修正:返回AppShortcut数组
static var appShortcuts: [AppShortcut] {
[
AppShortcut(
intent: VideoParseIntent(),
phrases: ["使用万能解析"],
systemImageName: "play.rectangle.on.rectangle" // 系统内置图标
)
]
}
func perform() async throws -> some IntentResult {
if let url = URL(string: "toolbox://videoparse") {
await UIApplication.shared.open(url)
}
return .result()
}
}
Topic:
UI Frameworks
SubTopic:
SwiftUI
Hi,
I want to follow the SwiftUI tutorials from Apple Developer. After creating the “Landmarks” app and clicking on ContentView, the preview shows:
Cannot preview in this file
Failed to launch net.bayerthomas.Landmarks
with the Diagnostics:
== PREVIEW UPDATE ERROR:
FailedToLaunchAppError: Failed to launch net.bayerthomas.Landmarks
==================================
| [Remote] JITError
|
| ==================================
|
| | [Remote] CouldNotLoadInputObjectFile: Could not load object file during preview: /Users/thomas/Library/Developer/Xcode/DerivedData/Landmarks-gpfsfizlhntsahandeumxmhwbjfj/Build/Intermediates.noindex/Landmarks.build/Debug-iphonesimulator/Landmarks.build/Objects-normal/arm64/ContentView.1.preview-thunk-launch.o
| |
| | path: /Users/thomas/Library/Developer/Xcode/DerivedData/Landmarks-gpfsfizlhntsahandeumxmhwbjfj/Build/Intermediates.noindex/Landmarks.build/Debug-iphonesimulator/Landmarks.build/Objects-normal/arm64/ContentView.1.preview-thunk-launch.o
| |
| | ==================================
| |
| | | [Remote] XOJITError
| | |
| | | XOJITError: '/Users/thomas/Library/Developer/Xcode/DerivedData/Landmarks-gpfsfizlhntsahandeumxmhwbjfj/Build/Intermediates.noindex/Landmarks.build/Debug-iphonesimulator/Landmarks.build/Objects-normal/arm64/ContentView.1.preview-thunk-launch.o': No such file or directory
I am on a fresh install of Xcode 16.3 on macOS 15.4.1.
Why is the official tutorial from Apple not working?
Topic:
UI Frameworks
SubTopic:
SwiftUI
I understand this is a known issue, but it’s truly unacceptable that it remains unresolved. Allowing users to customize toolbars is a fundamental macOS feature, and it has been broken since the release of macOS 15.
How is it possible that this issue persists even in macOS 15.3 beta (24D5040f)?
FB15513599
import SwiftUI
struct ContentView: View {
@State private var showEditItem = false
var body: some View {
VStack {
VStack {
Text("Instructions to reproduce the crash")
.font(.title)
.padding()
Text("""
1. Click on "Toggle Item"
2. In the menu go to File > New Window
3. In new window, click on "Toggle Item"
""")
}
.padding()
Button {
showEditItem.toggle()
} label: {
Text("Toggle Item")
}
}
.padding()
.toolbar(id: "main") {
ToolbarItem(id: "new") {
Button {
} label: {
Text("New…")
}
}
if showEditItem {
ToolbarItem(id: "edit") {
Button {
} label: {
Text("Edit…")
}
}
}
}
}
}
Why is the SwiftUI re-render the UI event if the view does not use the counter like in the example bellow...shouldn't SwiftUI framework be smart enough to detect that??
import SwiftUI
class ViewModel: ObservableObject {
@Published var counter: Int = 0 // Not used in the view's body
@Published var displayText: String = "Hello" // Used in the view's body
}
struct ContentView: View {
@StateObject private var viewModel = ViewModel()
var body: some View {
VStack {
Text(viewModel.displayText) // Depends on displayText
}
.onChange(of: viewModel.counter) { newValue in
print("Counter changed to: \(newValue)")
}
}
}
Is there any solution more elegant without using Publishers??
Hi all,
I’m developing a timer app with Live Activity support. On iOS 18.5 (iPhone 14 Pro Max), I cannot get Live Activity to start. When I call Activity.request(...) in my main app, it throws an unsupportedTarget error, and nothing appears on the Lock Screen or Dynamic Island.
What I’ve done:
Widget Extension Info.plist:
<key>NSExtension</key>
<dict>
<key>NSExtensionPointIdentifier</key>
<string>com.apple.widgetkit-extension</string>
</dict>
<key>NSSupportsLiveActivities</key>
<true/>
<key>NSSupportsLiveActivitiesFrequentUpdates</key>
<true/>
Live Activity UI:
Implemented with ActivityConfiguration(for: ***_Clock_liveactivitiesAttributes.self) and Dynamic Island support.
App Group:
Both main app and extension use the same App Group, and it’s enabled in Apple Developer Center and Xcode.
Tested on:
iPhone 14 Pro Max, iOS 18.5 (official release)
Xcode [your version]
(I have not tested on iOS 17.x, so I am not sure if this issue is specific to iOS 18.5.)
What I’ve tried:
Cleaned build folder, deleted Derived Data, uninstalled and reinstalled app.
Rebooted device.
Double-checked all Info.plist and entitlements settings.
Tried creating a new Widget Extension from scratch.
Problem:
Activity.request always throws unsupportedTarget.
No Live Activity appears on Lock Screen or Dynamic Island.
No other errors or crashes.
Questions:
Has anyone encountered this issue on iOS 18.5?
Are there any new requirements or changes for Live Activity in iOS 18.5?
Any suggestions or workarounds to make Live Activity work?
Any help or suggestions would be greatly appreciated!
I saw this demo on the website. Do you have the address for the demo? If not, how is the following image content implemented? Can you tell me which style of WindowGroup is used to create this custom window, and the buttons to move and close the window are located at the bottom of the menu bar. Thank you, thank [you]
Hi everyone,
I’m currently trying to create a pure backdrop blur effect in my iOS app (SwiftUI / UIKit), similar to the backdrop-filter: blur(20px) effect in CSS. My goal is simple:
• Apply a Gaussian blur (radius ~20px) to the background content
• Overlay a semi-transparent black layer (opacity 0.3)
• Avoid any predefined color tint from UIBlurEffect or .ultraThinMaterial, etc.
However, every method I’ve tried so far (e.g., .ultraThinMaterial, UIBlurEffect(style:)) always introduces a built-in tint, which makes the result look gray or washed out. Even when layering a black color with opacity 0.3 over .ultraThinMaterial, it doesn’t give the clean, transparent-black + blur look I want.
What I’m looking for:
• A clean 20px blur effect (like CIGaussianBlur)
• No color shift/tint added by default
• A layer of black at 30% opacity on top of the blur
• Ideally works live (not a static snapshot blur)
Has anyone achieved something like this in UIKit or SwiftUI? Would really appreciate any insights, workarounds, or libraries that can help.
Thanks in advance!
Ben
I have an NSStatusBar application. This is my first in SwiftUI. And I need to know when the window is closed so that I can disable some of menu commands. I can use NSWindowDelegate with AppDelegate as follows.
import SwiftUI
@main
struct SomeApp: App {
@NSApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
@StateObject private var menuViewModel = MenuViewModel()
var body: some Scene {
WindowGroup {
ContentView()
.environmentObject(menuViewModel)
}
}
}
class AppDelegate: NSObject, NSApplicationDelegate, NSWindowDelegate {
private var menuViewModel = MenuViewModel()
func applicationDidFinishLaunching(_ notification: Notification) {
if let window = NSApplication.shared.windows.first {
window.setIsVisible(false)
window.delegate = self
}
}
func windowWillClose(_ notification: Notification) {
menuViewModel.windowClosed = true
}
}
When the window will close, MenuViewModel (ObservableObject) will receive a call, which I want my ContentView to receive. But, so far, it won't.
import SwiftUI
struct ContentView: View {
var body: some View {
ZStack {
...
...
}
.onReceive(statusBarViewModel.$windowClosed) { result in
// never called...
}
}
}
Can a SwiftUI View receive a call somehow when its window closes? Muchos thankos.
Hi,
I’d like to display items in a grid from right to left. Like the image:
Is this possible with a grid? What would be the best approach in terms of performance?
I have encountered the following error and reduced my code to the minimum necessary to reliably reproduce this error.
Fatal error: Duplicate keys of type 'AnyHashable2' were found in a >Dictionary.
This usually means either that the type violates Hashable's >requirements, or
that members of such a dictionary were mutated after insertion.
It occurs when
instances of a swiftdata model are inserted (the error occurs reliably when inserting five or more instances. Fewer insertions seems to make the error either more rare or go away entirely) and
a Picker with .menu pickerStyle is present.
Any of the following changes prevents the error from occuring:
adding id = UUID() to the Item class
removing .tag(item) in the picker content
using any pickerStyle other than .menu
using an observable class instead of a swiftdata class
I would greatly appreciate if anyone knows what exactly is going on here.
Tested using
XCode Version 16.4 (16F6),
iPhone 16 Pro iOS 18.5 Simulator and
iPhone 15 Pro iOS 18.5 real device.
import SwiftUI
import SwiftData
@Model class Item {
var name: String
init(name: String) {
self.name = name
}
}
struct DuplicateKeysErrorView: View {
@Environment(\.modelContext) private var modelContext
@Query(sort: \Item.name) private var items: [Item]
@State var selection: Item? = nil
var body: some View {
List {
Picker("Picker", selection: $selection) {
Text("Nil").tag(nil as Item?)
ForEach(items) { item in
Text(item.name).tag(item)
}
}
.pickerStyle(.menu)
Button("Add 5 items") {
modelContext.insert(Item(name: UUID().uuidString))
modelContext.insert(Item(name: UUID().uuidString))
modelContext.insert(Item(name: UUID().uuidString))
modelContext.insert(Item(name: UUID().uuidString))
modelContext.insert(Item(name: UUID().uuidString))
}
}
.onAppear {
try! modelContext.delete(model: Item.self)
}
}
}
#Preview {
DuplicateKeysErrorView()
.modelContainer(for: Item.self)
}