Building a handwriting recognition experience with PencilKit
At a glance
| Item | Summary |
|---|---|
| Purpose | Integrate handwriting recognition into your app to identify written text across multiple languages, and explore path conversion and substrokes to enhance the drawing experience. |
| App architecture | A Swift sample with the source-visible chain HandwritingRecognitionTutorApp → ContentView → Coordinator → PencilKit APIs. |
| Main patterns | Delegate or data-source callbacks, Coordinator, Binding-based state propagation, Actor-isolated state |
| Project style | 7 scanned source file(s) across Swift, organized around ranked entry, type, and file boundaries. |
Project structure
Source bundle/
├── HandwritingRecognitionTutor/
│ ├── HandwritingRecognitionTutorApp.swift
│ ├── FlashcardView.swift
│ ├── CanvasView.swift
│ ├── ContentView.swift
│ ├── Flashcard.swift
│ ├── TutorModel.swift
│ └── GeometryHelpers.swift
├── Configuration/
│ └── SampleCode.xcconfig
└── HandwritingRecognitionTutor.xcodeproj/
├── .xcodesamplecode.plist
└── project.pbxproj
Structure observations
- Architecturally prominent files are ranked from entry points and role-named declarations; resource-only paths are omitted.
- Primary languages: Swift.
- The verified tree contains 3 project/configuration file(s) and 19 source declaration(s).
Overall architecture
flowchart LR
N1["HandwritingRecognitionTutorApp"]
N2["ContentView"]
N3["Coordinator"]
N4["PencilKit APIs"]
N1 --> N2
N2 --> N3
N3 --> N4
Reference code
HandwritingRecognitionTutor/HandwritingRecognitionTutorApp.swift:10 — architecture anchor
@main
struct HandwritingRecognitionTutorApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}Interpretation
The arrows summarize the source-visible entry, role-named types or folders, and framework direction; when nodes come from structural folders, the sequence is a high-level interpretation rather than proof that every adjacent node calls the next. Ownership is claimed only where the next section cites a stored property or assignment. The diagram is intentionally limited to the dominant path into PencilKit.
Ownership and state
classDiagram
FlashcardCarouselView o-- TutorModel : model
FlashcardCarouselView *-- Task : runningTask
FreeInputView *-- String : recognizedText
FlashcardView o-- Flashcard : flashcard
Ownership evidence
HandwritingRecognitionTutor/FlashcardView.swift:14 — stored dependency or nearest verified ownership anchor
struct FlashcardCarouselView: View {
@Bindable var model: TutorModel
// ...
}| Owner | Object or state | Relationship | Mutation authority |
|---|---|---|---|
FlashcardCarouselView |
TutorModel (model) |
stores or receives | App/module collaborators |
FlashcardCarouselView |
Task (runningTask) |
owns wrapper-managed state | Owning lexical scope |
FreeInputView |
String (recognizedText) |
owns value state | App/module collaborators |
FlashcardView |
Flashcard (flashcard) |
stores or receives | Initialized by the owner; the binding is immutable |
Composition arrows indicate a source-visible construction expression or locally owned value state; aggregation means the owner stores or receives a dependency without proving exclusive lifetime ownership.
Class and protocol design
HandwritingRecognitionTutor/HandwritingRecognitionTutorApp.swift:11 — representative type boundary
struct HandwritingRecognitionTutorApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}| Type | Responsibility | Depends on or conforms to |
|---|---|---|
HandwritingRecognitionTutorApp |
Application entry and top-level composition | App |
FlashcardCarouselView |
User-interface presentation and input forwarding | View |
FreeInputView |
User-interface presentation and input forwarding | View |
FlashcardView |
User-interface presentation and input forwarding | View |
ConfettiView |
User-interface presentation and input forwarding | View |
CanvasView |
User-interface presentation and input forwarding | View |
CanvasWrapperView |
User-interface presentation and input forwarding | UIViewRepresentable |
Coordinator |
Cross-object flow or session coordination | NSObject, PKCanvasViewDelegate |
ContentView |
User-interface presentation and input forwarding | View |
TutorModel |
Feature data or observable state | Concrete collaborators/imported frameworks |
No local protocol conformance is claimed as protocol-oriented design; external framework conformances are listed only as dependencies.
Access control
| Symbol | Access | Verified effect | Likely rationale |
|---|---|---|---|
model (HandwritingRecognitionTutor/ContentView.swift:11) |
private |
Use is restricted to the lexical declaration and same-file extensions allowed by Swift. | Inference: keep state mutation or dependency lifetime inside the owning implementation. |
freeInputID (HandwritingRecognitionTutor/Flashcard.swift:41) |
private |
Use is restricted to the lexical declaration and same-file extensions allowed by Swift. | Inference: keep state mutation or dependency lifetime inside the owning implementation. |
runningTask (HandwritingRecognitionTutor/FlashcardView.swift:16) |
private |
Use is restricted to the lexical declaration and same-file extensions allowed by Swift. | Inference: keep state mutation or dependency lifetime inside the owning implementation. |
successTrigger (HandwritingRecognitionTutor/FlashcardView.swift:17) |
private |
Use is restricted to the lexical declaration and same-file extensions allowed by Swift. | Inference: keep state mutation or dependency lifetime inside the owning implementation. |
Reference code
HandwritingRecognitionTutor/ContentView.swift:11 — representative boundary
@State private var model = TutorModel()Swift declarations without a modifier are internal; explicit private, fileprivate, private(set), public, or open entries above are interpreted by language semantics. Objective-C/C samples instead rely on header and implementation boundaries, which are not equivalent to Swift lexical privacy.
Logic ownership and placement
| Logic | Owning type or file | Placement rationale |
|---|---|---|
| Application entry and top-level composition | HandwritingRecognitionTutorApp |
The source’s App suffix makes this role explicit. |
| Cross-object flow or session coordination | Coordinator |
The source’s Coordinator suffix makes this role explicit. |
| Feature data or observable state | TutorModel |
The source’s Model suffix makes this role explicit. |
| User-interface presentation and input forwarding | CanvasView, CanvasWrapperView, ConfettiView, ContentView |
The source’s View suffix makes this role explicit. |
Design patterns
| Pattern | Source evidence | Purpose or tradeoff |
|---|---|---|
| Delegate or data-source callbacks | HandwritingRecognitionTutor/CanvasView.swift:75 |
Callback protocols invert event delivery back into the sample’s owner. |
| Coordinator | HandwritingRecognitionTutor/CanvasView.swift:75 |
A role-named coordinator centralizes cross-object flow. |
| Binding-based state propagation | HandwritingRecognitionTutor/FlashcardView.swift:172 |
A binding exposes controlled read/write access while the upstream owner remains authoritative. |
| Actor-isolated state | HandwritingRecognitionTutor/CanvasView.swift:74 |
Actor annotations make the concurrency ownership boundary explicit. |
Naming conventions
- Types: App: HandwritingRecognitionTutorApp; Coordinator: Coordinator; Model: TutorModel; View: CanvasView, CanvasWrapperView, ConfettiView, ContentView, FlashcardCarouselView.
- Protocols: no local protocol declaration in the scanned source.
- Methods:
cardChrome,path,startTask,effectValue,makeUIView,updateUIView,makeCoordinator,canvasViewDrawingDidChange. - Files:
HandwritingRecognitionTutor/HandwritingRecognitionTutorApp.swift,HandwritingRecognitionTutor/FlashcardView.swift,HandwritingRecognitionTutor/CanvasView.swift,HandwritingRecognitionTutor/ContentView.swift,HandwritingRecognitionTutor/Flashcard.swift,HandwritingRecognitionTutor/TutorModel.swift.
Architecture takeaways
HandwritingRecognitionTutorAppis the main source-visible entry or composition anchor for this sample.- Framework work reaches SwiftUI, PencilKit, CoreGraphics, UIKit through a deliberately small high-level chain; the detailed API graph remains inside the cited implementation files.
- Stored-property evidence identifies lifecycle collaboration; it does not by itself prove exclusive object ownership.
- Access-control conclusions separate verified language visibility from the likely design rationale.
- The source does not justify labeling the design protocol-oriented.
Source map
| Source file | Relevant symbols |
|---|---|
HandwritingRecognitionTutor/HandwritingRecognitionTutorApp.swift |
HandwritingRecognitionTutorApp |
HandwritingRecognitionTutor/FlashcardView.swift |
FlashcardCarouselView, FreeInputView, FlashcardView, CGPathShape, ActionRow, ShakeEffect, ConfettiParticle, ConfettiView |
HandwritingRecognitionTutor/CanvasView.swift |
CanvasView, MatchBoundsOverlay, CanvasWrapperView, Coordinator |
HandwritingRecognitionTutor/ContentView.swift |
ContentView |
HandwritingRecognitionTutor/Flashcard.swift |
Flashcard, Card, Outcome, DisplayLanguage |
HandwritingRecognitionTutor/TutorModel.swift |
TutorModel |
HandwritingRecognitionTutor/GeometryHelpers.swift |
Feature implementation |