CS193p Notes - Lecture 1: Course logistics and introduction to SwiftUI

You can develop apps to iOS, watchOS, etc. but inside them you have templates that are just starting points for certain type of apps.

Language: Swift

User Interface: SwiftUI (Storyboard is the same as UIKit)

• SwiftUI is a new thing and most of the old tutorials talk about UIKit

ContentView.swift

• By pressing resume you can see what the code looks like in a device. This updates automatically when the code is changed.
• ContectView_Previews is not something that's changed often and can be "hide" by adding a lot of line breaks. It just shows the View in the preview and can be deleted without getting any errors.

• SwiftUI is imported every time there is something happening in the UI and foundation is imported when we do something else because it contains things like arrays, dictionaries, etc.

• struct in Swift is more powerful than in some other languages because instead of just storing variables it can contain functions and behaviors.

• struct ContectView: View means that ContectView behaves/functions like View

• ContentView is the whole app background area of the device.

• var (variable) inside struct is called property.

• var body: some View where some View is type.

  • some keyword means that it can be any type as long as it behaves like View

• View returns one view but ViewContainer returns multiple.

• One line function doesn't need return keyword.

• some View could be Text in this example

  • some View is better format because then compiler makes the decision and often the return type changes which would also require changing this if not using some View

• It's normal to use labels when giving parameters to functions

  • return RoudedRectangle(cornerRadius: 10.0)

struct ContentView: View {
  var body: some View {
    return ZStack(content: {
      RoundedRectangle(cornerRadius: 10.0).stroke().foregroundColor(Color.orange)
      Text("ghost")
    })
  }
}

• Some people put .something (called View Function) to new line to stand out from other code more easily

struct ContentView: View {
  var body: some View {
    return ForEach(0..<4, content: { index in  
      ZStack(content: {
        RoundedRectangle(cornerRadius: 10.0).fill(Color.white)
        RoundedRectangle(cornerRadius: 10.0).stroke(lineWidth: 3)
        Text("ghost")
      })
    })
        .padding()
        .foregroundColor(Color.orange)
        .font(Font.largeTitle)
  }
}

• 0..<4 is same as [0,1,2,3]
• Two RoundedRectangle because the other is border and other is the background.

• ForEach is not Layout View the same way ZStack and that is why it should be inside a Layout View.

• If the last argument of a function is curly brace function it can be written abc(first: 1) {stuff} after the function call.

  • If no other arguments () can be removed too.

@RealLankinen

• Notes 1
• Notes 2
• Notes 3
• Notes 4
• Notes 5
• Notes 6
• Notes 7
• Notes 8
• Notes 9
• Notes 10
• Notes 11
• Notes 12
• Notes 13
• Notes 14

Originally published here