目的地の作成

助けてくれたなら、

簡単に説明します.

現在のナビゲーション

目的地の作成

(オプション)既存のテストケースを変更する

RAN構成における電流ナビゲーション

我々は得るCompose Navigation ジェットパックの構成から.それはNavigation component これは、異なる構成可能な間をナビゲートすることができます.
コード例を使って行動しましょう.
ナビゲーションコンポーネント

私たちはNavigationComponent どちらが作れますか.あなたはこのファイルは、我々のアプリのすべてのルートが含まれていると仮定することができます.ご覧の通り、ここで3つのルートがあります.Auth Home and AddTodo

開始または最初のルートはAuth といくつかの論理に基づいてSign in Google logic in our case ) それはHome オブジェクトを渡す間user

すべてのルートは、ナビゲーションコントローラが必要です.The NavController ナビゲーションコンポーネントの中心APIです.それはあなたのアプリケーションと各画面の状態の画面のスタックを追跡します.

私たちはNavController を使用してrememberNavController() 方法と我々の見解にそれを渡す

val navController = rememberNavController()

NavHostの作成

それぞれNavController と関連しなければならないNavHost 作曲可能.The NavHost リンク集NavController ナビゲーショングラフを使用して、ナビゲートすることができます.

このすべてを結ぶために、上記を置くNavigationComponent 主な活動の中

主な活動

ルートをナビゲートするためにnavigate() メソッド.navigate() シングルを取るString 宛先のルートを表すパラメータです.

// Navigate to some screen
navController.navigate("screen_route")
// Pop everything up to the "home" destination off the back stack before
// navigating to the "friendslist" destination
navController.navigate("friendslist") {
    popUpTo("home")
}

// Pop everything up to and including the "home" destination off
// the back stack before navigating to the "friendslist" destination
navController.navigate("friendslist") {
    popUpTo("home") { inclusive = true }
}

カスタム引数を渡す

これを行うには、あなたのルートに引数プレースホルダを追加しますadd arguments to a deep link

navController.navigate(Destinations.Home.replace("{user}",userJson))

デフォルトでは、すべての引数は文字列として解析されます.次に、NavArguments からNavBackStackEntry これはcomposable() 関数.

composable(Destinations.Home) { backStackEntry ->
    val userJson = backStackEntry.arguments?.getString("user")
    // DO YOUR PROCESSING AND CONVERT TO USER OBJECT
    HomeView(navController, userModel = userObject!!)
}

あなたがまだ読んでいるならば、あなたは実現したかもしれません.私はあなたに賛成です.カスタム引数を渡す場合には、いくつかのBoilerplateコードがあります.さて、これは改善することができますか?はい!!

目的地の作成

前のセクションを忘れて、afreshを起動します.あなたのアプリケーション内のナビゲーションを実装する必要があると仮定します.

Introducing Compose Destinations. As per the documentation

目的地:注釈を処理して、公式Jetpackをフードの下でナビゲーションを構成するコードを生成するKSPライブラリ.それ以外の場合は、複雑な、非型セーフとボイラープレートコードを非表示に書き込む必要があります.ほとんどのAPIはJetpackコンポーネントと同じです.
目的地を作る

セットアップ

依存関係をインストールするbuild.gradle アプリの

ksp 'io.github.raamcosta.compose-destinations:ksp:1.4.2-beta'
implementation 'io.github.raamcosta.compose-destinations:core:1.4.2-beta'

以下のプラグインを追加しますbuild.gradle

plugins {
    id 'com.google.devtools.ksp' version '1.6.10-1.0.2'
}

Note: Compose Destinations takes advantage of annotation processing (using KSP) to improve the usability of Compose Navigation.

を含むkotlinブロックを含めるsourceSets あなたの中の生成されたコードのためにbuild.gradle

kotlin {
    sourceSets {
        debug {
            kotlin.srcDir("build/generated/ksp/debug/kotlin")
        }
        release {
            kotlin.srcDir("build/generated/ksp/release/kotlin")
        }
    }
}

ナビゲーションの実装

