HOME BOOKS QUICK GUIDES VIDEO COURSES
NEWSLETTER CONTACT
SwiftUI for Masterminds
How to take advantage of SwiftUI to create insanely great apps for iPhones, iPads, and Macs
2nd Edition 2022
ISBN: 978-1-7779782-1-1
Buy Now
There is a new edition of this book available!
Click here for more information.
Figures
Book publishers automatically compress the images in ebooks to reduce the size of the file. This may affect the quality of textbooks and turn some images illegible. If this is affecting you, you can download all the images included in the SwiftUI for Masterminds book or open the image you want to see from the list.
Download Figures
77.5 MBytes
CHAPTER 1 - APP DEVELOPMENT
Figure 1-1: Xcode in the Mac App Store
Figure 1-2: Xcode's welcome screen
Figure 1-3: Building an App
CHAPTER 2 - INTRODUCTION TO SWIFT
Figure 2-1: Playground option
Figure 2-2: Playground's templates
Figure 2-3: Playground's interface
Figure 2-4: Playground's running mode
Figure 2-5: Quick Look and Show Result buttons
Figure 2-6: Quick Look window
Figure 2-7: Result window
Figure 2-8: Memory cells
Figure 2-9: Combining two cells
Figure 2-10: Representation of one Byte in memory
Figure 2-11: Emojis and symbols
CHAPTER 3 - SWIFT PARADIGM
Figure 3-1: Value types stored in memory
Figure 3-2: Objects stored in memory
Figure 3-3: Objects referencing each other
Figure 3-4: Objects preserved in memory
Figure 3-5: Object-Oriented Programming versus Protocol-Oriented Programming
CHAPTER 4 - INTRODUCTION TO FRAMEWORKS
There are no Figures in this Chapter
CHAPTER 5 - SWIFTUI FRAMEWORK
Figure 5-1: Selecting the type of project
Figure 5-2: Project's configuration window
Figure 5-3: Registering our Apple account in Xcode
Figure 5-4: Xcode's interface
Figure 5-5: Multiple editors in the Editor Area
Figure 5-6: Adjust Editor Options
Figure 5-7: Editor panel
Figure 5-8: Buttons to run the app
Figure 5-9: Options available to run the app
Figure 5-10: App running in the simulator
Figure 5-11: Target configuration
Figure 5-12: App configuration
Figure 5-13: Files created by the App template
Figure 5-14: Views hierarchy
Figure 5-15: Views created by the App template on the Canvas
Figure 5-16: Resume button
Figure 5-17: Preview configuration
Figure 5-18: Text view with formatted values
Figure 5-19: Date displayed with a Text view
Figure 5-20: Modifier applied to a Text view
Figure 5-21: View's attributes
Figure 5-22: View's context menu
Figure 5-23: Adding a modifier from the Library
Figure 5-24: View with a fixed size
Figure 5-25: Flexible view
Figure 5-26: View with padding
Figure 5-27: Padding on the sides
Figure 5-28: Padding at the top and bottom
Figure 5-29: Dynamic font types
Figure 5-30: Text with the Georgia font
Figure 5-31: Dragging files from Finder to our Xcode's project
Figure 5-32: Options to add files to the project
Figure 5-33: Custom fonts declared in the Info panel
Figure 5-34: Text with a custom font
Figure 5-35: Multiple styles applied to a text
Figure 5-36: Nested Text views with different styles
Figure 5-37: Semibold text
Figure 5-38: Multiline text
Figure 5-39: Truncation mode
Figure 5-40: Color view
Figure 5-41: Empty Asset Catalog
Figure 5-42: Colors for Light and Dark appearances
Figure 5-43: New color for Dark appearance
Figure 5-44: Custom color in Dark appearance
Figure 5-45: Accent color
Figure 5-46: Text in different color
Figure 5-47: View with a background
Figure 5-48: Background applied before and after the padding
Figure 5-49: Background and border applied to the view
Figure 5-50: Round corners
Figure 5-51: Overlay
Figure 5-52: Material applied to a view
Figure 5-53: Material applied to the text
Figure 5-54: Same image in devices with different scale
Figure 5-55: Different images for specific scales
Figure 5-56: New set of images
Figure 5-57: The husky set is ready
Figure 5-58: Images for iPhones
Figure 5-59: Image view larger than the screen
Figure 5-60: Image clipped
Figure 5-61: Image resized
Figure 5-62: Aspect fit (left) and aspect fill (right)
Figure 5-63: Clipped image
Figure 5-64: Flexible Image view
Figure 5-65: Image view with common modifiers
Figure 5-66: Visual effects applied to an image
Figure 5-67: Image adapting to the smallest and largest dynamic font types
Figure 5-68: SF Symbols app
Figure 5-69: SF Symbol
Figure 5-70: A variant of an SF Symbol
Figure 5-71: Multicolor symbol
Figure 5-72: Multicolor symbol with custom colors
Figure 5-73: Label with an SF Symbol
Figure 5-74: Custom modifiers
Figure 5-75: Vertical stack
Figure 5-76: Vertical stack aligned to the left with a space of 20 points in between
Figure 5-77: Horizontal stack aligned to the center
Figure 5-78: HStack alignments
Figure 5-79: Views in a ZStack
Figure 5-80: ZStack alignments
Figure 5-81: Custom Z index
Figure 5-82: Modifier applied to container
Figure 5-83: Nested stacks
Figure 5-84: Flexible space between views
Figure 5-85: Views at the top of the screen
Figure 5-86: Safe areas
Figure 5-87: Views ignoring the safe area
Figure 5-88: Views at the bottom of the screen
Figure 5-89: Views expanding the safe area
Figure 5-90: Priorities by default
Figure 5-91: Custom priorities
Figure 5-92: View with a fixed size
Figure 5-93: Images aligned to the center
Figure 5-94: Alignment guides for the bus
Figure 5-95: Bus aligned with custom values
Figure 5-96: Images aligned by the baselines
Figure 5-97: Views aligned with custom alignment guides
Figure 5-98: Alignments required for the views
Figure 5-99: Views with a custom alignment
Figure 5-100: Modifiers applied to groups of views
Figure 5-101: Detail view
Figure 5-102: Swift files
Figure 5-103: Preview of the size of the view
Figure 5-104: Multiple previews with different environment configurations
Figure 5-105: Development Assets section
Figure 5-106: Asset Catalog option in the iOS panel
Figure 5-107: Asset Catalog for development
CHAPTER 6 - DECLARATIVE USER INTERFACE
Figure 6-1: User Interface
Figure 6-2: Initial state (left) and state after the button is pressed (right)
Figure 6-3: Title defined with the values of the @Binding property
Figure 6-4: States in light and dark appearances
Figure 6-5: App's model
Figure 6-6: Implementation of an observable object
Figure 6-7: Observable object model
Figure 6-8: Interface updated with an observable object
Figure 6-9: Text field initialized with the value in the model
Figure 6-10: Accessing the model through the environment
Figure 6-11: MVVM
Figure 6-12: Combining title and author in the model view
Figure 6-13: Button's action
Figure 6-14: Dynamic interface
Figure 6-15: Button disabled
Figure 6-16: Button with template image
Figure 6-17: Buttons with standard styles
Figure 6-18: Destructive button
Figure 6-19: Button of custom size
Figure 6-20: Button with custom styles
Figure 6-21: Context menu
Figure 6-22: Pull-down menu
Figure 6-23: Text field with a rounded border
Figure 6-24: Focus
Figure 6-25: Secure text field
Figure 6-26: Text editor
Figure 6-27: Switch on and off
Figure 6-28: Custom size and label for the switch
Figure 6-29: Toggle button in the on and off state
Figure 6-30: Custom style for the Toggle view
Figure 6-31: Slider for integer values
Figure 6-32: Slider states
Figure 6-33: Progress bar
Figure 6-34: Progress bar at work
Figure 6-35: Activity indicator
Figure 6-36: Stepper
Figure 6-37: Custom stepper
Figure 6-38: Group box
Figure 6-39: Control group
Figure 6-40: Control group for navigation
Figure 6-41: Combine
Figure 6-42: Publisher chain
Figure 6-43: Counter created with a TimerPublisher publisher
Figure 6-44: Size classes assigned to mobile devices
Figure 6-45: Different layouts for Compact and Regular size classes
Figure 6-46: Orientations
Figure 6-47: Image of relative size
Figure 6-48: Horizontal and vertical position
Figure 6-49: View measured by a GeometryReader view
Figure 6-50: Interface updated with preferences
CHAPTER 7 - LISTS
Figure 7-1: List of views generated by a ForEach loop
Figure 7-2: List of views with a standard design
Figure 7-3: List of views created from the data in the model
Figure 7-4: Scroll view
Figure 7-5: Horizontal scroll view
Figure 7-6: Custom scroll
Figure 7-7: Fixed grid
Figure 7-8: Flexible grid
Figure 7-9: Adaptive grid
Figure 7-10: List of rows created by a List view
Figure 7-11: Plain list
Figure 7-12: Custom list
Figure 7-13: Alternate backgrounds
Figure 7-14: Static and dynamic content
Figure 7-15: Sections with headers
Figure 7-16: Section separators
Figure 7-17: Same height for all the rows
Figure 7-18: Alphabetical sections
Figure 7-19: Automatic delete feature
Figure 7-20: Edit button
Figure 7-21: Move buttons
Figure 7-22: Selected rows
Figure 7-23: Custom selection
Figure 7-24: Custom swipe action
Figure 7-25: Custom button to remove a row
Figure 7-26: Refresh control
Figure 7-27: Hierarchical list
Figure 7-28: Custom hierarchy
Figure 7-29: Menu picker
Figure 7-30: Wheel and segmented pickers
Figure 7-31: Picker for dates
Figure 7-32: Wheel picker
Figure 7-33: Simple form
Figure 7-34: Form with a standard design
Figure 7-35: Disclosure groups
CHAPTER 8 - NAVIGATION
Figure 8-1: Multiple views to expand the interface
Figure 8-2: Navigation view
Figure 8-3: Inline mode
Figure 8-4: Navigation bar button
Figure 8-5: Group of buttons
Figure 8-6: Bottom toolbar
Figure 8-7: Search bar
Figure 8-8: Suggestions
Figure 8-9: Custom cancel button
Figure 8-10: Interface with two views
Figure 8-11: Custom back button
Figure 8-12: Interface with three views
Figure 8-13: Detail view
Figure 8-14: Sheet to insert new values
Figure 8-15: Sheet to edit values
Figure 8-16: Popover on iPad
Figure 8-17: Alert view
Figure 8-18: Alert view with multiple buttons
Figure 8-19: Confirmation dialog
Figure 8-20: TabView
Figure 8-21: Tabs
Figure 8-22: Views in a TabView view
Figure 8-23: More tab
Figure 8-24: Badge
Figure 8-25: Interface configured by the user
Figure 8-26: Pages
Figure 8-27: iPad app configured with two columns
Figure 8-28: Different design for iPhones and iPads
Figure 8-29: Link opens in the left column
Figure 8-30: Three-column layout
CHAPTER 9 - GRAPHICS AND ANIMATIONS
Figure 9-1: Standard shapes
Figure 9-2: Rectangle
Figure 9-3: Rectangles with different borders
Figure 9-4: Rectangle with a custom border
Figure 9-5: Graphic button
Figure 9-6: Linear gradient
Figure 9-7: Linear gradient with custom stops
Figure 9-8: Circular gradient
Figure 9-9: Conic gradient
Figure 9-10: Pattern
Figure 9-11: Custom path
Figure 9-12: Lines and arcs
Figure 9-13: Lines and ellipses
Figure 9-14: Complex curves
Figure 9-15: Path of relative size
Figure 9-16: Custom shape views
Figure 9-17: Image displaced to the right
Figure 9-18: Image rotated in the y axis
Figure 9-19: Image clipped with a Circle shape
Figure 9-20: Rotation
Figure 9-21: Mirror shapes
Figure 9-22: Incomplete shape
Figure 9-23: Image of a custom size
Figure 9-24: Shapes and text on the canvas
Figure 9-25: Rotation
Figure 9-26: Graphics rotation
Figure 9-27: Multiple rotations
Figure 9-28: Clipping mask
Figure 9-29: Multiple configurations
Figure 9-30: Filters
Figure 9-31: Animation by default
Figure 9-32: Animated path
CHAPTER 10 - CONCURRENCY
Figure 10-1: Asynchronous and concurrent programming
Figure 10-2: Button to add configuration options
Figure 10-3: App Transport Security option
Figure 10-4: App Transport Security configured to allow non-secure URLs
Figure 10-5: App Transport Security configured to allow URLs from formasterminds.com
Figure 10-6: Image loaded asynchronously
Figure 10-7: Image configuration
CHAPTER 11 - GESTURES
Figure 11-1: Image responding to the tap gesture
Figure 11-2: Responsive row
Figure 11-3: Drag and drop interface
Figure 11-4: Drag and drop gesture
Figure 11-5: Tool to split the screen on iPads
Figure 11-6: Drag and drop operation between apps
Figure 11-7: Drag and drop
Figure 11-8: Image reduced
Figure 11-9: Drag and drop onto a canvas
Figure 11-10: Indicator for a drag and drop operation
Figure 11-11: Image rotated by the user
CHAPTER 12 - MAP KIT
Figure 12-1: Map showing a specific region of New York City
Figure 12-2: Current latitude and longitude
Figure 12-3: Annotation on the map
Figure 12-4: Custom view for annotations
Figure 12-5: Custom image for annotations
Figure 12-6: Selected and deselected annotation
Figure 12-7: Places found by the Local Search system
Figure 12-8: Privacy - Location When In Use Usage Description option
Figure 12-9: User's location on the map
Figure 12-10: User location button
CHAPTER 13 - STORAGE
Figure 13-1: Interface to store settings
Figure 13-2: Displaying app settings
Figure 13-3: Settings view
Figure 13-4: Interface to create files
Figure 13-5: List of files
Figure 13-6: Files from two directories
Figure 13-7: Buttons to move and delete a file
Figure 13-8: Details view with the file's attributes
Figure 13-9: Interface to select and store an image
Figure 13-10: Interface to insert and store a text
Figure 13-11: Document app
Figure 13-12: Custom Document app
Figure 13-13: Export a document
Figure 13-14: Import a document
Figure 13-15: Application to create and export files
Figure 13-16: Content of a text file stored in the bundle
Figure 13-17: Interface to store a custom value in a file
Figure 13-18: Interface to store multiple values in a file
Figure 13-19: Values from a JSON file
Figure 13-20: Option to create a Core Data model in the iOS panel
Figure 13-21: Model editor
Figure 13-22: New Entities
Figure 13-23: New Attributes
Figure 13-24: Multiple Attributes
Figure 13-25: Option to store images outside the Persistent Store
Figure 13-26: Multiple Entities
Figure 13-27: Relationship for the Books entity
Figure 13-28: Relationship settings
Figure 13-29: Relationship for the Authors entity
Figure 13-30: Inverse Relationships
Figure 13-31: Graphic Style
Figure 13-32: Core Data stack
Figure 13-33: Entity's subclass
Figure 13-34: Interface to work with Core Data
Figure 13-35: Interface to list and add authors
Figure 13-36: Different sorting criteria
Figure 13-37: Searching
Figure 13-38: Interface to modify managed objects
Figure 13-39: Total number of books in the Persistent Store
Figure 13-40: Dynamic fetch request
Figure 13-41: Sections
Figure 13-42: Attribute to create alphabetical sections
Figure 13-43: Books in alphabetical sections
Figure 13-44: Many-To-Many relationship
CHAPTER 14 - NOTIFICATIONS
Figure 14-1: Interface to test notifications
Figure 14-2: Interface adapting to the keyboard
Figure 14-3: The interface scrolls to adapt to the keyboard
Figure 14-4: Custom adaptation
Figure 14-5: Different interface for portrait and landscape orientations
Figure 14-6: Authorization to deliver notifications
Figure 14-7: Notification
Figure 14-8: Media Attachment
Figure 14-9: Provisional notifications in the Notification Center
Figure 14-10: Notifications in an active application
Figure 14-11: Notifications in two groups
Figure 14-12: Summary option in Settings app
Figure 14-13: Notifications summary in the Lock screen
Figure 14-14: Actions in a notification
Figure 14-15: Notification with a button to open a text field
CHAPTER 15 - ICLOUD
Figure 15-1: Activating iCloud for our app
Figure 15-2: Activating iCloud services
Figure 15-3: iCloud account in the simulator
Figure 15-4: Interface to test Key-Value storage
Figure 15-5: Interface to store multiple values in Key/Value storage
Figure 15-6: iCloud Documents service
Figure 15-7: Container's name
Figure 15-8: Selected container
Figure 15-9: Interface to edit a document
Figure 15-10: Interface to read and save multiple documents
Figure 15-11: CloudKit service
Figure 15-12: Push Notifications
Figure 15-13: Background Mode
Figure 15-14: Databases configuration
Figure 15-15: Back references
Figure 15-16: Buttons in the main menu
Figure 15-17: Database panel
Figure 15-18: Database schema
Figure 15-19: Record types
Figure 15-20: Interface to work with CloudKit
Figure 15-21: Record's indexes
Figure 15-22: Index configuration
Figure 15-23: Interface to work with assets
Figure 15-24: Tokens
Figure 15-25: Core Data Model
Figure 15-26: Used with CloudKit option
CHAPTER 16 - MULTIPLATFORM APPLICATIONS
Figure 16-1: Folder for macOS specific code
Figure 16-2: Targets
Figure 16-3: My Mac option
Figure 16-4: Mac images
Figure 16-5: Mac application
Figure 16-6: Target selection
Figure 16-7: Multiplatform interface on a Mac
Figure 16-8: Standard menu
Figure 16-9: Custom menu
Figure 16-10: Option added to a standard menu
Figure 16-11: Standard option removed
Figure 16-12: Submenu
Figure 16-13: Option disabled
Figure 16-14: Mac toolbar
Figure 16-15: Tooltip
Figure 16-16: Highlighted rows and collapsable sections
Figure 16-17: Table
Figure 16-18: Column of checkboxes
Figure 16-19: Settings Scene
Figure 16-20: Support Multiple Windows option
Figure 16-21: Option to create a new window
Figure 16-22: Scene with custom values
CHAPTER 17 - FRAMEWORK INTEGRATION
Figure 17-1: UIKit view in a SwiftUI interface
Figure 17-2: UITextView view in a SwiftUI interface
Figure 17-3: UIKit view controller in a SwiftUI interface
CHAPTER 18 - WEB
Figure 18-1: Link
Figure 18-2: Custom URLs
Figure 18-3: Safari browser
Figure 18-4: Custom Safari view controller
Figure 18-5: Buttons for navigation
CHAPTER 19 - MEDIA
Figure 19-1: Interface to work with the camera
Figure 19-2: Photo Library's interface (center)
Figure 19-3: Multiple selection
Figure 19-4: System to capture media
Figure 19-5: Interface for a custom camera
Figure 19-6: Standard video player
Figure 19-7: Overlay views
Figure 19-8: System to play media
Figure 19-9: Controls for a custom video player
Figure 19-10: Color picker
CHAPTER 20 - APP STORE
Figure 20-1: Web page to manage certificates, provisioning profiles, and identifiers
Figure 20-2: AppIcon set with the icons for iPhones and iPads
Figure 20-3: Launch Screen options
Figure 20-4: Launch Screen configuration
Figure 20-5: Launch screen for our app
Figure 20-6: App Store Connect menu
Figure 20-7: Menu to add apps to our account
Figure 20-8: Bundle ID and SKU identifier
Figure 20-9: Archive option
Figure 20-10: List of archives created for our app
Figure 20-11: Options to configure the archive
Figure 20-12: Option to select automatic signing
Figure 20-13: Selecting the build to send to the App Store