配置と間隔
CoddyのSwiftジャーニー「SwiftUI入門」セクションの一部。レッスン 11/50。
VStackはビューを中央揃えにし、ビュー間に小さなデフォルトの間隔を空けます。スタックを作成するときに、どちらも変更できます:
VStack(alignment: .leading, spacing: 12) {
Text("Order #42")
.font(.headline)
Text("2 coffees")
Text("Ready at 10:30")
}alignment: .leadingはビューを左端に揃えます(.trailingは右端です)。spacing: 12は各ビューの間に12ポイントの間隔を設定します。
HStack は代わりに垂直方向に整列します:.top、.center、または .bottom:
HStack(alignment: .top, spacing: 20) {
Text("Left")
Text("Right")
}チャレンジ
簡単レシートがリストのように読めるように、VStackの配置を.leadingに設定し、間隔を12に設定します。
自分で試してみよう
import SwiftUI
@main
struct CoddyApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
SwiftUI入門のすべてのレッスン
自分で練習してみよう: Swiftプレイグラウンド