Skip to content

๐Ÿš€ Navigation Component ์ ์šฉ๊ณผ ๊ณ ๋ฏผ

saeyoung Oh edited this page Dec 13, 2023 · 1 revision

ํ•˜๋‚˜์˜ ์•กํ‹ฐ๋น„ํ‹ฐ ์•ˆ์—์„œ ํ”„๋ž˜๊ทธ๋จผํŠธ๊ฐ„์˜ ์ด๋™์„ ์ง€์›ํ•ด์ฃผ๋Š” ๊ฒƒ์ด ๋ชฉ์ ์ธ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ.


โ†’ activity ๊ฐ„ ์ด๋™ ๋Œ€์‹  ์†Œ์ˆ˜์˜ activity + ์—ฌ๋Ÿฌ ๊ฐœ์˜ fragment ๋กœ ๊ตฌํ˜„ํ•œ ์ด์œ ?

๐Ÿ’ก ํŒ€์›๋“ค ๋ชจ๋‘ Navigation Component ๋ฅผ ๋งŽ์ด ์‚ฌ์šฉํ•ด๋ณด์ง€ ์•Š์•„ ์ œ๋Œ€๋กœ ๊ฒฝํ—˜ํ•ด๋ณด๊ณ  ์‹ถ์—ˆ๊ณ , activity ๋ณด๋‹ค ๊ฐ€๋ฒผ์šด fragment ์—ฌ๋Ÿฌ ๊ฐœ๋ฅผ ๊ตฌํ˜„ํ•˜์—ฌ ์„ค๊ณ„ํ•˜๋Š” 
Single Activity Architecture ๋ฅผ ์ ์šฉํ•ด๋ณด๊ณ  ์‹ถ์–ด์„œ ๊ตฌํ˜„ํ•ด๋ณด์•˜๋‹ค. ์‹ค์ œ๋กœ ์‚ฌ์šฉํ•˜๋ฉด์„œ ๋Ÿฐํƒ€์ž„ ์—๋Ÿฌ๊ฐ€ ๋งค์šฐ ๋ถˆ์นœ์ ˆํ–ˆ๊ณ , ํ™”๋ฉด์ด ๋งŽ์•„์งˆ์ˆ˜๋ก ๊ด€๋ฆฌํ•ด์•ผ ํ•  ์ฝ”๋“œ๊ฐ€ 
๋Š˜์–ด๋‚˜ ๊ตฌํ˜„ ๊ณผ์ •์—์„œ ์–ด๋ ค์›€์„ ๊ฒช๊ธฐ๋„ ํ–ˆ๋‹ค. ํ•˜์ง€๋งŒ ๋™์‹œ์—, ๊ทธ๋ž˜ํ”„๋กœ ํ™”๋ฉด ์ „ํ™˜์„ ๊ด€๋ฆฌํ•˜๋ฉด์„œ ๋งŽ์€ ํ™”๋ฉด์„ ๊ทธ๋ฆผ ๊ทธ๋ฆฌ๋“ฏ์ด ๊ตฌ์„ฑํ•  ์ˆ˜ ์žˆ์—ˆ๊ณ , 
safe args ๋‚˜ popUpTo ์˜ต์…˜์„ ์‚ฌ์šฉํ•  ๋•Œ๋Š” ๊ฐ„๋‹จํ•˜๊ฒŒ ์›ํ•˜๋Š” ๋™์ž‘์„ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์–ด์„œ ํŽธ๋ฆฌํ–ˆ๋‹ค.

โ†’ safe args ์ ์šฉํ•œ ์ด์œ ?

