【Swift】.scrollDismissesKeyboardとは？意味や使い方、活用シーンをわかりやすく解説

2025.08.16 2025.08.16

SwiftUIでフォームやリストをスクロールしているとき、「スクロールに合わせてキーボードを閉じたい」と思ったことはありませんか？

そんなときに活躍するのが .scrollDismissesKeyboard() という修飾子です。

この修飾子を使うことで、ユーザーのスクロール操作に応じてキーボードを自動的に閉じる挙動を簡単に実装できます。

この記事では .scrollDismissesKeyboard() の基本的な意味や使い方、活用シーン、注意点までをわかりやすく丁寧に解説します。

.scrollDismissesKeyboard とは？

.scrollDismissesKeyboard() は、スクロール操作に応じてキーボードの表示・非表示を制御するためのSwiftUIのView修飾子です。

特に ScrollView や List などのスクロールコンテナに対して使われ、キーボードが表示された状態でスクロールしたときに、自動的にキーボードを閉じるかどうかを決定できます。

iOSではフォームやチャット画面などでよく見られる「スクロールするとキーボードが引っ込む」挙動を、SwiftUIでもこの修飾子で実現できます。

この .scrollDismissesKeyboard() 修飾子は View プロトコルの拡張として提供されており、任意のViewに適用できます。

具体例①：フォーム画面でのキーボード自動閉じを実装

struct ContentView: View {
    @State private var name = ""
    @State private var email = ""

    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                TextField("名前", text: $name)
                    .textFieldStyle(.roundedBorder)

                TextField("メールアドレス", text: $email)
                    .textFieldStyle(.roundedBorder)
            }
            .padding()
        }
        .scrollDismissesKeyboard(.interactively)
    }
}

struct ContentView: View {

@State private var name = ""

@State private var email = ""

var body: some View {

ScrollView {

VStack(spacing: 20) {

TextField("名前", text: $name)

.textFieldStyle(.roundedBorder)

TextField("メールアドレス", text: $email)

.textFieldStyle(.roundedBorder)

}

.padding()

}

.scrollDismissesKeyboard(.interactively)

}

このように .scrollDismissesKeyboard(.interactively) を追加するだけで、スクロール中に指を動かすとキーボードが自然に閉じるようになります。

とても簡単にユーザー体験を改善できます。

.scrollDismissesKeyboard の引数（動作モード）

この修飾子は、動作モードを以下のように引数で指定できます：

モード	説明
`.automatic`	システムのデフォルトに従う（多くの場面でキーボードは残る）
`.immediately`	スクロールが始まった瞬間にキーボードを閉じる
`.interactively`	スクロール中にキーボードが連動して少しずつ閉じる（自然な挙動）
`.never`	スクロールしてもキーボードを閉じない

もっとも自然な体験を提供できるのは .interactively で、ユーザーがスクロールしながらキーボードを下げる挙動が視覚的にも直感的です。

.scrollDismissesKeyboard の活用シーン

.scrollDismissesKeyboard() は、フォームや入力画面におけるユーザー体験を改善するための修飾子です。

特に「入力とスクロールが重なる場面」で効果を発揮し、ユーザーが意図的にキーボードを閉じたいときの操作を自然に補助してくれます。

入力フォームや設定画面で、スクロールとキーボードの両立が必要なとき
キーボードが画面を隠してしまうのを避けたいとき
スクロール時に意図的にキーボードを閉じてUIを広く見せたいとき
Chatアプリなどで、入力欄のすぐ上にリストがある場面

ユーザーはスクロールで画面を動かすことで「今は入力を中断したい」と判断することが多いです。

その意思に自然に応える形で .scrollDismissesKeyboard() を使うとUXが大きく向上します。

.scrollDismissesKeyboard の注意点

便利な一方で、.scrollDismissesKeyboard() には適用できる条件や挙動の制約があります。

正しく使わないと「効いていない」と感じるケースがあるため、あらかじめ理解しておくことが大切です。

対象となるViewは スクロール可能なもの（ScrollViewやListなど）に限られます
.focused() や @FocusState と併用する場合、意図せずキーボードが閉じてしまうことがあるため制御の順序に注意
.scrollDismissesKeyboard() を設定しても、TextFieldが Form の中にある場合などは効果が弱まることがあります（ScrollView の方が確実）

これらのポイントを押さえておけば、フォームやチャット画面などでより快適な入力体験を実現でき、キーボードによる視認性の低下を防ぐことができます。

まとめ

今回は .scrollDismissesKeyboard() について詳しく紹介しました。

.scrollDismissesKeyboard() は、スクロールに応じてキーボードを自動で閉じるためのView修飾子
.interactively を使えば、より自然な閉じ方を実現できる
フォームや入力画面のUX改善に効果的
ScrollView や List に適用して、入力体験をスムーズにする

ユーザーが「入力を終えて画面を見たい」と思ったとき、スクロールだけでキーボードが自然に閉じるのは非常に直感的な体験です。

ちょっとした追加で大きな改善につながるので、入力画面では積極的に取り入れてみましょう。