App icon and launch screen in iOS Swift - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to set the app icon name in the Info.plist file.

iOS Swift

"CFBundleIcons": {"CFBundlePrimaryIcon": {"CFBundleIconName": "[1]"}}

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

ALaunchImage

BAppIcon

CMainIcon

DIconSet

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'LaunchImage' instead of 'AppIcon' causes the app icon not to appear.

Misspelling the icon name in Info.plist.

The app icon name in Info.plist should be set to "AppIcon" to match the asset catalog name.

2fill in blank

medium

Complete the code to set the launch screen storyboard file name in Info.plist.

iOS Swift

"UILaunchStoryboardName": "[1]"

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

ALaunchView

BMain

CLaunchScreen

DSplashScreen

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'Main' instead of 'LaunchScreen' causes the launch screen not to show.

Misspelling the storyboard name in Info.plist.

The launch screen storyboard file is usually named "LaunchScreen" by default.

3fill in blank

hard

Fix the error in the launch screen storyboard reference in Info.plist.

iOS Swift

"UILaunchStoryboardName": "[1]"

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

ALaunchScreen

Blaunchscreen

ClaunchScreen

Dlaunch_screen

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase or snake_case causes the launch screen not to load.

Not matching the storyboard file name exactly.

The launch screen storyboard name is case-sensitive and should be exactly "LaunchScreen".

4fill in blank

hard

Fill both blanks to define the app icon sizes and scales in the asset catalog JSON.

iOS Swift

{ "images": [ { "size": "[1]", "scale": "[2]" } ] }

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

A20x20

B2x

C3x

D40x40

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing size and scale values incorrectly.

Using unsupported sizes or scales.

App icons use size "20x20" and scale "2x" for certain device icon sizes.

5fill in blank

hard

Fill all three blanks to create a launch screen label with accessibility in SwiftUI.

iOS Swift

Text("Welcome")
  .font(.largeTitle)
  .accessibilityLabel("[1]")
  .accessibilityHint("[2]")
  .accessibilityAddTraits([3])

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

AWelcome screen title

BShows welcome message on launch

C.isHeader

D.isButton

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong accessibility traits like .isButton for a label.

Not providing accessibility hints.

Accessibility label describes the text, hint explains its purpose, and .isHeader marks it as a header.

Practice

1. What is the main purpose of the app icon in an iOS app?

easy

A. To display the app's settings menu

B. To represent the app on the home screen and App Store

C. To show a loading animation when the app starts

D. To provide user notifications

Solution

1. Step 1: Understand what an app icon is

   The app icon is the image users see on their device's home screen and in the App Store.

2. Step 2: Identify the purpose of the app icon

   It visually represents the app so users can recognize and open it easily.

3. Final Answer:

   To represent the app on the home screen and App Store -> Option B

4. Quick Check:

   App icon = app representation [OK]

Hint: App icon shows your app's picture on the device [OK]

Common Mistakes:

• Confusing app icon with launch screen
• Thinking app icon controls notifications
• Believing app icon shows loading animations

2. Which file or folder is used to set the app icon images in an Xcode iOS project?

easy

A. Assets.xcassets/AppIcon.appiconset

B. Main.storyboard

C. Info.plist

D. LaunchScreen.storyboard

Solution

1. Step 1: Identify where app icons are stored

   App icons are placed inside the Assets.xcassets folder, specifically in the AppIcon.appiconset.

2. Step 2: Differentiate from other files

   LaunchScreen.storyboard is for launch screens, Info.plist holds app settings, and Main.storyboard is for UI layout.

3. Final Answer:

   Assets.xcassets/AppIcon.appiconset -> Option A

4. Quick Check:

   App icons = Assets.xcassets/AppIcon.appiconset [OK]

Hint: App icons live in Assets.xcassets, not storyboard files [OK]

Common Mistakes:

• Choosing storyboard files for app icons
• Confusing Info.plist with icon storage
• Not knowing Assets.xcassets purpose

3. Given the following code snippet in an iOS app project, what will the launch screen display when the app starts?

/* LaunchScreen.storyboard contains a centered image named 'LaunchImage' */
// No code changes to launch screen

medium

A. The image named 'LaunchImage' centered on the screen

B. A blank white screen

C. The app icon displayed full screen

D. An error because launch screen needs code

Solution

1. Step 1: Understand launch screen storyboard setup

   The LaunchScreen.storyboard has a centered image named 'LaunchImage'. This storyboard is shown while the app loads.

2. Step 2: Predict what appears on launch

   Since the storyboard shows the image centered, the launch screen will display that image centered on the screen.

3. Final Answer:

   The image named 'LaunchImage' centered on the screen -> Option A

4. Quick Check:

   Launch screen storyboard shows its content [OK]

Hint: Launch screen shows storyboard content, no code needed [OK]

Common Mistakes:

• Thinking launch screen shows app icon automatically
• Assuming launch screen is blank without code
• Believing launch screen requires Swift code

4. You set a launch screen storyboard but when running the app, the launch screen shows a black screen instead of your design. What is the most likely cause?

medium

A. The app's Info.plist is missing

B. The app icon images are missing

C. The storyboard file has syntax errors in Swift code

D. The launch screen storyboard is not assigned in the project settings

Solution

1. Step 1: Check launch screen assignment

   If the launch screen storyboard is not set in the project settings under 'Launch Screen File', the app shows a black screen on launch.

2. Step 2: Rule out other causes

   Missing app icons or Info.plist issues do not cause black launch screens. Storyboards do not contain Swift code, so no syntax errors apply.

3. Final Answer:

   The launch screen storyboard is not assigned in the project settings -> Option D

4. Quick Check:

   Launch screen file must be set in project [OK]

Hint: Always assign launch storyboard in project settings [OK]

Common Mistakes:

• Confusing app icon issues with launch screen problems
• Expecting Swift code in storyboard files
• Ignoring project settings for launch screen

5. You want your app to show a launch screen with a background color and a centered logo image. Which steps correctly set this up in Xcode?

hard

A. Write Swift code in AppDelegate to display the image and background color on launch

B. Add the logo image to Assets.xcassets and set it as the app icon; no storyboard needed

C. Create a LaunchScreen.storyboard with a view colored as background and an image view centered; assign this storyboard in project settings

D. Set the background color and image in Info.plist under launch screen keys

Solution

1. Step 1: Design launch screen in storyboard

   Create a LaunchScreen.storyboard file with a view that has the desired background color and add an image view centered with the logo image.

2. Step 2: Assign launch screen storyboard in project

   In Xcode project settings, set the 'Launch Screen File' to this storyboard so the system shows it on app launch.

3. Final Answer:

   Create a LaunchScreen.storyboard with a view colored as background and an image view centered; assign this storyboard in project settings -> Option C

4. Quick Check:

   Launch screen = storyboard design + project assignment [OK]

Hint: Use storyboard for launch screen design, assign in settings [OK]

Common Mistakes:

• Trying to set launch screen via Info.plist
• Confusing app icon with launch screen setup
• Attempting to use Swift code for launch screen UI