目次

06.ホーム画面の表示

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

:appモジュールのnavigationディレクトリ内にHomeNavigation.ktを作成し、NavGraphをNavHostに登録します。 

package jp.co.progress_llc.portal.navigation

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

fun NavGraphBuilder.homeNavigation() {
  composable("home") {
    HomeScreen()
  }
}

8行目
HomeScreenをhomeの名前で登録しています。

DI(Hilt)への登録

:appモジュールのdiディレクトリ(新規作成します)内にHomeNavGraphModule.ktを作成し、NavGraphをDI(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.homeNavigation

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

14行目～18行目
NavGraphを登録しています。

Home画面の表示

:appモジュールのMainActivity.ktを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 androidx.navigation.compose.rememberNavController
import dagger.hilt.android.AndroidEntryPoint
import jp.co.progress_llc.portal.core.ui.theme.AppTheme
import jp.co.progress_llc.portal.navigation.AppNavigation

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

  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()
    setContent {
      AppTheme {
        val navController = rememberNavController()
        AppNavigation(
          navController = navController,
          startDestination = "home",
          builders = navGraphBuilders.toList()
        )
      }
    }
  }
}

27行目
起動時はhomeという名前のNavGraphを表示するように指定しています。

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