Navigation Component — 概要、NavHostとNavigation Graph

著者: IT Sectr 公開日: 2026-02-22 読了時間: 7 分

Navigation Componentは、アプリ画面間のナビゲーションを実装するためのAndroid Jetpackライブラリです。このコンポーネントはフラグメントスタック、ディープリンク、引数の受け渡しを一元管理します。2018年からJetpackの一部であり、Googleはすべての新規プロジェクトにこれを推奨しています。詳細はGoogle公式ガイドをご覧ください。

重要ポイント

  • Navigation Component — Android画面間の一元化されたナビゲーションのためのJetpackライブラリ
  • NavGraph — すべての画面とその間の接続を記述するXMLリソース
  • NavHostFragment — Activityレイアウト内のコンテナで現在のナビゲーション画面を表示
  • NavController — ナビゲーション制御オブジェクト:navigate、popBackStack、navigateUp
  • Safe Args — 画面間で型安全な引数を受け渡すためのGradleプラグイン

Navigation Componentとは?

Navigation Componentは、ナビゲーションのための統一APIを提供するAndroid Jetpackライブラリ(androidx.navigation)です。3つの主要要素で構成されます:Navigation Graph(ナビゲーショングラフ)、NavHostFragment(画面コンテナ)、NavController(遷移コントローラ)。このコンポーネントはバックスタックを自動管理し、ディープリンクをサポートします。

Navigation Component以前は、開発者はFragmentManagerを使って手動でフラグメントを管理していました。これによりコードが断片化し、画面ごとにナビゲーションルールが異なり、バックスタックの状態がバラバラで、ディープリンクには個別の実装が必要でした。Navigation Componentはこれらのシナリオを統一しました。Google(2026年)によると、このライブラリは新しいAndroidプロジェクトの90%に導入されています。

Navigation Componentは他のJetpackライブラリ(LiveData、ViewModel、Material Design)と統合します。XMLフラグメントとJetpack Composeの両方をnavigation-compose拡張を通じてサポートします。安定版リリース — 2.8.x(2025年)、最小Androidバージョン — API 14。

NavGraphは、アプリのすべての画面とそれらの間の接続を定義するXMLリソース(res/navigation/nav_graph.xml)です。各画面はデスティネーションであり、Fragment、Activity、またはComposableにすることができます。デスティネーション間の接続はアクションで、遷移方向を定義します。

xml

<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    app:startDestination="@+id/homeFragment">

    <fragment
        android:id="@+id/homeFragment"
        android:name=".HomeFragment"
        android:label="ホーム"
        tools:layout="@layout/fragment_home">
        <action
            android:id="@+id/action_home_to_detail"
            app:destination="@+id/detailFragment"
            app:enterAnim="@anim/slide_in_right"
            app:exitAnim="@anim/slide_out_left"
            app:popEnterAnim="@anim/slide_in_left"
            app:popExitAnim="@anim/slide_out_right" />
    </fragment>

    <fragment
        android:id="@+id/detailFragment"
        android:name=".DetailFragment"
        android:label="詳細"
        tools:layout="@layout/fragment_detail">
        <argument android:name="itemId"
            app:argType="integer"
            android:defaultValue="0" />
    </fragment>
</navigation>

startDestination属性は起動時に最初に表示される画面を設定します。アクションはターゲットデスティネーションとオプションのアニメーションを定義します。引数は画面に渡されるパラメータを記述します — 型とデフォルト値。

NavHostFragmentはActivityレイアウトに配置されるコンテナで、現在のナビゲーション画面を表示します。NavController.navigate()が呼ばれると、NavHostFragmentは自動的にフラグメントを切り替えます。NavControllerはナビゲーションを管理するオブジェクトです:遷移、戻る、現在のルートの確認。

kotlin
// Layout Activity: activity_main.xml
// <androidx.fragment.app.FragmentContainerView
//     android:id="@+id/nav_host_fragment"
//     android:name="androidx.navigation.fragment.NavHostFragment"
//     app:navGraph="@navigation/nav_graph"
//     app:defaultNavHost="true" />

class MainActivity : AppCompatActivity() {

    private val navController by lazy {
        (findViewById<NavHostFragment>(R.id.nav_host_fragment))
            .navController
    }

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

