Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Navigation Componentの画面遷移のつまづき

4c0c2a5a353b06c9d0238373872822bb?s=47 Suyama
December 17, 2019

Navigation Componentの画面遷移のつまづき

概要:Android Jetpack Navigationコンポーネントの複雑な画面遷移を実装方法
背景:プロダクトコードの一部にNavigationを導入

目的:Navigation導入は簡単、画面遷移の仕様は複雑なので3つの手法紹介
触れない内容:データの受け渡し、戻る場合の遷移

4c0c2a5a353b06c9d0238373872822bb?s=128

Suyama

December 17, 2019
Tweet

Transcript

  1. Navigation Componentの 画面遷移のつまづき potatotips #67(2019/12/17) Suyama

  2. 自己紹介 Name :Suyama Company :Studyplus Inc. Role :Android Engineer ・potatotips初参加

    ・DroidKaigi2020に登壇予定
  3. 背景: ・StudyplusアプリにNavigationを導入 伝えたいこと: ・Navigationの導入は簡単だったこと ・画面遷移が複雑な場合の実装方法 目的

  4. Navigationの簡単な説明

  5. Navigationとは ・2019年3月リリースのComponent ・Fragment遷移を簡単に実装可能 ・Navigation EditorでGUI操作 NavGraph

  6. 使うことのメリット 今までの遷移 (FragmentManager) これからの遷移 (Navigation) 遷移の実装 △ トランザクション処理を コードで実装 ◯

    遷移をGUIに実装可能 バックスタック考慮 △ 遷移が複雑な場合は かなり難しい ◯ 遷移全体がまとまっている ので簡単 データ受け渡し △ 型考慮、nullable考慮 ◯ 型安全、null安全
  7. アプリ導入する際につまづいたこと

  8. 画面遷移のつまづき 他の画面から遷移する際、 ・FirstFragmentから始まる場合 ・SecondFragmentから始まる場合 両方実装したい場合どうすれば... 画面A 画面B

  9. アプローチ①

  10. Global Actionの利用(1/3) Global Actionとは:どこからでも利用できる遷移 使い所 :1アプリ1Activityの設計の場合 メリット :画面や遷移が多い場合、遷移図がシンプルになる デメリット :GUI上で遷移関係が追いにくい

  11. Global Actionの利用(2/3)

  12. Global Actionの利用(3/3)

  13. アプローチ②

  14. Nested Graphの利用(1/3) Nested Graphとは:複数のNavGraphを作成し、NavGraph内で遷移可能な他 のNavGraph 使い所 :1機能1Activityの設計の場合 メリット :機能単位でNavGraphを分けたい場合かなり有効 デメリット

    :遷移図が分かれるので遷移が追いにくい
  15. Nested Graphの利用(2/3) nested_nav_graph top_nav_graph

  16. Nested Graphの利用(3/3)

  17. アプローチ③

  18. StartDestinationの利用(1/2) StartDestinationとは:NavGraphでどの画面から始めるか指定できる 使い所 :設計にかかわらず使える メリット :どの画面からでも始められる デメリット :特になし

  19. StartDestinationの利用(2/2)

  20. まとめ ・Navigation導入することで画面遷移が非常に楽になった ・本発表では触れていないがデータの受け渡しも楽になった ・複雑な画面遷移を実現するために ・選択肢:Global Action、Nested Graph、StartDestination ・どれを選択すべきかは設計や使う所次第