I list some future improvement ideas in the GitHub readme, but don\u2019t actually know if I am going to implement those. The app already fulfills the intended purpose, so anything else would be just something fun to implement, if I have the time or motivation to do them. <\/p>\n<\/blockquote>\n\n\n\n
And now, after three days, I’ve implemented:<\/p>\n\n\n\n
- \n
- alerts<\/strong>; the app now alerts about the incoming deadline when it becomes “hot” using
UserNotifications<\/code> framework,<\/li>\n\n\n\n- pick a symbol<\/strong>; the app now has preselected SF Symbols to choose from when adding or editing a deadline,<\/li>\n\n\n\n
- icon<\/strong>; app now has an icon,<\/li>\n\n\n\n
- app checks that the course name and deadline goal are not empty<\/strong>,<\/li>\n\n\n\n
- app checks that the course name is unique<\/strong> when creating a new course, and<\/li>\n\n\n\n
- several GUI enhancements and bug fixes.<\/li>\n<\/ul>\n\n\n\n
As if it looks like I am using the app to avoid some other (not so fun) responsibilities and instead spend time on this hobby project… Though this is<\/em> related to teaching work, really!! Valid work done here!!<\/p>\n\n\n\n
One of the important bug fixes was related to setting the date and time for a deadline. I use the SwiftUI
DatePicker<\/code> for this, specifying that I want to select both date and time, usingdisplayedComponents: [.date, .hourAndMinute]<\/code> for the picker.<\/p>\n\n\n\nI was falsely assuming that the
Date<\/code> object would then contain the exact<\/em> date\/time selected by the user. Like if the user selects, using the picker, 2025-05-15 12.00, the date object then would have that exact<\/em> time. Well, it does contain that date and that time, but since the user is not selecting seconds, the date object may then contain something in the seconds, like 2025-05-15 12.00.46, for example. Not good, since now the communicated<\/em> deadline is actually later<\/em> than the intended<\/em> deadline. <\/p>\n\n\n\nI noticed this issue when I was testing the alerts feature and saw that the actual date and time shown in the alert was not the one specified in the deadline, by the seconds.<\/p>\n\n\n\n
What I needed to do was to take the user selected
Date<\/code> object, then set the seconds part of the date to zero and then use that modified datetime as the actual deadline date:<\/p>\n\n\n\nextension Date {\t\n func secondsRoundedToZero() -> Date {\n var components = Calendar.current.dateComponents([.year, .month, .day, .hour, .minute], from: self)\n components.second = 0\n return Calendar.current.date(from: components)!\n }\n}<\/code><\/pre>\n\n\n\nOooh, those pesky dates and times can really be hard sometimes…<\/p>\n\n\n\n
There was another interesting issue with SwiftUI and the deadline formatting. The app shows a hot deadline colored red, as in the example in this image:<\/p>\n\n\n
\n![\"Deadline](\"https:\/\/www.juustila.com\/antti\/wp-content\/uploads\/2025\/05\/Nayttokuva-2025-05-15-kello-9.47.42.png\")
A deadline coming after one day and five hours.<\/figcaption><\/figure>\n<\/div>\n\n\n And when the deadline has passed, it should be grayed out, like this:<\/p>\n\n\n
\n![\"Deadline](\"https:\/\/www.juustila.com\/antti\/wp-content\/uploads\/2025\/05\/Nayttokuva-2025-05-15-kello-9.49.47.png\")
A deadline gone nine days and 17 hours ago.<\/figcaption><\/figure>\n<\/div>\n\n\n This worked, when you open the app and view the deadlines just loaded from files. But if you open the app and actually watch<\/em> a deadline date\/time coming and passing<\/em>, the formatting did not change<\/em>. WTF?!<\/p>\n\n\n\n
As you can see, the time is shown as relative to current time. That worked fine, but as the deadline came and passed, the relative time changed to past but coloring did not<\/em>.<\/p>\n\n\n\n
That was because SwiftUI updates the view when the
@Observable<\/code> object (Deadline<\/code> in this case) changes<\/em>. But the deadline object actually did not change at all<\/em>. No member variables changed values when the deadline date\/time comes and goes. The deadline’s date and time was still the same, of course.<\/p>\n\n\n\nThe way the time is shown as relative<\/em> time by SwiftUI
Text<\/code> element, gave me an illusion that something keeps changing. Since the view shows a countdown including seconds (when the deadline is very near) when.relative<\/code> style is used:<\/p>\n\n\n\nText(deadline.date, style: .relative)<\/code><\/pre>\n\n\n\nFrom the SwiftUI viewpoint, nothing<\/em> changed so view update was not<\/em> needed, thus the formatting did not change.<\/p>\n\n\n\n
I solved this by adding a property
viewUpdateNeeded<\/code> to theDeadline<\/code>. That property was then updated in theisReached<\/code> computed property…:<\/p>\n\n\n\n@Observable\nclass Deadline: Codable {\n\/\/ ...\n var viewUpdateNeeded: Bool = false\n\/\/...\n var isReached: Bool {\n viewUpdateNeeded = date <= Date.now\n return viewUpdateNeeded\n }<\/code><\/pre>\n\n\n\n…used by the list item row view:<\/p>\n\n\n\n
HStack {\n if deadline.isReached {\n \/\/ Show deadline as passed\n Text(\"Deadline passed\")\n .padding(.trailing, 0)\n \/\/ ...\n } else {\n \/\/ Show deadline as forthcoming\n Text(deadline.date, style: .relative)\n .padding(.trailing, 0)\n Text(\"until deadline\")\n .padding(.leading, 0)\n\/\/ ...\n}\n.foregroundStyle(deadlineColor)<\/code><\/pre>\n\n\n\nWhere the last line,
.foregroundStyle(deadlineColor<\/code> determines the color used (where thedeadlineColor<\/code> is a property in the deadline row view):<\/p>\n\n\n\nvar deadlineColor: Color {\n if deadline.isReached {\n return .gray\n } else if deadline.isHot {\n return .red\n } else if deadline.isDealBreaker {\n return .orange\n } else {\n return .accentColor\n }\n}<\/code><\/pre>\n\n\n\nOK, so the initial value of
Deadline<\/code>‘sviewUpdateNeeded<\/code> isfalse<\/code>. When the view accesses theisReached<\/code> property to decide the formatting, and the deadline is still in the future, the value ofviewUpdateNeeded<\/code> is set. <\/p>\n\n\n\nAs the value was originally
false<\/code>, and the new value is stillfalse<\/code> (since deadline date is not less than current date; in the past), so from the viewpoint of SwiftUI, nothing<\/em> changed and view does not need updating.<\/p>\n\n\n\nWhen the deadline finally comes and goes, the value of
viewUpdateNeeded<\/code> now changes fromfalse<\/code> totrue<\/code> (deadline date is smaller than or equal to current datetime) and then SwiftUI sees<\/em> a change in the state of the deadline object, and now<\/em> the view is updated and the also formatting changes.<\/p>\n\n\n\nOf course I knew this already. Maybe I just got confused seeing the UI changing and thought, when looking at the deadline closing: “nice, things change and view is updated” and then was astonished why the formatting<\/em> did not change. After a while, looking and thinking, I realized what I already knew and then added that member variable to handle the issue.<\/p>\n\n\n\n
Often we stumble with the basics, and that is OK. I remember reading from somewhere that experienced programmers actually do more mistakes than novices since they typically work faster. The difference is that with experience, you are able to spot your mistakes much earlier and are usually able to solve the issues much faster. So go gather some more experience!<\/p>\n","protected":false},"excerpt":{"rendered":"
Three days ago I wrote about the Course deadlines app: I list some future improvement ideas in the GitHub readme, but don\u2019t actually know if I am going to implement those. The app already fulfills the intended purpose, so anything else would be just something fun to implement, if I have the time or motivation … Continue reading “Course deadlines app revisited”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[2],"tags":[180,179,181,70,46,47],"class_list":["post-1187","post","type-post","status-publish","format-standard","hentry","category-coding","tag-experience","tag-learning","tag-mistakes","tag-programming","tag-swift","tag-swiftui"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/posts\/1187","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/comments?post=1187"}],"version-history":[{"count":5,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/posts\/1187\/revisions"}],"predecessor-version":[{"id":1203,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/posts\/1187\/revisions\/1203"}],"wp:attachment":[{"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/media?parent=1187"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/categories?post=1187"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.juustila.com\/antti\/wp-json\/wp\/v2\/tags?post=1187"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- pick a symbol<\/strong>; the app now has preselected SF Symbols to choose from when adding or editing a deadline,<\/li>\n\n\n\n