Building Your First App with SwiftUI and SwiftData

Introduction

• Topic: Building a complete app from scratch using SwiftUI and SwiftData.
• Focus: Storing and managing data safely with SwiftData.
• Audience: Intermediate users with some knowledge of Swift.
• Purpose: Live stream to raise money for homelessness on the presenter’s birthday.

App Overview

• App Name: Face Facts
• Purpose: Helps users remember people they've met at events.
• Features:
  • Add people to the list.
  • Swipe to delete.
  • Sort people in different ways.
  • Search and filter people.
  • Attach pictures and relationships.
  • Track where people were met.
• Requirements:
  • Xcode 15.1 or later.
  • iOS 17.2 or later.
  • Recommended to use a real device for testing.

SwiftData Overview

• Purpose: Framework for storing, querying, and persisting data efficiently.
• Requirements: Mandatory understanding of Swift data before proceeding.

Setting Up the Project

• Steps:
  1. Create a new project in Xcode.
  2. Select iOS and App template.
  3. Name the app “Face Facts”.
  4. Import necessary frameworks such as SwiftData.
  5. Define data models using SwiftData.

Defining Data Models

Step 1: Person Model

• Class: Person
  • name: String
  • emailAddress: String
  • details: String
• Annotations: Use @Model to make SwiftData manage this model.
• Constructor: Provide an initializer for the class.

Step 2: Add SwiftData to the Project

• Steps:
  1. Add SwiftData import.
  2. Use @ModelContainer(for:) in the app’s main view.
  3. Initialize the container for the Person model.

Step 3: Querying Data

• Code:

  @Query var people: [Person]
  

• Purpose: Dynamically load and update UI with data.

Navigation and Editing Views

Create and Edit Data

• Components: Create, edit, and delete users.
• Navigation Details: Use NavigationStack for navigation handling.
• Steps:
  1. Design user interface for adding new people.
  2. Set up content view to handle navigation and editing.
  3. Attach toolbar button for adding people.

Subviews for Filtering and Sorting

• Purpose: Separate filtering logic for reusability.
• Components: PeopleView to dynamically handle querying and displaying.
• Filter & Query Setup: Use predicates and sorting descriptors.

Advanced Features

Handling Relationships

• Models: Add Event model to track events.
• Relationships: Link Person and Event models.
• Code:

  class Event {
    var name: String
    var location: String
    var people: [Person]?
  }
  class Person {
    var name: String
    var emailAddress: String
    var details: String
    var metAt: Event?
  }
  

• Navigation and Editing: Add views to manage event relationships.

Image Handling

• Purpose: Attach photos to people.
• Steps:
  1. Use PhotosUI framework.
  2. Create a picker to select images.
  3. Bind selected images to the Person model.
• Code Example:

  @State private var selectedItem: PhotosPickerItem?
  

Cloud Sync with iCloud

• Purpose: Sync data across multiple devices.
• Setup: Enable iCloud and background modes in Xcode.
• Code Adjustments:
  • Add default values to all properties.
  • Mark relationships as optional.
  • Use model configuration for cloud syncing.

Final Integration

• Previews: Configure Xcode previews to show data.
  • Use Previewer struct to handle previews.
• Testing: Test on real devices for iCloud and other features.

Conclusion

• Features Implemented: CRUD operations, relationships, image handling, filtering, sorting, and iCloud sync.
• Purpose of Stream: Fundraiser for homelessness on the presenter’s birthday.
• Future Scope: Extend functionalities based on use cases.

Reminder: Donate to the chosen charity via the provided link if you found the content valuable.

Note: Source code will be available on GitHub for reference.