๐Ÿ’ก action ์ด ์‹œ์ž‘๋œ ๊ฐ Destination ์— ๋Œ€ํ•ด ํด๋ž˜์Šค๊ฐ€ ์ƒ์„ฑ๋œ๋‹ค. ์›๋ž˜๋ผ๋ฉด, action ์—์„œ id ๋กœ ์•ก์…˜์„ ์ •์˜ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ž˜๋ชป๋œ ์•ก์…˜์„ ์ „๋‹ฌํ•  ๊ฐ€๋Šฅ์„ฑ์ด ์žˆ์ง€๋งŒ, 
๊ฐ์ฒด๋กœ ์ƒ์„ฑํ•ด์„œ ์ „๋‹ฌํ•˜๋ฉด ์ž˜๋ชป ์ „๋‹ฌํ•  ์œ„ํ—˜์ด ์—†๊ธฐ ๋•Œ๋ฌธ์— ์‚ฌ์šฉ์ด ๊ถŒ์žฅ๋œ๋‹ค. 
๋˜ํ•œ fragment ๊ฐ„ ์ด๋™ํ•˜๋ฉด์„œ ๊ฐ„๋‹จํ•œ ๋ฐ์ดํ„ฐ๋ฅผ ์ „๋‹ฌํ•ด์•ผ ํ•˜๋Š” ๊ฒฝ์šฐ, ์ปดํŒŒ์ผ ํƒ€์ž„์— ์˜ค๋ฅ˜๋ฅผ ๊ฐ์ง€ํ•  ์ˆ˜ ์žˆ์–ด type ์•ˆ์ „์„ฑ์ด ๋ณด์žฅ๋˜๊ธฐ ๋•Œ๋ฌธ์— safe args ๋ฅผ ์ ์šฉํ•˜์—ฌ 
navigation ์„ ๊ตฌํ˜„ํ–ˆ๋‹ค.



Navigation graph

  • destination ์€ activity / fragment ์— ํ•ด๋‹น.
    • activity ๋Š” ์ตœ์ข… ์ง€์ ์ด ๋  ์ˆ˜๋Š” ์žˆ์ง€๋งŒ, action ์ด ์ถœ๋ฐœํ•  ์ˆ˜๋Š” ์—†์Œ.
  • pop ์˜ต์…˜
    • popUpTo : backstack ์—์„œ ์–ด๋””๊นŒ์ง€ ์ด๋™ํ•  ๊ฒƒ์ธ์ง€ ๊ฒฐ์ • โ†’ ์„ค์ •ํ•œ destination ์ด ๋‚˜์˜ฌ ๋•Œ๊นŒ์ง€ backstack ์„ pop.
    • popUpToInclusive : ์œ„์—์„œ ์ง€์ •ํ•œ fragment ๋ฅผ pop ํ• ์ง€ ์—ฌ๋ถ€๋ฅผ boolean ์œผ๋กœ ์„ค์ •.

NavHost

  • graph ๋กœ๋ถ€ํ„ฐ destination ์„ ๋ณด์—ฌ์ฃผ๋Š” ๋นˆ ์ปจํ…Œ์ด๋„ˆ. frame / container ๋ผ๊ณ  ์ƒ๊ฐํ•˜๋ฉด ๋จ.
  • ์†์„ฑ
    • android:name ๊ตฌํ˜„ ํด๋ž˜์Šค์˜ ์ด๋ฆ„์„ ํฌํ•จ
    • android:navGraph ์œ„์—์„œ ๋งŒ๋“  graph ์™€ ์—ฐ๊ฒฐ
    • android:defaultNavHost true ์ผ ๊ฒฝ์šฐ, NavHostFragment๊ฐ€ ์‹œ์Šคํ…œ ๋’ค๋กœ ๊ฐ€๊ธฐ ๋ฒ„ํŠผ์„ ๊ฐ€์ ธ๊ฐ. ์ฆ‰ ์Šคํƒ์— ์Œ“์—ฌ์„œ ๋’ค๋กœ๊ฐ€๊ธฐ ๋ฒ„ํŠผ์„ ๋ˆŒ๋ €์„ ๋•Œ ์ด์ „ destination ์œผ๋กœ ๋Œ์•„๊ฐ.

NavController

  • NavHost ๊ฐ€ ์ด๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์Œ.
  • ์œ ์ €๊ฐ€ ์•ฑ ๋‚ด์—์„œ ์ด๋™ํ•  ๋•Œ NavHost ์˜ ์ปจํ…์ธ ๋ฅผ ์กฐ์ •ํ•จ. NavController ๋Š” NavHost ์—๊ฒŒ ์ ์ ˆํ•œ ๋ชฉ์ ์ง€๋ฅผ ํ‘œ์‹œํ•ด์ฃผ๋Š” ๊ฒƒ.

BottomNavigation ๊ณผ ์—ฐ๊ฒฐ

  • menu ํด๋”๋ฅผ ์ƒ์„ฑํ•˜์—ฌ bottom navigation ํŒŒ์ผ์„ ์ƒ์„ฑ.