したがって、ルート番号はまだ以下の通りです.Auth Home and AddTodo では、ナビゲーションの実装方法を見てみましょう.あなたの既存の作曲品があります.注釈しましょう
目的地注釈の作成

我々はDestination からの注釈Compose Destinations

私たちは私たちのスクリーンをマークstart = True この目的がナビゲーショングラフの開始先であることを意味する

次に、我々のタイプを変更しますnavController to DestinationsNavigator

DestinationsNavigator is a wrapper interface to NavController.

他の画面については、addTodoを言うと、私たちは単に注釈

@Destination
@Composable
fun AddTodoView(navController: DestinationsNavigator) {}

すべての目的地を生成する以下のコマンドを実行しましょう

./gradlew clean build

成功した場合は、生成したコードをbuild/generated/ksp/debug/kotlin 作成先を使用して目的地を生成

NavHostの使用

あなたが実現した場合、我々はもはや必要NavigationComponent クラス.

残りの最後のものはNavHost インサイドMainActivity

class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  setContent {
      AppTheme {
          DestinationsNavHost(navGraph = NavGraphs.root)
      }
  }
 }
}

我々DestinationsNavHost Navgraphの目的地を含みます.これは、すべての作曲家の注釈が含まれてDestination 内部Navgraph生成ファイル.

NavGraphs は、ナビゲーショングラフとその目的地を記述する生成されたファイルです.デフォルトでは、すべての宛先はNavGraphs.root

最後に、スクリーンに移動するために、我々はまだ同じ慣例に従います、しかし、現在、我々には目的地がありますAddTodoViewDestination etcの各ビューにマップされます.

// Navigate to add view screen
navController.navigate(AddTodoViewDestination)

// Pop everything up to and including the "auth" destination off
// the back stack before navigating to the "Home" destination
navController.navigate(HomeViewDestination) {
    popUpTo(AuthScreenDestination.routeId) { inclusive = true }
}

カスタム引数を渡す

これがおもしろくなる理由が、ここにあります.例を見ましょう、例えば、我々はAuth画面を持っています、そして、我々は我々のホーム画面にユーザーオブジェクトを渡す必要があります.

を作成しましょうParcelable クラスGoogleUserModel このクラスは基本的にユーザ名とメールを一度含んでいますsigned in from google

@Parcelize
data class GoogleUserModel(
    val name: String?,
    val email: String?
) : Parcelable

我々は修正Home 以下のように構成可能

@Destination
@Composable
fun HomeView(
    navController: DestinationsNavigator,
    userModel: GoogleUserModel,
) {}

受託可能なクラスを追加するGoogleUserModel パラメータと次には、ビルドコマンドを実行する必要がありますHomeView

インサイドAuthView APIから必要なデータを取得すると、GoogleUserModel そして、HomeViewDestination

navController.navigate(
    HomeViewDestination(
        GoogleUserModel(
            email = user.email,
            name = user.name,
        )
    )
) {
    popUpTo(route = AuthScreenDestination.routeId) {
        inclusive = true
    }
}

後に移動HomeView 我々は、ルートを含むAuthView を指定することでAuthScreenDestination pooptoの内部.

既存のテストを修正

我々はいくつかのテストを作成したNavigationComponent (私たちがそれを使っていたとき)、しかし、私たちはそれを私たちと一緒に持っているのでDestinationsNavigator

以来DestinationsNavigator インターフェイスは、我々自身を作成するDestinationsNavigatorImpl クラス.

DestinationSnavigatorImplは単にDestinationSnavigatorクラスから拡張され、DestinationsNavigator

デスティネーション

次に、我々は単にTestNavHostController とDestinationsNavigatorImpl インサイドexisting tests ,

// PREVIOUS
private lateinit var navController: TestNavHostController
// NOW
private var navController = DestinationsNavigatorImpl()

私たちはNavigationComponent with DestinationsNavHost インサイドテスト

composeTestRule.setContent {

     // PREVIOUS 
     NavigationComponent()

     // NOW
     DestinationsNavHost(navGraph = NavGraphs.root)
 }

Source code.
助けてくれたなら、