Section headers and footers in iOS Swift - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to set a section header title in a UITableView.

iOS Swift

func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return [1]
}

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

A"Section Header"

Bsection

CtableView

Dnil

Attempts:

3 left

💡 Hint

Common Mistakes

Returning the section number instead of a string.

Returning nil when you want a header to show.

The method titleForHeaderInSection returns a string to display as the section header title. Here, we return a fixed string.

2fill in blank

medium

Complete the code to provide a custom UIView as a section footer in UITableView.

iOS Swift

func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    let footerView = UIView()
    footerView.backgroundColor = [1]
    return footerView
}

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

AtableView

Bsection

CUIColor.red

Dnil

Attempts:

3 left

💡 Hint

Common Mistakes

Returning nil which means no footer view.

Using the section number instead of a color.

The viewForFooterInSection method returns a UIView to display as the footer. Setting the background color to UIColor.red makes it visible.

3fill in blank

hard

Fix the error in this code to set the height for a section header.

iOS Swift

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return [1]
}

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

AtableView.sectionHeaderHeight

Bnil

C"50"

D50

Attempts:

3 left

💡 Hint

Common Mistakes

Returning a string instead of a number.

Returning nil which is not allowed.

The method expects a CGFloat value, so returning the number 50 without quotes is correct. Returning a string causes an error.

4fill in blank

hard

Fill both blanks to create a UILabel for a section header view with text and color.

iOS Swift

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let label = UILabel()
    label.text = [1]
    label.textColor = [2]
    return label
}

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

A"Header Title"

BUIColor.blue

CUIColor.green

D"Footer Title"

Attempts:

3 left

💡 Hint

Common Mistakes

Using a color for the text property.

Using a string for the textColor property.

The label's text should be a string like "Header Title" and the text color a UIColor like UIColor.blue.

5fill in blank

hard

Fill all three blanks to create a footer view with a UILabel showing section number and custom color.

iOS Swift

func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    let footer = UIView()
    let label = UILabel()
    label.text = [1]
    label.textColor = [2]
    footer.addSubview(label)
    footer.backgroundColor = [3]
    return footer
}

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

A"Footer for section \(section)"

BUIColor.darkGray

CUIColor.lightGray

D"Header for section"

Attempts:

3 left

💡 Hint

Common Mistakes

Not using string interpolation for the label text.

Mixing up colors for text and background.

The label text uses string interpolation to show the section number. The label text color is UIColor.darkGray and the footer background color is UIColor.lightGray.