SwiftUI Academy · レッスン

ボタンの無効化と有効化

disabled モディファイアで操作性を制御します。

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

このレッスンの一部はまだ翻訳されておらず、英語で表示されています。

Sometimes Tapping Should Wait

Not every button should always be tappable. A submit button might wait until a form is valid. SwiftUI handles this with the disabled modifier. 🚦

The disabled Modifier

Add disabled to any control and pass true or false. When true, the button stops responding to taps right away.

Button("Send") { send() }
    .disabled(true)

Driving It With a Condition

Instead of a fixed value, pass a condition. The button enables and disables itself as the underlying data changes.

Button("Send") { send() }
    .disabled(message.isEmpty)

Tied to State

Pair disabled with a state value and SwiftUI re-evaluates it on every change. The button reacts the moment your data updates.

@State private var name = ""

Button("Save") { save() }
    .disabled(name.isEmpty)

The Dimmed Look

A disabled button automatically appears dimmed. This visual cue tells people it is not ready yet, with no extra styling from you.

Validating a Form

A classic use is form validation: keep the action button off until every required field passes its check.

Button("Register") { register() }
    .disabled(!isFormValid)

Preventing Double Taps

During a slow task, disable the button so users cannot tap it again. Flip a loading flag while the work is running.

Button("Upload") { startUpload() }
    .disabled(isLoading)

Disabling a Whole Group

Apply disabled to a container and every control inside inherits it. One modifier can lock down an entire section at once.

VStack {
    Button("A") { a() }
    Button("B") { b() }
}
.disabled(isLocked)

Children Cannot Re-enable

Once a parent is disabled, a child cannot turn itself back on. The most restrictive disabled value in the chain wins.

Disabled Still Communicates

A disabled button is not broken; it is honest. It signals that an action is unavailable right now, guiding users toward what to do first.

Enable by Flipping the Value

To re-enable, simply make the condition false again. Update the state it depends on and SwiftUI brings the button back to life.

Button("Confirm") { confirm() }
    .disabled(!agreedToTerms)

Quick Check

One last check on enabling and disabling.

Recap

Excellent! The disabled modifier locks a button based on a condition, dims it automatically, and re-enables when the value flips back. 🚦

よくある質問

「ボタンの無効化と有効化」レッスンは無料ですか？

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

「ボタンの無効化と有効化」で何を学びますか？

disabled モディファイアで操作性を制御します。ブラウザで直接実行するハンズオンコードでSwiftUI Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

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

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

「ボタンの無効化と有効化」レッスンにはどのくらい時間がかかりますか？

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

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

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

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

← SwiftUI Academyに戻る