この記事は、SwiftUIのモディファイアのチートシートです。よく使うモディファイアを一覧にしていきたいと思います。主に自分のために書いてます。。。使いながら更新していきます。
Button
| モディファイア | 説明 | リンク |
|---|---|---|
.padding() |
余白をつける | |
.background(.red) |
背景色を変更する | |
.cornerRadius(10) |
丸みをつける |
HStack
| モディファイア | 説明 | リンク |
|---|---|---|
.padding() |
余白をつける |
Image
| モディファイア | 説明 | リンク |
|---|---|---|
.scaledToFit() |
アスペクト比を維持しながら、親のViewに対して最大のサイズになる | |
.resizable() |
サイズを変える際に必ず必要になる | |
.frame(width: 10, height: 10, alignment: .center) |
幅、高さ、整列を変更できる | |
.padding() |
余白をつける |
List
| モディファイア | 説明 | リンク |
|---|---|---|
.listStyle(DefaultListStyle()) |
リストのスタイルを変更する |
NavigationView
| モディファイア | 説明 | リンク |
|---|---|---|
.navigationTitle("タイトル") |
ナビゲーションバーのタイトルを変更する ※NavigationViewの配下に記述する |
|
.navigationBarItems(leading: ボタン, trailing: ボタン) |
ナビゲーションバーの左右にボタンを配置する ※iOS14で非推奨 |
|
.toolbar{} |
ナビゲーションバーの左右にボタンを配置する | こちら |
.navigationBarTitleDisplayMode(.large) |
ナビゲーションバーのスタイルを変更する |
Text
| モディファイア | 説明 | リンク |
|---|---|---|
.frame(width: 10, height: 10, alignment: .center) |
幅、高さ、整列を変更できる | |
.multilineTextAlignment(.center) |
テキスト位置を調整できる |
TextField
| モディファイア | 説明 | リンク |
|---|---|---|
.padding() |
余白をつける | |
.textFieldStyle(RoundedBorderTextFieldStyle()) |
枠線を追加 |
TextView
| モディファイア | 説明 | リンク |
|---|---|---|
.onChange(of: freeText) { value in |
テキストを打つたびに呼ばれる | |
.frame(width: 10, height: 10, alignment: .center) |
幅、高さ、整列を変更できる | |
.overlay(RoundedRectangle(cornerRadius: 5).stroke(Color.gray, lineWidth: 1)) |
枠線をつけることができる | |
.padding() |
余白をつける | |
.accentColor(.red) |
アクセントカラー変更 |
View
.preferredColorScheme(.light)
ScrollView
.safeAreaInset(edge: .top, spacing: 0) {}
Color
.gradient
Capsule()
.fill()
