ログアウト機能の作業ログ

[aoki2002]

概要

SNSアプリのユーザー画面にAuthentication認証を使用したログアウト機能を実装し、実機テストを行う。

[aoki2002]

ログアウトに関するキャッチアップ

ログアウトを実行するソースコード Firebase.auth.signOut()

資料 : https://firebase.google.com/docs/auth/android/custom-auth?hl=ja

[aoki2002]

検証

メイン画面のユーザー画面内にログアウトボタンを設置してログアウトとログアウト後のログイン画面遷移を実行する。

以下のコードを追加

• UserView

  override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
      super.onViewCreated(view, savedInstanceState)
  
      val navController = view.findNavController()
  
      binding.userBtn1.setOnClickListener {
  
          userViewModel.logoutButtonTapped()
  
          navController.navigate(R.id.action_MainFragment_to_SignInFragment)
      }
  }

• UserViewModel

  fun logoutButtonTapped() {
  
      authenticationRepository.logoutAccount()
  }

• AuthenticationRepository

  fun logoutAccount() {
  
      auth = Firebase.auth
  
      auth.signOut()
  }

検証結果

SignInViewに画面遷移することができず、アプリが落ちてしまった。これはUserViewはもともとMainView上に表示されているのViewにもかかわらず、UserView内に画面遷移の記述をしてしまったことが原因だと考えられる。

追記

ログアウトの挙動は確認できた。

[yota-hara]

画面遷移について調査（田原）

• [Android] アプリの画面を遷移させる
  • Activityを変えて別のActivityへ画面遷移
    • 画面だけでなく使用する変数も全く異なるActivityへの移行
    • Activityの変更のため内部処理が多く、多少の遅れもあり得る
  • Fragmentを使用し画面表示を任せる
    • Activityは画面管理以外にも色々とtaskがあるので画面の変更だけに使うにはコスト高です。Activityを変えずにFragmentで画面を複数張り付けることが〇 同一Activityでの画面変更可能です。
    • 使用する変数は同じだが値が異なる、名簿などで名前、住所などをデータベースから取り出すだけで表示フォーマットは同じ様なケースなど Activityの画面遷移に比べて素早くできる（そうなる場合に有効） １つのActivityが複雑な構成になってメンテナンスに支障が出ないように注意

---

現在のアプリ実装について

• Activity上にStartFragment、SignInFragment、SignUpFragment、MainFragmentが乗っており、NavigationGraph(nav_screen)を使って遷移している。（多分）
• MainFragment上に、BrowseFragment、PostFragment、UserFragmentが乗っており、NavigationGraph(nav_bar)を使って遷移している。（多分）

遷移実装方針

• ログイン判定に関わる処理を行う画面を一つのActivityに上に集約し、ログイン後のアプリ動作をもう一つのAvtivity(SecondActivity)に集約する形のほうが、使い勝手良さそう。
  • 新たにSecondActivityを作成する。
    • SecondActivity上に、BrowseFragment、PostFragment、UserFragmentを乗せる。
  • ログイン後にはSecondActivityに遷移する。
  • SecondActivity上のUserFragmentでログアウト処理を行ったら、Activityに遷移する。

[yota-hara]

遷移の書き方について調査（田原）

• 【超初心者向け】Android入門 画面遷移編

• Activity→Activityは下記コードで遷移できそう。

  val intent = Intent(this, TestActivity::class.java)
  startActivity(intent)

• Fragment→別のActivityはどうか。

[yota-hara]

val intent = Intent(activity, SecondActivity::class.java)
startActivity(intent)

このコードでStartFragmentからSecondActivityに遷移できた。

[yota-hara]

SecondActivityにBrowseFragment、PostFragment、UserFragmentを乗せてタブ操作したい。

[yota-hara]

MainFragmentの下記コードをSecondActivityに移植したところ、画面下部にタブ表示はできたが、タブタップしても画面遷移はできなかった。

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#badcad"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/menu_bar"/>

[yota-hara]

FindNavControllerしたらタブ切り替えで遷移できるようになった

class SecondActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_second)

        val navController = findNavController(R.id.nav_host_fragment)
        findViewById<BottomNavigationView>(R.id.bottom_navigation).setupWithNavController(navController)
    }
}

[yota-hara]

下記コードで、ユーサー画面遷移時に自動的にActivityに遷移することを確認。

package com.example.sns_app.view

import android.content.Intent
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.databinding.DataBindingUtil
import androidx.fragment.app.Fragment
import androidx.fragment.app.viewModels
import androidx.navigation.findNavController
import androidx.navigation.fragment.findNavController
import com.example.sns_app.Activity
import com.example.sns_app.R
import com.example.sns_app.databinding.FragmentUserBinding
import com.example.sns_app.viewmodel.UserViewModel

