〈kotlin〉Navigation③ アプリバーと一緒に使う
Android studioでkotlinを使ってAndroidアプリ作成の勉強中。
NavigationコンポーネントのNavigation UIクラスを使用することで、
アプリのトップバーと連動させることができる。
AppBarConfiguration
NavigationUIのAppBarConfiguration オブジェクトを使用して、
アプリの表示領域の左上隅にあるアプリバーのナビゲーション ボタンの動作を管理する。
トップレベル(ナビゲーショングラフでホームに設定した)デスティネーションにいるときは
トップ アプリバーに「上へ」ボタン(⇦)は表示されず、
それ以外のデスティネーションにいる時は「上へ」ボタンが表示され、前の画面に戻ることができる。
対象のナビゲーション グラフを渡して AppBarConfiguration オブジェクトを作成する。
val appBarConfiguration = AppBarConfiguration(navController.graph)
デフォルトのアクションバーと一緒に使う場合
onCreate() メソッドから setupActionBarWithNavController() を呼び出したあと、
「上へ」ナビゲーションを処理する onSupportNavigateUp() をオーバーライドする。
private lateinit var appBarConfiguration: AppBarConfiguration //onCreate()とonSupportNavigateUp() で使用するため最初に定義 override fun onCreate(savedInstanceState: Bundle?) { ... val navHostFragment = supportFragmentManager.findFragmentById(R.id.nav_host_fragment) as NavHostFragment val navController = navHostFragment.navController appBarConfiguration = AppBarConfiguration(navController.graph) setupActionBarWithNavController(navController, appBarConfiguration) } override fun onSupportNavigateUp(): Boolean { val navController = findNavController(R.id.nav_host_fragment) return navController.navigateUp(appBarConfiguration) || super.onSupportNavigateUp() }
ツールバーを作成して使う場合
ツールバーを定義する。
<LinearLayout> <androidx.appcompat.widget.Toolbar android:id="@+id/toolbar" /> <androidx.fragment.app.FragmentContainerView android:id="@+id/nav_host_fragment" ... /> ... </LinearLayout>
デフォルトのアクションバーが設定されているため、アクションバーをなくす必要がある。
AndroidManifest.xml 内のandroid:theme="@style/AppTheme" がアクションバーを設定しているため、
res>values>styles.xml(themes.xmlかも)でparentの設定をNoActionBarに変更する。
<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> ... </style> </resources>
その後onCreate() メソッドから setupWithNavController() を呼び出す。
ツールバーを使用するときはクリック イベントを Navigation コンポーネントが自動的に処理するため、
onSupportNavigateUp() をオーバーライドする必要がない。
override fun onCreate(savedInstanceState: Bundle?) { ... val navController = findNavController(R.id.nav_host_fragment) val appBarConfiguration = AppBarConfiguration(navController.graph) findViewById<Toolbar>(R.id.toolbar) .setupWithNavController(navController, appBarConfiguration) }
参考https://developer.android.com/guide/navigation/navigation-ui?hl=ja