目次

07.ホーム画面の表示

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

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

title:/app/src/main/kotlin/jp/co/progress_llc/portal/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を作成し、NavGraphをDI(Hilt)に提供します。

title:/app/src/main/kotlin/jp/co/progress_llc/portal/di/AppHomeNavGraphModule.kt
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.ktにCompose Navigationによる画面遷移処理を追加して、Home画面を表示するようにします。

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

title:/app/src/main/kotlin/jp/co/progress_llc/portal/MainActivity.kt
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の名前を指定しています。

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