エラー処理とUX
sealed class(Loading/Success/Error)でUIの状態をモデル化します。ProgressBarや、Retryアクション付きのSnackbarを表示し、TextInputLayoutでインラインの入力検証エラーを示します。
「エラー処理とUX」はCoddyKit上の無料Android Academyレッスンです。 これはレッスン3/6です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはAndroid Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Android Academyコースには全6レッスンが含まれています。
エラー処理が重要な理由
説明もなくクラッシュしたりフリーズしたりするアプリは、壊れているように感じられます。ユーザーは何が起きたのか、次に何をすればよいのか分かりません。
適切なエラー処理には、次のことが含まれます。
- アプリが安定して動作する
- ユーザーに明確なメッセージを表示する
- 再試行したり、必要な操作を行ったりできる
これが、アプリの評価が星2つになるか星5つになるかの違いです。
UI状態のモデル化
すべてのUI状態をsealed classでモデル化する、分かりやすいパターンを紹介します。
Loading— リクエストの処理中Success(data)— データを利用できるError(message)— 何らかの問題が発生した
ViewModelがこれらの状態のいずれかを発行し、UIがその状態を描画します。
Sealed Class UiState
考えられるすべての状態に対応するsealed classを定義します。
sealed class UiState<out T> {
object Loading : UiState<Nothing>()
data class Success<T>(val data: T) : UiState<T>()
data class Error(val message: String) : UiState<Nothing>()
}
// In ViewModel:
private val _state = MutableLiveData<UiState<List<Post>>>()
val state: LiveData<UiState<List<Post>>> = _state
fun loadPosts() {
_state.value = UiState.Loading
viewModelScope.launch {
try {
val posts = withContext(Dispatchers.IO) { repo.getPosts() }
_state.value = UiState.Success(posts)
} catch (e: Exception) {
_state.value = UiState.Error(e.message ?: "Unknown error")
}
}
}UIでの状態の描画
状態を監視し、それぞれのケースに応じた適切なビューを表示します。
viewModel.state.observe(this) { state ->
when (state) {
is UiState.Loading -> {
binding.progressBar.visibility = View.VISIBLE
binding.recyclerView.visibility = View.GONE
binding.tvError.visibility = View.GONE
}
is UiState.Success -> {
binding.progressBar.visibility = View.GONE
binding.recyclerView.visibility = View.VISIBLE
adapter.submitList(state.data)
}
is UiState.Error -> {
binding.progressBar.visibility = View.GONE
binding.tvError.text = state.message
binding.tvError.visibility = View.VISIBLE
}
}
}読み込み中のProgressBar
データを待機している間はProgressBarを表示します。
- 回転するローダーには
android:indeterminate="true"を使用します View.VISIBLEとView.GONEを切り替えて表示状態を変更しますGONEはビューを非表示にするだけでなく、レイアウトから除外します(スペースも占有しません)
SnackbarとToastの比較
エラーメッセージにはToastよりもSnackbarを優先します。
- Snackbarにはアクションボタン(例:「再試行」)を追加できます
- 現在の画面に付随するため、他のアプリの上に浮かびません
- 自動的に消えるか、タップして消去できます
再試行機能付きSnackbar
再試行アクションボタン付きのエラーを表示します。
import com.google.android.material.snackbar.Snackbar
fun showError(message: String) {
Snackbar.make(
binding.root, // root view of the screen
message,
Snackbar.LENGTH_INDEFINITE // stays until dismissed
).setAction("Retry") {
viewModel.loadPosts() // retry the request
}.show()
}入力値の検証
ユーザー入力をサーバーに送信する前に検証します。
TextInputLayoutのerrorプロパティを使用して、フィールドの下にインラインエラーを表示します- APIを呼び出す前に、未入力のフィールド、メールアドレスの形式、パスワードの長さを確認します
- ユーザーが入力を始めたらエラーを消去します
TextInputLayoutのエラー
フォームフィールドにインラインの入力検証エラーを表示します。
fun validateAndSubmit() {
val email = binding.etEmail.text.toString().trim()
val password = binding.etPassword.text.toString()
var hasError = false
if (email.isBlank() || !email.contains("@")) {
binding.tilEmail.error = "Enter a valid email"
hasError = true
} else {
binding.tilEmail.error = null // clear error
}
if (password.length < 6) {
binding.tilPassword.error = "Minimum 6 characters"
hasError = true
} else {
binding.tilPassword.error = null
}
if (!hasError) viewModel.login(email, password)
}理解度チェック
ビューをレイアウトから完全に除外し、スペースを占有しなくする表示状態はどれですか。
まとめ:エラー処理とUX
これで、アプリでエラーを適切に処理できるようになりました。
- sealed classを使って、状態をLoading / Success / Errorとしてモデル化する
- 読み込み中にProgressBarを表示する
- ネットワークエラーには、再試行アクション付きのSnackbarを表示する
- フォーム検証にはTextInputLayoutのインラインエラーを使用する
View.GONEとView.INVISIBLEの違い — 除外と非表示
最後のレッスンでは、アプリをPlay Storeに公開します。
よくある質問
「エラー処理とUX」レッスンは無料ですか?
はい。「エラー処理とUX」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Android Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Android Academyコースには全6レッスンが含まれています。
「エラー処理とUX」で何を学びますか?
sealed class(Loading/Success/Error)でUIの状態をモデル化します。ProgressBarや、Retryアクション付きのSnackbarを表示し、TextInputLayoutでインラインの入力検証エラーを示します。 ブラウザで直接実行するハンズオンコードでAndroid Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Android Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのAndroid Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/6です。
「エラー処理とUX」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このAndroid Academyレッスンでコードを書いて実行できますか?
はい。すべてのAndroid Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。