初心者プログラミング日記 SwiftUI①

WWDC20「introduction to SwiftUI」を勉強中

会計学科というド文系の下記独学でイマココな感じです笑

初心者用の教本1冊→自作TODOアプリ作ろうとしてあと一歩のところでどれも断念

→Unityに2Dアプリ制作に逃げる→再度SwiftUI←イマココ

 

なかなかSwiftUIの日本人にわかりやすい教材がなく苦戦していました。

下記は字幕が日本語で出て、意味も取れるのでやってみることにしました。

developer.apple.com

 

プログラミングなのでプログラム内にコメントを残していたのですが、

SwiftUIの特徴も合わせて説明してくれるので、溢れてきたのでこちらにメモとして

残すことにしました。

 

//

//  ContentView.swift

//  Landmarks

//

//

 

 

//アプリView用のコード

//マルチプラットフォームのAppテンプレートを利用している。

//iPhoneの作業で記載してきた。

//ということで他のプラットフォームを確認する→iPad

//SwiftUIはナビゲーションViewを分割Veiwに変更する

//ナビViewでサンドイッチの選択がない場合は、何も表示されない

 

//目標:サンドイッチのListを変更可能なものにする。

//編集サポートを追加する

 

import SwiftUI

 

struct ContentView: View {

 

   //現在サンドイッチのデータモデルは固定値。

  //なので、データモデルを更新してサンドイッチを含むルートストアオブジェクトを作成。

   //時間の経過とともに変更されるようにする。

   //ストアとは店ではなく、データが蓄積されたもののこと。

    var sandwiches:[Sandwich] = []

    var body: some View {

        NavigationView{

        List{ //データ駆動型

            ForEach(sandwiches) { sandwich in //静的要素

            SandwichCell(sandwich: sandwich)

            }

            

            HStack {

                Spacer()//レイアウト要素

                Text("\(sandwiches.count) Sandwitches")

                    .foregroundColor(.secondary)

                Spacer()

            }

            

        }.navigationTitle("Sandwiches")

            //分割View用に追加する(iPhoneでは自動的に削除される)

            Text("Select a sandwich")

                .font(.largeTitle)

        }

    }

    }

 

//Xcodeはコードコンパイルして実行すると

//プレビューを表示する

struct ContentView_Previews: PreviewProvider {

    static var previews: some View {

        ContentView(sandwiches: testData)

    }

}

 

struct SandwichCell: View {

    var sandwich: Sandwich

    

    var body: some View {

        NavigationLink(destination:SandwichDetail(sandwich: sandwich)){

            HStack{

                Image(sandwich.thumbnailName)

                    .resizable()

                    .aspectRatio(contentMode: .fit)

                    .cornerRadius(8)

                

                VStack(alignment: .leading) { //セルの扱いになる。()内はViewの設定を変更している

                    Text(sandwich.name)

                    Text("\(sandwich.ingredientCount)ingredients")

                    //modifireというメソッドでViewの外観や動作をカスタマイズするのに使用する

                        .font(.subheadline)

                        .foregroundColor(.secondary)

                }

            }

        }

    }

}

 

//データモデルとは

現実世界の対象をデータ集合で表現しないと情報システムでは取り扱うことができない。

そのために、現実世界の対象を表す情報を抽象化して一定の構造や形式で記述したもの。

データモデルを作成することをデータモデリングという。

→なので今回でいうと、サンドイッチの種類をまとめたデータをもう少し現実的なデータにするよってことね。

データモデル(data model)とは - 意味をわかりやすく - IT用語辞典 e-Wordsから引用