tanford cs193p Lecture 1 - lecture note


ランダムファイルの作成


xcodeでsimple viewを作成すると、hello worldを印刷するビューが表示されます.
サンプルコードを以下に示します.
struct ContentView: View {
    var body: some View {
        Text("Hello World")
    }
}

ContentViewはシミュレータでは白い背景(View)で、中身はbody、bodyではText(HelloWorld)があることが理解できるだろう.
以上のコードはいくつかのキーワードを省略していますが、厳しい(?)と書く
struct ContentView: View {
    var body: some View {
        return Text("Hello World")
    }
}
一行が全部であればreturnキーワードは省略できるそうです.

Some


講義には「swiftのすべての変数はtypeを宣言し、すべての変数はvalueを持つべきだ」という言葉がよくある.
では、bodyのViewの前の「some」は何でしょうか.
some keyword that we use here is a switch feature that lets swift infer out inter return type automatically.
sometキーワードはreturn typeを自動的に推測できるキーワードである.簡単に言えば、タイプの名詩が不明確になったようだ.
ちなみに、上のコードから削除すると、このようなエラーが発生します.
Protocol 'View' can only be used as a generic constraint because it has Self or associated type requirements
どういう意味か分かりませんが、someがなく、Viewだけは使えません.HelloWorldをsomeではなく出力する場合は、このようにコードを変更できます.
struct ContentView: View {
    var body: Text {
        Text("Hello World")
    }
}
bodyのtypeをあるビューからTextに変更すればよい.ここからサイトを手に入れることができます.
1行のコードのbodyは最終的にhelloworldというテキストを返すので、bodyのtypeはViewではなくTextです.ただし、前述したように、一部のビューでもエラーは発生しません.
この場合、一部のビューはopaquetypeです.
Opaqueとは、中ではreturn typeを知っているが、外では隠れているものを知らないこと.opaquetypeで作成されたキーワードもあります.
struct ContentView: View {
    var body: some View {
        Text("Hello World")
    }
}
コードをもう一度見てみましょう.bodyがtexttypeを返していることを知っています.Textと書いてあるのでvar body:varbody:TextではなくsomeViewであれば、bodyの内部を見る必要がなく、bodyがText typeであることを知ることができます.しかしsomeViewと書いてあるので、bodyの内容が分からないと、bodyがどんなタイプを返すのか分かりません.これが一部の人が演じた役です.
Some Viewが提供できる情報は、「bodyはどのようなタイプを返すのか分からないが、Viewと同じ役割を果たしている」ということです.差が少ない.
では、なぜTextで具体的に説明するのではなく、何らかのViewを使うのでしょうか.bodyにもう少しcomponentを入れると原因がわかります.
struct ContentView: View {
    var body: HStack<TupleView<(Text, Text, Text)>> {
        HStack {
            Text("Hello World")
            Text("This is a Sample Code")
            Text("Goodbye World")
        }
    }
}
typeを具体的に明記する場合は、bodyに含まれるコンポーネントを1つずつ明記します.しかし,bodytypeをsomeで曖昧に表現すると,問題を解決しやすい.
図1には、4枚のカードをビューに表示するコードが記述されている.
import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack {
            ForEach(0..<4) { index in
                CardView(isFaceUp: false)
            }
        }
            .padding()
            .foregroundColor(Color.orange)
            .font(Font.largeTitle)
    }
}

struct CardView: View {
    var isFaceUp: Bool
    var body: some View {
        ZStack {
            if isFaceUp {
                RoundedRectangle(cornerRadius: 10.0).fill(Color.white)
                RoundedRectangle(cornerRadius: 10.0).stroke(lineWidth: 3.0)
                Text("👻")
            } else {
                RoundedRectangle(cornerRadius: 10.0).fill()
            }
        }
    }
}

HStack、RoundRectangleといったものは、すぐに見て覚える必要はなく、コード実習で知ることでしょう.(それでも大丈夫かな?)
しかし、SwitUIにはForEachという構造があることに注目してください.
Apple DeveloperサイトでForEach構造の説明を読むことができます.

リファレンス

  • Youtube video: Stanford CS193p iPhone Application Development Spring 2020
  • The Swift Programming Language
  • What’s this “some” in SwiftUI? - Mischa Hildebrand