Lecture 1: Course Logistics and Introduction to SwiftUI

7371 ワード
stanford swiftui iOS テキストリンク
Stanford CS 193 p iPhoneアプリケーション開発Spring 2020をYouTubeで聴取し記録した.
Xcode 12での実験

Welcome


What is this course about


iOSを使用したSWIFIUI用のアプリケーションの開発(iOS 13から)
  • user interface paradigm
    reactive(MVVM)
    declarative(imperative)

    • Card Matching Game


    iOS>App(旧シングルビューアプリケーション)
    ライフサイクル:SWIFTUIアプリケーション、UIKETアプリケーション依頼の前者を選択して作成しますが、後者を選択する必要があります.
    インタフェース:SWIFTUI(UIKEt)/storyboard(旧バージョン)
    SWIFTUIはストーリーボードのすべての内容をカバーできません

    Finder上部メニュー>プリファレンス>サイドバー>ホーム>開発者

    動作仕様関数型


  • SWIFTUI(パッケージ)ベース依存
    SWIFTUIのインポートは、ベースがインポートされたものに等しい

  • ContentView behaves like a View

  • ContentViewはフルスクリーン表示を提供

  • ビューはその中の小さなボックスです

  • strut、クラス内のvar変数をpropertyと呼ぶ

  • 一部のビュー:Viewなどのデータ型

  • var body実行(execute)メモリに格納するのではなく

  • 戻りText()(returnは推定可能、省略可能)

  • ビューコンビネーションに接続するために、Viewというタイプを使用しています.
    使用するビューコンボはZStack

  • bodyにテキストのみの場合
    TextはViewで、いくつかのViewの代わりにTextを使うことができます.

  • HStackはピッチを設定することによってピッチを区切ることができる.
    paddingもspacingも、通常はデフォルト値を使用します
    • //
//  ContentView.swift
//  Memorize
//
//  Created by User on 2021/02/19.
//


import SwiftUI


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

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



struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

  • swift function callの例
    stroke <-> filling
    fillは画面を塗りつぶします.
    strokeは逆
    stroke()はViewを返します
  • ストローク(線幅:3)線の太さ

  • に火をつける
    ZStackの外がforegroundColor(Color.orange)と呼ばれている場合.
    内部はforegroundColorと呼ばれています
    • awk使用法之:行をマージ
    [React] useMemo, useCallback