ユーザ用ツール

サイト用ツール


サイドバー

プログレス合同会社

広告

android:studio:application:app:home-02

07.ホーム画面の表示

NavGraphにホーム画面を登録して、Compose Navigationでホーム画面を表示します。

:appモジュールのnavigationディレクトリ(パッケージ)にAppHomeNavGraph.ktを作成します。

package jp.co.progress_llc.portal.navigation

import androidx.navigation.NavGraphBuilder
import androidx.navigation.compose.composable
import jp.co.progress_llc.portal.presentation.AppHomeScreen

const val APP_HOME = "app_home"

fun NavGraphBuilder.appHomeNavGraph() {
  composable(APP_HOME) {
    AppHomeScreen()
  }
}

7行目、10行目
app_homeの名前でNavGraphを登録します。
11行目
NavGraphが呼ばれたときに描画する画面を定義しています。

DI(Hilt)へNavGraphを提供

:appモジュールにdiディレクトリ(パッケージ)を追加し、直下にAppHomeNavGraphModule.ktを作成し、NavGraphDI(Hilt)に提供します。

package jp.co.progress_llc.portal.di

import androidx.navigation.NavGraphBuilder
import dagger.Module
import dagger.Provides
import dagger.hilt.InstallIn
import dagger.hilt.components.SingletonComponent
import dagger.multibindings.IntoSet
import jp.co.progress_llc.portal.navigation.appHomeNavGraph

@Module
@InstallIn(SingletonComponent::class)
object AppHomeNavGraphModule {
  @Provides
  @IntoSet
  fun provideHomeNavGraph(): NavGraphBuilder.() -> Unit = {
    appHomeNavGraph()
  }
}

14行目~18行目
NavGraphを提供しています。

Home画面の表示

:appモジュールのMainActivity.ktCompose Navigationによる画面遷移処理を追加して、Home画面を表示するようにします。

※コードをすべて入れ替えます。

package jp.co.progress_llc.portal

import android.os.Bundle
import javax.inject.Inject
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.navigation.NavGraphBuilder
import dagger.hilt.android.AndroidEntryPoint
import jp.co.progress_llc.portal.core.ui.theme.AppTheme
import jp.co.progress_llc.portal.navigation.AppNavHost
import jp.co.progress_llc.portal.navigation.APP_HOME

@AndroidEntryPoint
class MainActivity : ComponentActivity() {
  @Inject
  lateinit var navGraphBuilders: Set<@JvmSuppressWildcards NavGraphBuilder.() -> Unit>

  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()
    setContent {
      AppTheme {
        AppNavHost(
          navGraphs = navGraphBuilders.toList(),
          startDestination = APP_HOME
        )
      }
    }
  }
}

16行目~17行目
DI(Hilt)に提供されているNavGraphの一覧を取得します。
22行目
Lifecycleのスコープを定義しています。
23行目~28行目
NavHostの作成処理を呼び出し、画面遷移を開始します。
26行目
起動時に表示するNavGraphの名前を指定しています。

エミュレーターでアプリケーションを実行して、ホーム画面が表示されることを確認します。

android/studio/application/app/home-02.txt · 最終更新: by 管理者