Pawford Academy — A SwiftUI Puppy Training App with ElevenLabs AI Voice 🐾🎓
This is a submission for Weekend Challenge: Dog Days Edition What I Built Pawford...
找到 13 篇相关文章
This is a submission for Weekend Challenge: Dog Days Edition What I Built Pawford...
I was cleaning up the UI on a side-project iOS app and did one thing: set Dynamic Type to XXXL and screenshot every screen. Reading the code had turned up nothing. The screenshots showed problems immediately. Eleven of them, in the end. All the same cause. Here's the conclusion first. "A parent that pins things side by side" × "text that grows" is not a bug, it's a pattern. And in Japanese it breaks reliably worse than in English. English truncates. Japanese stacks vertically. Same layout, different failure depending on language. English wraps at word boundaries and, failing that, ends in … . You can't read it, but you can tell something was cut. Japanese doesn't do that. It can break between almost any two characters, so once a column is squeezed to one character wide, you get one character per line, stacked downward. Actual output: Rendered Intended Paire / d / Macs Paired Macs ( broken mid-word ) Claud / e / Code Claude Code One character per line "実行中のセッション" (Running sessions) Three step labels stacked vertically A three-step horizontal stepper De / mo , turning the capsule into a circle A "Demo" badge Paire / d / Macs is English breaking mid-word. Once the column has only a few characters left, even English gets there. Japanese gets there much earlier. The cause had the same shape every time Nearly all eleven were this: HStack { Image ( systemName : icon ) . frame ( width : 44 ) // fixed Text ( label ) Spacer () Text ( value ) // pinned right } The 44pt icon and the trailing value claim their width first, leaving the label column a few characters. The fix: rows that carry a value drop the value to the line below — but affordances like chevrons and toggles stay on the right. That row component was shared across the whole settings tree, so fixing one place fixed the entire settings screen. Which also means one decision inside a shared component was breaking eleven screens. ViewThatFits is not a general answer I used ViewThatFits to switch to a stacked layout. It
You've seen some View in every SwiftUI file you've ever opened. Now let's find out what it actually means, why it exists, and why returning a plain protocol doesn't work the same way. Fair warning: this topic is genuinely one of the more brain-bendy things in Swift. I'm going to tell you upfront that you don't need to fully understand the internals to keep going — but you do need to know it exists and roughly what it's doing, because you've already been using it every single time you've written a SwiftUI view. That some View in every SwiftUI file? That's an opaque return type. And now we're going to actually understand what that means. 🍥 Let's Start With Something That Works Two simple functions: func getRandomJutsu () -> Int { Int . random ( in : 1 ... 100 ) } func getRandomSuccess () -> Bool { Bool . random () } Both Int and Bool conform to a protocol called Equatable — which means they can be compared using == . So you can do this: print ( getRandomJutsu () == getRandomJutsu ()) That works fine, comparing two random integers. Now, since both return types conform to Equatable , you might think: what if we simplify both functions to return Equatable instead of their specific types? The Thing That Doesn't Work func getRandomJutsu () -> Equatable { // ❌ Int . random ( in : 1 ... 100 ) } func getRandomSuccess () -> Equatable { // ❌ Bool . random () } Swift refuses this with an error message so confusing it might as well be written in ancient runes: "protocol 'Equatable' can only be used as a generic constraint because it has Self or associated type requirements." Here's the actual problem in plain English: if both functions return Equatable , Swift loses track of what specific type is coming back. And if it doesn't know the specific type, it can't know whether two Equatable things can actually be compared to each other. Think about it: an Int and a Bool both conform to Equatable , but you can't compare them with == . That doesn't make sense. Swift isn't going to let y
MVVM with swiftUI When learning SwiftUI, one of the first architectural patterns you'll encounter is MVVM (Model-View-ViewModel). In this tutorial, we'll build a simple weather application that consumes the OpenWeather API while applying MVVM, dependency injection, and protocol-oriented programming. By the end, you'll understand not only how to structure the project, but also why each layer exists. This is the link for the OpenWeather API https://openweathermap.org/api . What you'll learn By the end of this tutorial you'll know how to: Structure a SwiftUI project using MVVM. Consume a REST API using async/await. Apply dependency injection using protocols. Display loading and error states. Keep Views focused only on UI. This is how the data flow looks. User taps "Search" │ ▼ ┌──────────────┐ │ ContentView │ └──────┬───────┘ │ await fetchWeather() │ ▼ ┌────────────────────┐ │ WeatherViewModel │ └─────────┬──────────┘ │ ▼ WeatherServiceProtocol │ ▼ ┌─────────────────┐ │ WeatherService │ └──────┬──────────┘ │ ▼ OpenWeather API Project Structure WeatherApp ├── Configuration │ └──AppConfig.swift ├── Models │ ├── Main.swift │ ├── Weather.swift │ └── WeatherResponse.swift ├── Services │ ├── WeatherService.swift │ └── WeatherServiceProtocol.swift ├── ViewModels │ └── WeatherViewModel.swift └── Views └── ContentView.swift Configuration contains application-wide constants such as the API key and base URLs. Models contains the data structures used to decode the API response. Services is responsible for networking and fetching data. ViewModels contains the presentation logic and exposes data to the UI. Views contains the SwiftUI interface. On the AppConfig file, we are going to keep static info, just like the base URL, API key, etc struct AppConfig { static let apiKey = "YOUR API KEY" static let baseGeoCodingAPIURL = "https://api.openweathermap.org/geo/1.0/direct?q=" static let baseURL = "https://api.openweathermap.org/data/2.5/weather?&units=metric&lat=" } Designing the UI Befo
Okay. This one is going to feel weird at first. I'm going to warn you in advance so you don't think...
Part 2 — Search, palette, and settings Level: Intermediate · Time: ~35 minutes · Builds on: Part 1 — Contacts app Part 1 got you shipping. This one gets you productive . We'll take the Contacts app and give it the ergonomics real users expect: an adaptive sidebar that becomes a tab bar on iPhone, a command palette on ⌘K, honest loading states while data comes in, and a proper settings screen. Zero #if os guards. Zero re-rolled controls. What we're adding An adaptive shell — DFSidebar on regular width, DFTabBar on compact. A search field at the top of the list, filtering as you type. A ⌘K command palette exposing every action in the app. Skeleton loaders for a simulated slow fetch. A settings screen — notifications toggle, density picker, sync-interval slider, pinned-since date picker, beta-features checkbox. Per-component token overrides on the settings screen, without forking the theme. 1. Shell: sidebar on wide, tab bar on narrow The routing decision — sidebar vs tab bar — should be data, not a view hierarchy. Enumerate your sections once, then feed the two components the shapes they want. API note. DFSidebar uses Binding<String?> and is just the sidebar view — you compose the detail pane yourself (naturally via NavigationSplitView ). DFTabBar uses Binding<String> (non-optional) and does take a content builder that receives the selected ID. Both use plain String IDs, so we keep a simple Section enum and pass rawValue at the boundary. enum Section : String , CaseIterable , Identifiable , Hashable { case contacts , favorites , archive , settings var id : String { rawValue } var label : String { switch self { case . contacts : "Contacts" case . favorites : "Favorites" case . archive : "Archive" case . settings : "Settings" } } var icon : String { switch self { case . contacts : "person.2.fill" case . favorites : "star.fill" case . archive : "archivebox.fill" case . settings : "gear" } } static func from ( _ id : String ?) -> Section { id . flatMap ( Section . init (
The 2027 release of SwiftData introduces support for persisting custom and third-party types via Codable, along with the ability to organize data into SwiftUI list sections. It also adds new capabilities for observing data store changes through ResultsObserver and HistoryObserver. By Sergio De Simone
"I'll just write a quick button style... and a text field with validation... and a card component..." Two weeks later you have a bespoke design system that only half the app uses, three slightly different buttons, and nothing shipped. If you're building with an AI coding agent, the drift problem is worse, not better. Ask Claude, Cursor, or Codex to "add a settings screen" three separate times and you'll get three different paddings, three different corner radii, and a button style that quietly forked itself somewhere around commit 40. Agents are great at writing plausible SwiftUI and bad at remembering what the rest of your app already decided. DesignFoundation is an open-source SwiftUI package that gives you a token-based theming engine, 25 components, and 6 feedback/overlay modifiers that all read from the same theme. You set it once at the app root, and everything underneath updates. That's the whole idea — and it ships with CLAUDE.md , AGENTS.md , and Cursor rules already written, so an agent working in your repo reaches for DFButton instead of inventing a new one. In this tutorial you'll go from zero to a themed, consistent SwiftUI UI — without writing a single custom button style. What We're Building By the end you'll have: A working app that uses DesignFoundation's theme system A themed form with inputs, validation states, and feedback components A custom theme built from tokens An understanding of how the style system composes Requirements: Xcode 16+, iOS 18+ / macOS 15+ target, Swift 6. Installation Via Xcode File → Add Package Dependencies Paste https://github.com/NerdSnipe-Inc/design-foundation Set the version rule to Up to Next Major from 1.0.0 Add DesignFoundation to your target Via Package.swift dependencies : [ . package ( url : "https://github.com/NerdSnipe-Inc/design-foundation" , from : "1.0.0" ) ], targets : [ . target ( name : "YourApp" , dependencies : [ "DesignFoundation" ]) ] Step 1: One Line Instead of a ThemeManager Singleton Every app that
Part 2 of 2. This tutorial builds on Part 1 — DesignFoundation core . If you haven't added the base package and theme yet, start there. The core package gives you tokens and primitives. DesignFoundationPro adds what comes next — 29 blocks, 47 screens, 18 navigation shells, and 9 runnable composition examples across auth, onboarding, charts, data tables, and full product verticals. The docs claim ~87% fewer lines of code versus building from scratch. That's the bet. This matters even more if an AI coding agent is doing the building. Ask an agent for a CRM screen and a settings screen in the same session and, without guardrails, you'll get two different takes on spacing, two different sidebar behaviors, and a table that's native on Mac in one screen and a scroll view pretending to be a table in the other. Pro ships with that guardrail already in place — more on that in Where to go from here. How the two packages relate Pro sits on top of Foundation and re-exports it. Import only DesignFoundationPro and you get everything from both: YourApp your models, data, routing DesignFoundationPro 29 blocks · 47 screens · 18 shells · 9 examples DesignFoundation tokens · primitives · validation · theme engine · MIT Access: Foundation is MIT and public. Pro is a commercial add-on — repo access is granted after purchase. Licenses are lifetime (no subscription); annual updates are $39/year and entirely optional. Pricing: $149 individual · $449 team (up to 5 devs). Before buying, browse everything in DFPlayground — a free macOS app that lets you preview all 29 blocks, 47 screens, and 18 shells with live theming. Step 1: Add DesignFoundationPro Pro declares Foundation as its own dependency and re-exports it via @_exported import DesignFoundation . Add only the Pro package — Foundation comes with it automatically. The Pro repo URL is provided after purchase — contact nerdsnipe.inc@gmail.com or visit the Pro page to get access. dependencies : [ . package ( url : "https://github.com/NerdS
Announced at WWDC 2026, the latest SwiftUI release brings a new Document protocol for efficient disk access and snapshot-based updates, along with improved APIs for reordering items in lists, grids, and sections. In addition, it expands presentation features, such as swipe actions on any view, better AsyncImage caching, and lazy state initialization for Observable types to boost performance. By Sergio De Simone
You built a Mac app, you want to sell it outside the App Store, and now you need licensing: a key the customer enters, an activation that sticks, and feature gates that hold up offline. Here's how to do it in an afternoon without standing up a backend. Note: this is cross-posted from the Keylight blog . I build Keylight, so this uses it as the worked example — the shape of the solution applies whatever SDK you choose. The three things licensing actually has to do Strip away the marketing and every licensing system does exactly three jobs: Activate — turn a key the user pastes in into proof-of-purchase bound to this device. Verify — on every launch, confirm that proof is still valid, including offline . Gate — unlock features based on the tier/entitlements the license carries. If you build this by hand you're writing a server, a crypto layer, and a state machine. The point of an SDK is to skip all three. 1. Add the SDK Add the Swift package in Xcode (File ▸ Add Package Dependencies) pointing at the Keylight Swift SDK, then configure it once with your tenant key at app launch: import Keylight let keylight = Keylight ( tenant : "your_tenant_key" ) 2. Activate a key Give the user a text field and call activate . This is the one online step — it exchanges the key for a signed, device-bound lease that's stored locally: do { try await keylight . activate ( key : enteredKey ) // lease stored — the app is now licensed on this device } catch { // show the user why: invalid key, device limit reached, etc. } 3. Verify on launch (offline-safe) On every subsequent launch you don't hit the network. The SDK verifies the stored lease's Ed25519 signature locally and hands you a state: switch keylight . checkOnLaunch () { case . licensed ( let lease ): unlockApp ( entitlements : lease . entitlements ) case . trial ( let daysLeft ): runTrial ( daysLeft : daysLeft ) case . expired , . invalid : showActivationScreen () } No server call, so the app opens instantly and works on a plane. Th
So far we've been working with Swift's built-in types — String, Int, Bool, Array. But what if you...
Dumpert is a Dutch video site I've watched for years, but there's never been an Apple TV app, so I built one. DumpertTV is an unofficial, open-source tvOS client. Here's how it's put together and a few things that were more interesting than I expected. Disclaimer up front: this project is not affiliated with Dumpert or DPG Media B.V. It's an independent app that uses the public Dumpert API. The stack Swift 6 with strict concurrency ( complete mode) across every target SwiftUI for all UI, tvOS 18+ XcodeGen so the .xcodeproj is generated from a project.yml and never committed CloudKit , GroupActivities (SharePlay), Vision , AVKit , Swift Testing One actor for the network, one source of truth for the UI The whole networking layer is an actor . That makes per-request state like ETags and retry bookkeeping thread-safe without a single lock: actor DumpertAPIClient { private var etags : [ URL : String ] = [:] func fetch < T : Decodable > ( _ endpoint : APIEndpoint ) async throws -> T { // Exponential backoff on 5xx + network errors; honours 304 Not Modified. try await fetchWithRetry ( endpoint , attempt : 0 ) } } The UI reads from a single @Observable @MainActor repository injected through the SwiftUI environment — no Combine, no view models competing over the same state: @Observable @MainActor final class VideoRepository { private(set) var hotshiz : [ MediaItem ] = [] let apiClient : APIClientProtocol // protocol-backed for testing } ContentView () . environment ( videoRepository ) Views just read repository.hotshiz ; updates flow automatically. With Swift 6's strict concurrency on, the compiler kept me honest about every actor hop. Things that were trickier than expected tvOS focus + a top tab bar. Getting a Netflix-style hero carousel to behave with the focus engine took real care. It also made automating screenshots interesting — scripted remote input doesn't reliably drive the simulator, so I added #if DEBUG launch-argument hooks to jump straight to any tab/category f