        // NavigationUIがNavControllerをAppBarに接続
        setupActionBarWithNavController(navController)
    }

    // 詳細画面に移動
    fun openDetail(itemId: Long) {
        val bundle = Bundle().apply {
            putLong("itemId", itemId)
        }
        navController.navigate(R.id.action_home_to_detail, bundle)
    }

    override fun onSupportNavigateUp() = 
        navController.navigateUp() || super.onSupportNavigateUp()
}

app:defaultNavHost="true"は重要な属性です:システムの戻るボタンをインターセプトしてNavControllerに制御を渡します。NavigationUIはNavControllerをAppBar、BottomNavigationView、NavigationDrawerにリンクするユーティリティです。setupActionBarWithNavControllerはネストされた画面で戻る矢印を有効にします。

Navigation Componentはカスタムトランジションアニメーションをサポートしており、アクション内またはプログラムで設定できます。アニメーションは4つの属性で定義されます:enterAnim(新しい画面の出現)、exitAnim(現在の画面の消滅)、popEnterAnim(戻る時の出現)、popExitAnim(戻る時の消滅)。

xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="100%"
        android:toXDelta="0%"
        android:duration="300" />
</set>

// アニメーション付きプログラム遷移
val navOptions = NavOptions.Builder()
    .setEnterAnim(R.anim.slide_in_right)
    .setExitAnim(R.anim.slide_out_left)
    .setPopEnterAnim(R.anim.slide_in_left)
    .setPopExitAnim(R.anim.slide_out_right)
    .build()

navController.navigate(R.id.detailFragment, args, navOptions)

アニメーションはFragmentTransactionレベルでFragmentと連携します。Jetpack Composeの場合は、NavOptionsCompatを介してCompose Animationを使用してアニメーションを設定します。Navigation Componentはアニメーションの種類に制限を設けていません — translate、scale、alphaおよびそれらの組み合わせをサポートします。

Safe Args:型安全な引数

Safe Argsは画面間で型安全なデータ転送を行うためのGradleプラグインです。プラグインはNavGraphを解析し、特定のフィールド型を持つDirectionsクラスとArgsクラスを生成します。型の一致はコンパイル時にチェックされ、MissingArgumentExceptionはアプリ実行前に検出されます。

kotlin
// build.gradle (module)
plugins {
    id 'androidx.navigation.safeargs.kotlin'
}

// Safe Argsが生成:DetailFragmentArgs、HomeFragmentDirections
// HomeFragmentでの使用:
val action = HomeFragmentDirections
    .actionHomeToDetail(itemId = 42L)
findNavController().navigate(action)

// DetailFragmentでの使用:
private val args: DetailFragmentArgs by navArgs()
// args.itemIdはLong型、nullは渡せません

override fun onViewCreated(...) {
    super.onViewCreated(...)
    loadItem(args.itemId)
}

navArgs()はFragmentまたはActivityで引数を取得するためのKotlinデリゲートです。プラグインはプリミティブ、文字列、Parcelable、Serializable、Enum、配列をサポートします。複雑なオブジェクトの場合は、IDを渡してViewModelまたはデータベースからロードします。

Deep Linkはアプリの特定画面を開く外部リンクです。Navigation ComponentはNavGraphのapp:deepLink属性を介してディープリンクを処理します。システムはPendingIntentを作成し、ナビゲーションスタックをターゲット画面まで復元するか、アプリが実行されていない場合は新しいスタックを作成します。

xml

<fragment android:id="@+id/profileFragment"
    android:name=".ProfileFragment">
    <deepLink
        app:uri="https://example.com/profile/{userId}" />
    <argument
        android:name="userId"
        app:argType="string" />
</fragment>

// Deep Linkのプログラム作成
val pendingIntent = NavDeepLinkBuilder(context)
    .setGraph(R.navigation.nav_graph)
    .setDestination(R.id.profileFragment)
    .setArguments(Bundle().apply {
        putString("userId", "user_123")
    })
    .createPendingIntent()

ディープリンクはパスとクエリパラメータを持つURIパターン、intent action、mime typeをサポートします。プレースホルダー({userId})は自動的にデスティネーションの引数にマッピングされます。Navigation ComponentはAndroidManifestを介した暗黙的ディープリンクも処理します — NavHostFragmentを持つActivityにintent-filterを追加するだけです。

