0Pricing
Swift Academy · レッスン

Spacer、Padding、Frameモディファイア

Spacerで柔軟な間隔を作り、frameで明示的なサイズを設定します。

「Spacer、Padding、Frameモディファイア」はCoddyKit上の無料Swift Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSwift Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Swift Academyコースには全4レッスンが含まれています。

ようこそ

`Spacer`、`.padding()`、`.frame()` は、SwiftUI で間隔とサイズを制御するための主要なツールです。それぞれの使い方をしっかり身につけましょう。

Spacer — 柔軟なスペース

```swift HStack { Text("Left") Spacer() // fills all available space Text("Right") } ``` `Spacer` は、スタックの軸方向に残っているスペースを埋めるように広がります。

最小長

```swift Spacer(minLength: 20) // at least 20pt even if compressed ```

.padding() モディファイア

```swift Text("Hello") .padding() // default 16pt all sides .padding(.horizontal, 24) // custom horizontal .padding(.top, 8) // custom top only ```

.padding と EdgeInsets

```swift Text("Hi") .padding(EdgeInsets(top:10,leading:20,bottom:10,trailing:20)) ```

.frame() — 明示的なサイズ

```swift Text("Button") .frame(width: 200, height: 44) .background(Color.blue) .foregroundColor(.white) ```

.frame(maxWidth:)

```swift Button("Full Width") {} .frame(maxWidth: .infinity) .padding() .background(Color.accentColor) ```

.frame(alignment:)

```swift Text("Left") .frame(width: 200, alignment: .leading) .border(Color.gray) // Text aligns left within the 200pt wide frame ```

fixedSize

```swift Text("Long text that should not wrap") .fixedSize() // prevents truncation / wrapping ```

Spacer と Frame の組み合わせ

```swift VStack { Spacer() Text("Bottom") .frame(maxWidth: .infinity) .padding() } ```

確認問題

`HStack` 内の `Spacer()` は何をしますか？

まとめ

重要なポイント： • `Spacer()` は利用可能なスペースを埋めます。最小間隔には `Spacer(minLength:)` を使用します • `.padding()` はインセットを追加します。正確に指定するには、辺と量を指定します • `.frame(width:height:)` は固定サイズを設定します • `.frame(maxWidth: .infinity)` はスペース全体を埋めるように広がります • `.fixedSize()` は切り詰めを防ぎます 次は `GeometryReader` です。

よくある質問

「Spacer、Padding、Frameモディファイア」レッスンは無料ですか？

はい。「Spacer、Padding、Frameモディファイア」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Swift Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Swift Academyコースには全4レッスンが含まれています。

「Spacer、Padding、Frameモディファイア」で何を学びますか？

Spacerで柔軟な間隔を作り、frameで明示的なサイズを設定します。 ブラウザで直接実行するハンズオンコードでSwift Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Swift Academyを始めるのに経験は必要ですか？

事前経験は必要ありません。CoddyKitのSwift Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。

「Spacer、Padding、Frameモディファイア」レッスンにはどのくらい時間がかかりますか？

ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このSwift Academyレッスンでコードを書いて実行できますか？

はい。すべてのSwift Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. VStack、HStack、ZStackの基礎
  2. LazyVGridとLazyHGrid
  3. Spacer、Padding、Frameモディファイア
  4. 適応型レイアウトのためのGeometryReader
← Swift Academyに戻る