class UserView: Fragment() {

    private lateinit var binding: FragmentUserBinding

    val userViewModel: UserViewModel by viewModels()

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        super.onCreateView(inflater, container, savedInstanceState)

        binding = DataBindingUtil.inflate(inflater, R.layout.fragment_user, container, false)

        binding.viewModel = userViewModel

        return binding.root
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        val intent = Intent(activity, Activity::class.java)
        startActivity(intent)
    }
}

[yota-hara]

ボタンのタップ処理で遷移動作させようとすると動かない。 多分setOnClickListenerが呼ばれていない。

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        binding.userBtn1.setOnClickListener() {
            val intent = Intent(activity, Activity::class.java)
            startActivity(intent)
        }
    }

[yota-hara]

logoutButtonTappedはXMLでUserFragmentと紐づいているから呼ばれている。ログイン処理もできている

[yota-hara]

解決案

userViewModelにログイン状態を変数に持たせて、viewが監視することで遷移書処理を実行できそう

[yota-hara]

検証結果

下記コードでログアウト後のスタート画面への遷移を確認。

UserView

```Kotlin package com.example.sns_app.view import android.content.Intent import android.os.Bundle import android.util.Log import android.view.LayoutInflater import android.view.View import android.view.ViewGroup import android.widget.Toast import androidx.databinding.DataBindingUtil import androidx.fragment.app.Fragment import androidx.fragment.app.viewModels import androidx.lifecycle.Observer import androidx.navigation.findNavController import androidx.navigation.fragment.findNavController import com.example.sns_app.Activity import com.example.sns_app.R import com.example.sns_app.SecondActivity import com.example.sns_app.databinding.FragmentUserBinding import com.example.sns_app.viewmodel.UserViewModel class UserView: Fragment() { private lateinit var binding: FragmentUserBinding val userViewModel: UserViewModel by viewModels() override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { super.onCreateView(inflater, container, savedInstanceState) binding = DataBindingUtil.inflate(inflater, R.layout.fragment_user, container, false) binding.viewModel = userViewModel // isSignedInの監視 userViewModel.isSignedIn.observe(viewLifecycleOwner, Observer { isSignedIn -> if (!isSignedIn) { val intent = Intent(activity, Activity::class.java) startActivity(intent) } }) return binding.root } override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) } } ```

UserViewModel

```Kotlin package com.example.sns_app.viewmodel import android.util.Log import androidx.lifecycle.MutableLiveData import androidx.lifecycle.ViewModel import com.example.sns_app.model.AuthenticationRepository class UserViewModel: ViewModel() { private val authenticationRepository = AuthenticationRepository() var isSignedIn = MutableLiveData() fun logoutButtonTapped() { authenticationRepository.logoutAccount() isSignedIn.value = false } } ```

動作

https://github.com/aoki2002/sns_app/assets/116154955/2c5f7798-600b-450a-9b2f-b291fd4a8cd9

[aoki2002]

検証

BrowseFragment、PostFragment、UserFragmentの画面遷移を別のActivityで管理する。また、MainFragmentをMainActivityに移植する。

検証結果

MainActivityに以下のコードを追加してBottomNavigationを設定しようとした結果、次のようなエラーが出力された。

MainActivity

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val navController = findNavController(R.id.nav_bar_host)

        setupWithNavController(bottom_navigation, navController)
    }

エラー文

Unresolved reference: android
Unresolved reference: bottom_navigation

MainActivityにはactivity_main.xmlを紐づけており、そこにBottomNavigationの設定を移植させているため、MainActivityにimportしている以下のモジュールが機能していないことが原因だと考えられる。

高齢者散歩マッチングアプリを開発している際にも同様のコードを使用して正しく動作したため、そのコードと比較して原因を探る。

[yota-hara]

@aoki2002 さん MainFragmentが不要に思えたので私の作業環境ではmainFragmentを削除してMainActivity上にBrowseFragment、PostFragment、UserFragmentを載せています。

できればここの実装はさらっと完了して次のタスクに進んでいただきたいです。

[aoki2002]

@yota-hara さん 承知しました。MainFragmentは確かに不要なので削除します。

[aoki2002]

検証

MainActivityのonCreateメソッドに以下を追加する。 val bottomNavigation: BottomNavigationView = findViewById((R.id.bottom_navigation))

検証結果

ログアウト後にログイン画面に遷移することが確認できた。