Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Navigation Architecture Component

336 views

Published on

2018 06-14 jetpack勉強会の資料です
https://yahoo-osaka.connpass.com/event/89865/

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Navigation Architecture Component

  1. 1. Navigation Architecture Component 2018/06/14 Osaka Mix Leap Study #16 - Android JetPack tech vein (@kwmt27)
  2. 2. Who are you? ▸ ( ) ▸ tech vein ( ) ▸ (Android iOS) ▸ GitHub: kwmt twitter: kwmt27 ▸ Google I/O2018 2
  3. 3. 3 RPG ChiiQ Android/iOS
  4. 4. ▸ Navigation 4 ▸ Navigation ▸ Navigation ▸ ▸
  5. 5. ▸ 5 ▸ Navigation ▸ Navigation ▸ New Destination Type ▸ Navigation Architecture Component
  6. 6. /42Navigation 6
  7. 7. /42Navigation ▸ ▸ 1.0.0-alpha02 (6/7 updated) 7
  8. 8. ▸ Navigation 8 ▸ Navigation ▸ Navigation ▸ ▸
  9. 9. /42Navigation ▸ Fragment pop remove ▸ FragmentTransaction ▸ 9
  10. 10. /42Navigation ▸ 
 (intent) ▸ 10
  11. 11. /42Navigation ▸ bundle.putInt(“hoge”, 1) ▸ Int ▸ “hoge” ▸ arguments.getString(“fuga”) ▸ String ▸ “fuga” 11
  12. 12. /42Navigation ▸ ▸ https://youtu.be/8GCXtCjtg40?t=1631 12
  13. 13. /42Navigation ▸ Fragment ▸ DeepLink ▸ ▸ 13 Navigation
  14. 14. ▸ Navigation 14 ▸ Navigation ▸ Navigation ← ▸ ▸
  15. 15. /42Navigation ▸ 15 implementation 'android.arch.navigation:navigation-fragment:1.0.0-alpha02' implementation ‘android.arch.navigation:navigation-ui:1.0.0-alpha02' implementation ‘android.arch.navigation:navigation-fragment-ktx:1.0.0-alpha02’ implementation ‘android.arch.navigation:navigation-ui-ktx:1.0.0-alpha02’ classpath 'android.arch.navigation:navigation-safe-args-gradle-plugin:1.0.0-alpha02' ▸ Navigation Drawer Bottom Navigation ▸ Kotlin ▸ Safe Args Gradle
  16. 16. /42Navigation 16 ▸ ▸ Destination ▸ Destination Fragment Activity
  17. 17. /42Navigation ▸ Android Studio 3.2 ▸ ▸ navigation ▸ xml 17
  18. 18. /42Navigation 18
  19. 19. /42Navigation 19 action
  20. 20. /42 <navigation … app:startDestination="@id/homeFragment"> <fragment android:id="@+id/homeFragment" android:name=“net.kwmt27.codesearch.ui.HomeFragment"> <action android:id="@+id/nextAction" app:destination="@id/nextFragment" /> </fragment> <fragment android:id=“@+id/nextFragment“ android:name="net.kwmt27.codesearch.ui.NextFragment"/> </navigation> <navigation … app:startDestination="@id/homeFragment"> <fragment android:id="@+id/homeFragment" android:name=“net.kwmt27.codesearch.ui.HomeFragment"> <action android:id="@+id/nextAction" app:destination="@id/nextFragment" /> </fragment> <fragment android:id=“@+id/nextFragment“ android:name="net.kwmt27.codesearch.ui.NextFragment"/> </navigation> Navigation 20 <navigation … app:startDestination="@id/homeFragment"> <fragment android:id="@+id/homeFragment" android:name=“net.kwmt27.codesearch.ui.HomeFragment"> <action android:id="@+id/nextAction" app:destination="@id/nextFragment" /> </fragment> <fragment android:id=“@+id/nextFragment“ android:name="net.kwmt27.codesearch.ui.NextFragment"/> </navigation> <navigation … app:startDestination="@id/homeFragment"> <fragment android:id="@+id/homeFragment" android:name=“net.kwmt27.codesearch.ui.HomeFragment"> <action android:id="@+id/nextAction" app:destination="@id/nextFragment" /> </fragment> <fragment android:id=“@+id/nextFragment“ android:name="net.kwmt27.codesearch.ui.NextFragment"/> </navigation> <navigation … app:startDestination="@id/homeFragment"> <fragment android:id="@+id/homeFragment" android:name=“net.kwmt27.codesearch.ui.HomeFragment"> <action android:id="@+id/nextAction" app:destination="@id/nextFragment" /> </fragment> <fragment android:id=“@+id/nextFragment“ android:name="net.kwmt27.codesearch.ui.NextFragment"/> </navigation>
  21. 21. /42Navigation 21 NavHost
  22. 22. /42Navigation 22 <LinearLayout…> <android.support.v7.widget.Toolbar … /> <fragment… android:id="@+id/my_nav_host_fragment" android:name="androidx.navigation.fragment.NavHostFragment" app:navGraph="@navigation/mobile_navigation" app:defaultNavHost="true" /> <android.support.design.widget.BottomNavigationView…/> </LinearLayout> <LinearLayout…> <android.support.v7.widget.Toolbar … /> <fragment… android:id="@+id/my_nav_host_fragment" android:name="androidx.navigation.fragment.NavHostFragment" app:navGraph="@navigation/mobile_navigation" app:defaultNavHost="true" /> <android.support.design.widget.BottomNavigationView…/> </LinearLayout> <LinearLayout…> <android.support.v7.widget.Toolbar … /> <fragment… android:id="@+id/my_nav_host_fragment" android:name="androidx.navigation.fragment.NavHostFragment" app:navGraph="@navigation/mobile_navigation" app:defaultNavHost="true" /> <android.support.design.widget.BottomNavigationView…/> </LinearLayout> <LinearLayout…> <android.support.v7.widget.Toolbar … /> <fragment… android:id="@+id/my_nav_host_fragment" android:name="androidx.navigation.fragment.NavHostFragment" app:navGraph="@navigation/mobile_navigation" app:defaultNavHost="true" /> <android.support.design.widget.BottomNavigationView…/> </LinearLayout>
  23. 23. /42Navigation 23 val button: Button = view.findViewById(R.id.next) button.setOnClickListener { Navigation.findNavController(it).navigate(R.id.nextFragment) } R.id.nextAction action id ▸ NavController#navigate ▸ NavController ▸ Navigation#findNavController
  24. 24. /42Navigation 24 <android.support.v4.widget.DrawerLayout android:id="@+id/drawer_layout" … > <LinearLayout …> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" … /> <fragment android:id="@+id/main_nav_host_fragment" android:name=“androidx.navigation.fragment.NavHostFragment" app:defaultNavHost="true" app:navGraph="@navigation/nav_main" /> </LinearLayout> <android.support.design.widget.NavigationView android:id="@+id/nav_view" … app:menu="@menu/menu_nav_drawer" /> </android.support.v4.widget.DrawerLayout> <android.support.v4.widget.DrawerLayout android:id="@+id/drawer_layout" … > <LinearLayout …> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" … /> <fragment android:id="@+id/main_nav_host_fragment" android:name=“androidx.navigation.fragment.NavHostFragment" app:defaultNavHost="true" app:navGraph="@navigation/nav_main" /> </LinearLayout> <android.support.design.widget.NavigationView android:id="@+id/nav_view" … app:menu="@menu/menu_nav_drawer" /> </android.support.v4.widget.DrawerLayout>
  25. 25. /42Navigation 25 <menu …> <item android:id=“@id/homeFragment" …/> <item android:id=“@id/nextFragment" … /> </menu> Navigation Graph Destination id
  26. 26. /42 class MainActivity : AppCompatActivity() { private lateinit var drawerLayout: DrawerLayout override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main_activity) val toolbar: Toolbar = findViewById(R.id.toolbar) setSupportActionBar(toolbar) drawerLayout = findViewById(R.id.drawer_layout) findNavController(R.id.main_nav_host_fragment).apply { val navView : NavigationView = findViewById(R.id.nav_view) NavigationUI.setupWithNavController(navView, this) NavigationUI.setupActionBarWithNavController( this@MainActivity, this, drawerLayout) } } override fun onSupportNavigateUp(): Boolean = navigateUp( drawerLayout, Navigation.findNavController(this, R.id.main_nav_host_fragment) ) } Navigation 26 class MainActivity : AppCompatActivity() { private lateinit var drawerLayout: DrawerLayout override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main_activity) val toolbar: Toolbar = findViewById(R.id.toolbar) setSupportActionBar(toolbar) drawerLayout = findViewById(R.id.drawer_layout) findNavController(R.id.main_nav_host_fragment).apply { val navView : NavigationView = findViewById(R.id.nav_view) NavigationUI.setupWithNavController(navView, this) NavigationUI.setupActionBarWithNavController( this@MainActivity, this, drawerLayout) } } override fun onSupportNavigateUp(): Boolean = navigateUp( drawerLayout, Navigation.findNavController(this, R.id.main_nav_host_fragment) ) } DrawerLatyoute NavigationVIew ActionBar NavController
  27. 27. /42Navigation 27 class MainActivity : AppCompatActivity() { private val binding: MainActivityBinding by lazy { DataBindingUtil.setContentView<MainActivityBinding>(this, R.layout.main_activity) } override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setSupportActionBar(binding.toolbar) ActionBarDrawerToggle( this, binding.drawerLayout, binding.toolbar, R.string.openDrawerContentDescRes, R.string.closeDrawerContentDescRes ) .also { binding.drawerLayout.addDrawerListener(it) } .apply { isDrawerIndicatorEnabled = true isDrawerSlideAnimationEnabled = true syncState() } binding.navView.setNavigationItemSelectedListener { val f = when (it.itemId) { R.id.mainFragment -> MainFragment() R.id.repositoryListFragment -> RepositoryListFragment() else -> MainFragment() } val ft = supportFragmentManager.beginTransaction() ft.add(R.id.main_nav_host_fragment, f) ft.commitNow() binding.drawerLayout.closeDrawers() true } } } ActionBarDrawerToggle setNavigationItemSelectedListener FragmentTransaction
  28. 28. /42Navigation ▸ Bundle ▸ Safe Args Gradle 28
  29. 29. /42Navigation 29 apply plugin: 'com.android.application' apply plugin: 'androidx.navigation.safeargs' classpath 'android.arch.navigation:navigation-safe-args-gradle-plugin:1.0.0-alpha02' build.gradle app/build.gradle
  30. 30. /42Navigation 30 <fragment android:id="@+id/nextFragment" android:name="net.kwmt27.codesearch.ui.repository.NextFragment" android:label="@string/title_repository" tools:layout="@layout/next_fragment" > <argument android:name="step" android:defaultValue="1" app:type="integer"/> </fragment>
  31. 31. /42Navigation ▸ Fragment + Directions ▸ ( )HomeFragmentDirections ▸ Fragment + Args ▸ ( )NextFragmentArgs 31
  32. 32. /42Navigation ▸ 32 button.setOnClickListener { val action = HomeFragmentDirections.nextAction().setStep(5) Navigation.findNavController(it).navigate(action) } val step = arguments?.let { val safeArgs = NextFragmentArgs.fromBundle(it) safeArgs.step } ▸
  33. 33. /42Navigation ▸ 33 PendingIntent deeplink = Navigation.findNavController(v).createDeepLink() .setDestination(R.id.android) .setArguments(args) .createPendingIntent(); TaskStackBuilder TaskStackBuilder
  34. 34. /42Navigation ▸ URL 34 <fragment android:id="@+id/deepLinkFragment" android:name="net.kwmt27.codesearch.ui.DeepLinkFragment"> <argument android:name="myarg" android:defaultValue="Android!"/> <deepLink app:uri="www.example.com/{myarg}"/> </fragment> <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> <nav-graph android:value="@navigation/nav_main"/> </activity> ▸ Navigation Graph ▸ AndroidManifest
  35. 35. ▸ Navigation 35 ▸ Navigation ▸ Navigation ▸ ▸
  36. 36. /42 ▸ https://issuetracker.google.com/issues/79672220 ▸ navigateForResult ▸ 5/15 36
  37. 37. /42 ▸ https://issuetracker.google.com/issues/80267254 ▸ 5/25 37
  38. 38. /42 ▸ https://issuetracker.google.com/issues/79665225 ▸ 5/14 38 ▸ https://issuetracker.google.com/issues/79993862 ▸ 5/19
  39. 39. ▸ Navigation 39 ▸ Navigation ▸ Navigation ▸ ▸
  40. 40. /42 ▸ Navigation ▸ Navigation Graph ▸ ▸ ▸ 40
  41. 41. /42 ▸ Implement navigation with the Navigation Architecture Component ▸ https://developer.android.com/topic/libraries/architecture/ navigation/navigation-implementing ▸ Codelabs ▸ https://codelabs.developers.google.com/codelabs/android- navigation/index.html?index=..%2F..%2Findex#2 ▸ Issue Tracker ▸ https://issuetracker.google.com/issues?q=componentid: 409828%20status:open&p=1 41
  42. 42. /4242

×