ComposeとFirebaseでユーザー認証をやってみるやつです。
今日はログイン処理とエラーメッセージ表示を実装してみました。
ViewModelで状態管理用クラスを定義します。
data class FireUiState(
val userMessage: String? = null,
val isSignin: Boolean = false
)状態管理用クラスにアクセスして、値を更新する処理は以下の通り。
エラーメッセージやサインインの状態をViewModelで変更できるようにします。
var uiState by mutableStateOf(FireUiState())
private set
// 状態の更新
private fun updateState(message:String,isSignin: Boolean) {
viewModelScope.launch {
uiState = uiState.copy(userMessage = message, isSignin = isSignin)
return@launch
}
}
// メッセージを表示し終わったら呼ぶ
fun userMessageShown() {
uiState = uiState.copy(userMessage = null)
}ログイン処理の実装は以下の通り。
fun doSignIn(email:String,password:String){
auth.signInWithEmailAndPassword(email, password)
.addOnCompleteListener {
if (it.isSuccessful) {
val user = auth.currentUser
if (user != null) {
updateState("login success! " + user.email, isSignin = true)
}
} else {
updateState("login fail."+ (it.exception?.message ?: "n/a"), isSignin = false)
}
}
}updateStateを呼び出して、状態を変更しています。
状態が更新されたときにUI側でトーストを出すためには、Composableの関数の中でLaunchedEffectを使って状態監視をします。
Composable
fun LoginScreen(viewModel: FireViewModel,goToWelcome: ()->Unit = {}) {
：
viewModel.uiState.userMessage?.let { userMessage ->
LaunchedEffect(userMessage) {
Toast.makeText(context, userMessage, Toast.LENGTH_LONG).show()
viewModel.userMessageShown()
}
}参考：
https://firebase.google.com/docs/auth/android/start?authuser=0&hl=ja
https://developer.android.com/topic/architecture/ui-layer/events?hl=ja
