Menu

Tech

English

Recap - Weather Card

Part of the Introduction to SwiftUI section of Coddy's Swift journey. Lesson 13 of 50.

Challenge

Medium

Build a weather card. It is a VStack with spacing: 8 that shows, from top to bottom:

The cloud.sun.fill symbol
The text London with the .title font
An HStack with two texts: H: 21 and L: 12

Try it yourself

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

All lessons in Introduction to SwiftUI

1Introduction

What Is SwiftUI The App File

4Modifiers

Padding Backgrounds Modifier Order Frames And Shapes Recap - Badge Maker

7Lists

ForEach Identifiable Items List Adding Items Recap - Shopping List

10Project - Coddy Coffee

Project Overview Drink Screens

Project lesson

Project lesson

Quantity And Total

Project lesson

Place The Order

Project lesson

2Showing Content

Text Views Numbers In Text Fonts Colors SF Symbols Recap - Price Tag

5State & Buttons

Buttons The @State Property True Or False State Conditional Views Recap - Score Keeper

8Navigation

NavigationStack NavigationLink Passing Data Sheets And Alerts Recap - Plant Guide

11Final Challenges

Tip Calculator To-Do List True Or False Game

3Stacks & Layout

VStack HStack Alignment And Spacing Spacer And ZStackRecap - Weather Card

6User Input

TextField Toggle Stepper And Slider Picker Recap - Order Form

9Sharing Data

The @Binding Property Observable Objects Environment Objects Recap - Step Counter

Practice on your own: Swift playground