Creating and combining views — SwiftUI Tutorials やってみた

概要

Creating and combining views — SwiftUI Tutorials | Apple Developer Documentation をやってみたのでメモ

メモ

Section1: Create a new project and explore the canvas

• Organization Identiifier 決めないと Next 押せない
  • Javaのパッケージ名みたいなやつswiftにもあるのか...
  • Project 開いてみたらパッケージ名みたいなやつは見当たらない
  • これは何...?
• Preview は専用のマクロみたいなのを書いたら画面に表示される
  • previewのためのコードが残るのはいいのか悪いのか
• Image とか Text で要素を宣言して、宣言した要素にメソッドチェーンで style を書いて行く方式
  • webとは違ってまた独特の世界観
  • cssと違って要素ごとに適用可能な style を絞れるからコンポーネント単位の開発としては良いのか...?
  • まだわからん
• VStack で縦に並べられる
  • MUIっぽい

Section2: Customize the text view

• SwiftUI Inspector で preview を直接変更できる
  • コードにも反映される
• コードの方でも inspector が使える
  • こっちはあまり使い所がわからないけど、なんの情報が設定できるのかとかをみれるからいいのか...？

Section 3: Combine views using stacks

• body の中の view は single じゃないといけないっぽい
  • 複数組み合わせる場合には stack でまとめる
  • Reactで <></> とかでくくる感じか
• 右上の + ボタンからUIで要素追加できる
  • うーーーん、嬉しいのか...?
• VStack と HStack 組み合わせて縦横並べる
  • stack に alignment などを設定できる
  • padding を設定したりもできる
• Spacer
  • 空けたいスペースをSpacerで確保できる

Section 4: Create a custom image view

• 画像はアセットカタログに読み込ませる
• 丸く切り抜いたり overlay できたりする

Section 5: Use SwiftUI views from other frameworks

• MapKit で地図を表示する方法
• WWDCとかで何とかKitってよく聞くけどこういうことか

Section 6: Compose the detail view

• 今まで作ったものを組み合わせる
• view として作ったものも、height / offset / padding などを設定できる
• 上寄せにするのをSpacerでやるのか...ちょっとこれは慣れの問題か...

Check Your Understanding

• 最後に簡単な確認テストがついてた
• これは理解度を確認できてとても良い