iOS ecosystem overview (iPhone, iPad, Apple Watch) in iOS Swift - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a basic SwiftUI view for iPhone.

iOS Swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text([1])
            .padding()
    }
}

Drag options to blanks, or click blank then click option'

AText("Hello, iPhone!")

BHello, iPhone!

C"Hello, iPhone!"

DText

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting quotes around the string

Passing a Text view inside another Text view

The Text view requires a string literal inside quotes to display text properly.

2fill in blank

medium

Complete the code to detect the device type in SwiftUI.

iOS Swift

import UIKit
import SwiftUI

struct DeviceView: View {
    var body: some View {
        Text("Device: \(UIDevice.current.[1])")
    }
}

Drag options to blanks, or click blank then click option'

Amodel

Bname

CsystemName

DidentifierForVendor

Attempts:

3 left

💡 Hint

Common Mistakes

Using name which returns the device name set by user

Using systemName which returns OS name

UIDevice.current.model returns the device type like "iPhone" or "iPad".

3fill in blank

hard

Fix the error in the code to show a WatchKit interface label.

iOS Swift

import WatchKit
import Foundation

class InterfaceController: WKInterfaceController {
    @IBOutlet var label: WKInterfaceLabel!

    override func awake(withContext context: Any?) {
        super.awake(withContext: context)
        label.[1]("Hello, Apple Watch!")
    }
}

Drag options to blanks, or click blank then click option'

AsetLabel

Btext

CupdateText

DsetText

Attempts:

3 left

💡 Hint

Common Mistakes

Trying to assign text property directly

Using non-existent methods like setLabel or updateText

WKInterfaceLabel uses setText(_:) method to update its text content.

4fill in blank

hard

Fill both blanks to create a SwiftUI view that adapts layout for iPad and iPhone.

iOS Swift

import SwiftUI

struct AdaptiveView: View {
    @Environment(\.horizontalSizeClass) var sizeClass

    var body: some View {
        if sizeClass == [1] {
            Text("iPad Layout")
        } else {
            Text("[2] Layout")
        }
    }
}

Drag options to blanks, or click blank then click option'

A.regular

B.compact

CiPhone

DiPad

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up .regular and .compact

Using device names instead of size classes

iPads usually have a regular horizontal size class, while iPhones have compact. So we check for .regular and show compact layout otherwise.

5fill in blank

hard

Fill all three blanks to create a SwiftUI view that shows different text for iPhone, iPad, and Apple Watch.

iOS Swift

import UIKit
import SwiftUI

struct DeviceSpecificView: View {
    var device = UIDevice.current.model

    var body: some View {
        switch device {
        case [1]:
            Text("Welcome iPhone user")
        case [2]:
            Text("Welcome iPad user")
        case [3]:
            Text("Welcome Apple Watch user")
        default:
            Text("Welcome user")
        }
    }
}

Drag options to blanks, or click blank then click option'

A"iPhone"

B"iPad"

C"Watch"

D"Apple Watch"

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect strings like "Watch" instead of "Apple Watch"

Forgetting quotes around strings

UIDevice.current.model returns "iPhone" or "iPad". Apple Watch is identified as "Apple Watch" string in this context.