<item
   android:id="@+id/nav_setting"
   android:icon="@android:drawable/ic_menu_preferences"
   android:title="์„ค์ •"/>
๐Ÿ”‘ `id` ๋Š” ๋ฐ˜๋“œ์‹œ navigation graph ์—์„œ ์„ ์–ธํ•œ `fragment id` ์™€ ๋™์ผํ•˜๊ฒŒ ์„ค์ •ํ•ด์•ผ ์—ฐ๋™๋จ.

navigateUp vs popBackStack

  • Navigation ๊ธฐ๋ณธ ์›์น™

    • Up ๋ฒ„ํŠผ์œผ๋กœ ์•ฑ์ด ์ข…๋ฃŒ๋˜๋ฉด ์•ˆ๋จ
    • app task ์•ˆ์—์„œ up & back ๋™์ผํ•˜๊ฒŒ ๋™์ž‘ํ•ด์•ผํ•จ.
  • ์„ฑ๊ณต์ ์œผ๋กœ ๋‹ค๋ฅธ destination ์œผ๋กœ pop back ๋˜์—ˆ๋Š”์ง€ ์—ฌ๋ถ€๋ฅผ boolean ์œผ๋กœ ๋ฐ˜ํ™˜

  • popBackStack

    • Back ๋ฒ„ํŠผ์˜ ์•ก์…˜์„ ํ•จ
    • ์‹œ์ž‘ fragment ์—์„œ ์ˆ˜๋™์œผ๋กœ ์ด ๋ฉ”์„œ๋“œ๋ฅผ call ํ–ˆ์„ ๋•Œ, ์ƒ์œ„ fragment ๊ฐ€ ์—†๊ธฐ ๋•Œ๋ฌธ์— ์•„๋ฌด ์ผ๋„ ์ผ์–ด๋‚˜์ง€ ์•Š์Œ. ํ•˜์ง€๋งŒ ๊ฐ’ ์ž์ฒด๋Š” false ๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋ฉด์„œ ๋‹ค์Œ ๋™์ž‘ ์‹œ ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒ์‹œํ‚ด
    findNavController().popBackStack() // false ๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋ฉด
    findNavController().getCurrentDestination() // null ์„ ๋ฐ˜ํ™˜ํ•˜๋ฉด์„œ ๋‹ค์Œ ๋™์ž‘์— ์˜ํ–ฅ์„ ์คŒ
    • ์œ„๋กœ ๋ฒ„ํŠผ์—์„œ๋Š” navigateUp ์“ฐ๋Š”๊ฒŒ ์ผ๋ฐ˜์ ์ด์ง€๋งŒ, ์‹œ์ž‘ fragment ๊ฐ€ ์•„๋‹ˆ๋ฉด popBackStack ์“ฐ๋Š” ๊ฒฝ์šฐ๋„ ์žˆ์Œ. ์‹œ์ž‘ fragment ์—์„œ ์‚ฌ์šฉ๋  ํ™•๋ฅ ์ด ์กด์žฌํ•œ๋‹ค๋ฉด, false ์ธ ๊ฒฝ์šฐ activity ๋ฅผ finish ํ•ด์ฃผ๋Š” ์ฝ”๋“œ๋ฅผ ์ถ”๊ฐ€์ ์œผ๋กœ ์ž‘์„ฑํ•˜๊ธฐ๋„ ํ•จ.
  • navigateUp

    • popBackStack ๊ณผ ๋™์ž‘ ์ž์ฒด๋Š” ๊ฐ™์ง€๋งŒ up ์˜ ์•ก์…˜์„ ํ•จ
    • ์œ„์™€ ๊ฐ™์ด ์‹œ์ž‘ fragment ์—์„œ ์ˆ˜๋™์œผ๋กœ ์ด ๋ฉ”์„œ๋“œ๋ฅผ call ํ–ˆ์„ ๋•Œ, ์•„๋ฌด ์ผ๋„ ์ผ์–ด๋‚˜์ง€ ์•Š์Œ. ํ•˜์ง€๋งŒ ๋‹ค์Œ ๋™์ž‘์„ ๊ณ„์†ํ•ด๋„ ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒ์‹œํ‚ค์ง€ ์•Š์Œ.
Clone this wiki locally