Navigation Compose(androidx.navigation:navigation-compose)はJetpack Compose向けのNavigation Component拡張です。APIはNavControllerとNavHostの概念を維持しますが、画面はFragmentの代わりにComposable関数です。NavHostは各ルートに対してcomposableラムダを受け入れます。

kotlin
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MyAppTheme {
                val navController = rememberNavController()
                NavHost(
                    navController = navController,
                    startDestination = "home"
                ) {
                    composable("home") {
                        HomeScreen(
                            onItemClick = { id ->
                                navController.navigate("detail/$id")
                            }
                        )
                    }
                    composable(
                        route = "detail/{itemId}",
                        arguments = listOf(
                            navArgument("itemId") {
                                type = NavType.LongType
                            }
                        )
                    ) { backStackEntry ->
                        val itemId = backStackEntry
                            .arguments?.getLong("itemId") ?: 0L
                        DetailScreen(itemId = itemId)
                    }
                }
            }
        }
    }
}

Navigation ComposeはIDの代わりに文字列ルートを使用します。パラメータはルートテンプレート("detail/{itemId}")を介して渡され、backStackEntryから抽出されます。rememberNavController()は再コンポジション間でNavControllerを保持します。Composeでの型安全性には、navigation-compose-type-safetyモジュール(実験的)が推奨されます。

よくある質問

Navigation ComponentのNavHostとは?

NavHostはナビゲーション画面を表示するためのコンテナです。XMLレイアウトでNavHostFragmentを介して実装されます。NavHostはNavGraph内の現在の画面を追跡し、遷移を管理します。各Activityには1つのNavHostFragmentが含まれます。

Safe ArgsがBundleより優れている点は?

Safe Argsは型安全な引数クラスを生成するGradleプラグインです。Bundleではキーと型を手動で指定する必要があり、実行時エラーの原因になります。Safe Argsはコンパイル時に型をチェックし、データを自動的にシリアライズします。

Navigation Componentで複雑なオブジェクトを渡すには?

複雑なオブジェクトはViewModel(画面間で共有)またはIDを渡してデータベースを介して受け渡します。Safe Argsはプリミティブ、文字列、Parcelableのみサポートします。Googleはナビゲーション引数で大きなオブジェクトを渡すことを避けるよう推奨しています。

Navigation ComponentでDeep Linkはどのように機能しますか?

Deep LinkはNavGraphのapp:deepLink属性で設定します。Navigation Componentは受信リンクを自動的に処理し、NavDeepLinkBuilderを介してPendingIntentを作成し、ナビゲーションスタックをターゲット画面まで復元します。URI、intent action、mime typeをサポートします。

Navigation ComponentはJetpack Composeで使用できますか?

はい。Navigation Compose(androidx.navigation:navigation-compose)はCompose向けのNavHostを提供します。APIはXMLバージョンと同様ですが、画面はComposable関数です。NavControllerは両方のバージョンで同じように使用されます。Googleは新しいComposeプロジェクトにNavigation Composeを推奨しています。

まとめ

  • Navigation Component — NavController、NavHost、NavGraphによる一元化されたナビゲーションのためのAndroid Jetpackライブラリ
  • NavGraph — すべての画面(デスティネーション)とその間の接続(アクション)を記述するXMLグラフ
  • NavHostFragment — Activityレイアウト内のコンテナで、戻るボタン用のdefaultNavHost属性をサポート
  • Safe Args — コンパイル時の型チェックによる型安全な引数受け渡しのためのGradleプラグイン
  • ディープリンク — URI、intent action、mime typeをサポートし、ナビゲーションスタックを自動復元
  • Navigation Compose — 文字列ルートとcomposable画面を備えたJetpack Compose拡張
  • Navigation Componentは新しいAndroidプロジェクトでGoogleが推奨する唯一のナビゲーション方法です

ターンキー方式のモバイルアプリケーションを開発します

IT Sectrは2017年からスタートアップや企業向けにiOS・Androidアプリケーションを開発しています。私たちがご相談に乗り、最適なソリューションをご提案します。

プロジェクトについて相談

こちらもお読みください