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

Droidcon Berlin: Navigation and the Single Activity: Learnings from a Skeptic

Droidcon Berlin: Navigation and the Single Activity: Learnings from a Skeptic

Fragments have often been the controversial, and to some, the stuff of nightmares, with the inconsistency of lifecycle events, complex UI interaction, and unexpected behaviours making many Android developers suspicious of their usage.

But with the development and recent stable publication of the navigation library, it may be the right time to give them a chance. Giving Fragments a second chance is not something I’d ever thought I’d be saying, but it’s a fantastic opportunity to find a solution to sharing data across a single screen.

Explore with me as I walk you through my experience implementing the navigation library and safeargs, and how I used them to implement type safe argument bindings, and how you can utilise the once troubled framework type to your advantage.

Ash Davies

July 02, 2019
Tweet

More Decks by Ash Davies

Other Decks in Programming

Transcript

  1. Navigation and the Single Activity
    Learnings from a Skeptic
    @askashdavies

    View Slide

  2. Random Slides
    Cheese
    @askashdavies

    View Slide

  3. Navigation and the Single Activity
    Learnings from a Skeptic
    @askashdavies

    View Slide

  4. @askashdavies

    View Slide

  5. @askashdavies

    View Slide

  6. class MainActivity : AppCompatActivity {
    private val message: EditText
    get() = findViewById(R.id.message)
    override fun onCreate(savedInstanceState: Bundle) {
    /* ... */
    }
    fun sendMessage() {
    val intent = Intent(this, DisplayMessageActivity::class.java)
    intent.putExtra(DisplayMessageActivity.EXTRA_MESSAGE, message.text.toString())
    startActivity(intent)
    }
    }
    @askashdavies

    View Slide

  7. !
    @askashdavies

    View Slide

  8. "Once we have gotten in to this entry-point to your UI, we really
    don't care how you organise the flow inside."
    — Dianne Hackborn, Android Framework team, 2016
    @askashdavies

    View Slide

  9. !
    @askashdavies

    View Slide

  10. View Slide

  11. public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.news_articles);
    // Check that the activity is using the layout version with the fragment_container FrameLayout
    if (findViewById(R.id.fragment_container) != null) {
    // However, if we're being restored from a previous state, then we don't need to do anything,
    // and should return or else we could end up with overlapping fragments.
    if (savedInstanceState != null) {
    return;
    }
    // Create a new Fragment to be placed in the activity layout
    HeadlinesFragment firstFragment = new HeadlinesFragment();
    // In case this activity was started with special instructions from an
    // Intent, pass the Intent's extras to the fragment as arguments
    firstFragment.setArguments(getIntent().getExtras());
    // Add the fragment to the 'fragment_container' FrameLayout
    getSupportFragmentManager()
    .beginTransaction()
    .add(R.id.fragment_container, firstFragment)
    .commit();
    }
    }
    }
    @askashdavies

    View Slide

  12. public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.news_articles);
    // Check that the activity is using the layout version with the fragment_container FrameLayout
    if (findViewById(R.id.fragment_container) != null) {
    // However, if we're being restored from a previous state, then we don't need to do anything,
    // and should return or else we could end up with overlapping fragments.
    if (savedInstanceState != null) {
    return;
    }
    // Create a new Fragment to be placed in the activity layout
    HeadlinesFragment firstFragment = new HeadlinesFragment();
    // In case this activity was started with special instructions from an
    // Intent, pass the Intent's extras to the fragment as arguments
    firstFragment.setArguments(getIntent().getExtras());
    // Add the fragment to the 'fragment_container' FrameLayout
    getSupportFragmentManager()
    .beginTransaction()
    .add(R.id.fragment_container, firstFragment)
    .commit();
    }
    }
    }
    @askashdavies

    View Slide

  13. public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.news_articles);
    // Check that the activity is using the layout version with the fragment_container FrameLayout
    if (findViewById(R.id.fragment_container) != null) {
    // However, if we're being restored from a previous state, then we don't need to do anything,
    // and should return or else we could end up with overlapping fragments.
    if (savedInstanceState != null) {
    return;
    }
    // Create a new Fragment to be placed in the activity layout
    HeadlinesFragment firstFragment = new HeadlinesFragment();
    // In case this activity was started with special instructions from an
    // Intent, pass the Intent's extras to the fragment as arguments
    firstFragment.setArguments(getIntent().getExtras());
    // Add the fragment to the 'fragment_container' FrameLayout
    getSupportFragmentManager()
    .beginTransaction()
    .add(R.id.fragment_container, firstFragment)
    .commit();
    }
    }
    }
    @askashdavies

    View Slide

  14. Activity Lifecycle != Fragment Lifecycle
    @askashdavies

    View Slide

  15. Activity Lifecycle != Fragment Lifecycle != View Lifecycle
    @askashdavies

    View Slide

  16. Jose Alcerreca | Lifecycles cheet sheet beta1 (AndroidP/Jetpack 1.0)

    View Slide

  17. ➡ ⬆ ➡
    @askashdavies

    View Slide

  18. (supportFragmentManager || childFragmentManager)?
    @askashdavies

    View Slide

  19. @askashdavies

    View Slide

  20. Bundles
    @askashdavies

    View Slide

  21. FragmentFactory
    androidx.fragment:fragment:1.1.0-beta01
    @askashdavies

    View Slide

  22. Fragments?
    @askashdavies

    View Slide

  23. Fragments?
    @askashdavies

    View Slide

  24. Activity Capabilities
    @askashdavies

    View Slide

  25. Shared Element
    Transition (API 21+)
    @askashdavies

    View Slide

  26. CompatShims < Enough
    @askashdavies

    View Slide

  27. android.app.Fragment
    androidx.fragment.app.Fragment
    @askashdavies

    View Slide

  28. Scopes
    @askashdavies

    View Slide

  29. Scopes
    @askashdavies

    View Slide

  30. Scopes
    @askashdavies

    View Slide

  31. Scopes
    @askashdavies

    View Slide

  32. !"
    @askashdavies

    View Slide

  33. @askashdavies

    View Slide

  34. @askashdavies

    View Slide

  35. Android JetPack
    @askashdavies

    View Slide

  36. Android JetPack
    @askashdavies

    View Slide

  37. Android JetPack
    @askashdavies

    View Slide

  38. Android JetPack
    @askashdavies

    View Slide

  39. Android JetPack: Navigation
    @askashdavies

    View Slide

  40. Android JetPack: Navigation
    • Libraries
    !
    • Plugin
    "
    • Tooling
    #
    @askashdavies

    View Slide

  41. • Fragment transactions
    • Up and back actions
    • Standardised transition resources
    • Deep link implementation
    • Easy navigation patterns
    • Type safe arguments
    @askashdavies

    View Slide

  42. Principles of Navigation
    @askashdavies

    View Slide

  43. Fixed Start Destination
    @askashdavies

    View Slide

  44. State as Stack
    @askashdavies

    View Slide


  45. @askashdavies

    View Slide


  46. @askashdavies

    View Slide

  47. Deep Link Simulates Manual Navigation
    @askashdavies

    View Slide

  48. JetPack: Navigation
    @askashdavies

    View Slide

  49. Navigation Graph
    @askashdavies

    View Slide

  50. View Slide

  51. Destination Types
    • Activity
    • Fragment
    • Dialog (2.1.0+)
    @askashdavies

    View Slide

  52. Destination Types (Custom)
    developer.android.com/guide/navigation/navigation-add-new
    • Extend Navigator with your type
    • Provide Destination implementation
    • Configure arguments after inflation
    • Augment NavController
    @askashdavies

    View Slide

  53. nav_graph.xml
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/navigation"
    app:startDestination="@+id/fragmentMain">
    android:id="@+id/fragmentMain"
    android:name="com.google.sample.MainFragment"
    android:label="@string/main_title"
    tools:layout="@layout/main_fragment">
    android:id="@+id/mainToViewBalance"
    app:destination="@+id/fragmentViewBalance"/>

    android:id="@+id/fragmentViewBalance"
    android:name="com.google.sample.ViewBalanceFragment"
    android:label="@string/view_balance_title"
    tools:layout="@layout/view_balance_fragment" />

    @askashdavies

    View Slide

  54. Resource Inflation
    @askashdavies

    View Slide

  55. NavHostFragment
    android:id="@+id/nav_host_fragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:defaultNavHost="true"
    app:navGraph="@navigation/nav_graph" />
    @askashdavies

    View Slide

  56. NavController
    • Fragment.findNavController()
    • View.findNavController()
    • Activity.findNavController(viewId: Int)
    @askashdavies

    View Slide

  57. Actions
    viewTransactionsButton.setOnClickListener { view ->
    view.findNavController().navigate(R.id.viewTransactionsAction)
    }
    button.setOnClickListener(
    Navigation.createNavigateOnClickListener(R.id.next_fragment, null)
    )
    @askashdavies

    View Slide

  58. Deep Links
    @askashdavies

    View Slide

  59. Deep Links

    package="com.example.myapplication">


    ...

    ...



    @askashdavies

    View Slide

  60. Deep Links
    android:id="@+id/profile"
    android:name=".ProfileActivity">


    @askashdavies

    View Slide

  61. Navigation Styles
    @askashdavies

    View Slide

  62. Navigation Styles
    Toolbar
    @askashdavies

    View Slide

  63. Navigation Styles
    Bottom
    @askashdavies

    View Slide

  64. Navigation Styles
    Drawer
    @askashdavies

    View Slide

  65. NavigationUI
    setupWithNavController()
    @askashdavies

    View Slide

  66. class AwesomeActivity : AppCompatActivity() {
    private val controller: NavController by lazy(NONE) { findNavController(this, R.id.host) }
    private val drawer: DrawerLayout by lazy(NONE) { findViewById(R.id.drawer) }
    private val toolbar: Toolbar by lazy(NONE) { findViewById(R.id.toolbar) }
    override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.awesome_activity)
    toolbar.setupWithNavController(controller, drawer)
    }
    }
    @askashdavies

    View Slide

  67. NavigationUI
    NavigationUI.setupActionBarWithNavController(
    activity: AppCompatActivity,
    controller: NavController,
    configuration: AppBarConfiguration
    )
    NavigationUI.setupWithNavController(
    toolbar: Toolbar,
    controller: NavController,
    configuration: AppBarConfiguration
    )
    @askashdavies

    View Slide

  68. NavigationUI: AppBarConfiguration
    • Top level destinations
    • Drawer layout
    • Fallback "up" listener
    @askashdavies

    View Slide

  69. OnDestinationChangedListener
    NavController.addOnDestinationChangedListener
    interface OnDestinationChangedListener {
    fun onDestinationChanged(
    controller: NavController,
    destination: NavDestination,
    arguments: Bundle?
    );
    }
    @askashdavies

    View Slide

  70. Bundles
    @askashdavies

    View Slide

  71. Honourable Mention
    Eugenio Marletti: Android Extras Delegates
    github.com/Takhion/android-extras-delegates
    @askashdavies

    View Slide

  72. Android Extras Delegates
    class SomeActivity : Activity() {
    companion object : ActivityCompanion(
    intentOptions = IntentOptions,
    kclass = SomeActivity::class
    )
    object IntentOptions {
    var Intent.someExtra by IntentExtra.String()
    }
    }
    @askashdavies

    View Slide

  73. SafeArgs
    @askashdavies

    View Slide

  74. SafeArgs: Directions
    MainFragmentDirections.mainToViewBalance()
    android:id="@+id/fragmentMain"
    android:name="com.google.sample.MainFragment"
    android:label="@string/main_title"
    tools:layout="@layout/main_fragment">
    android:id="@+id/mainToViewBalance"
    app:destination="@+id/fragmentViewBalance"/>

    @askashdavies

    View Slide

  75. SafeArgs: Directions
    android:id="@+id/fragmentViewBalance"
    android:name="com.google.sample.ViewBalanceFragment"
    android:label="@string/view_balance_title"
    tools:layout="@layout/view_balance_fragment">
    android:name="balanceAmount"
    app:argType="integer"/>

    @askashdavies

    View Slide

  76. SafeArgs: Args
    class MainFragment: Fragment() {
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    viewTransactionsButton.setOnClickListener { view ->
    MainFragmentDirections.mainToViewBalance(100)
    }
    }
    }
    class ViewBalanceFragment : Fragment() {
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    val args = ViewBalanceFragmentArgs.fromBundle(arguments!!)
    balance.setText(String.format("%.2d", args.balanceAmount))
    }
    }
    @askashdavies

    View Slide

  77. SafeArgs: Generated Args
    data class ViewBalanceFragmentArgs(val balanceAmount: Int) : NavArgs {
    @Suppress("CAST_NEVER_SUCCEEDS")
    fun toBundle(): Bundle {
    val result = Bundle()
    result.putInt("balanceAmount", this.balanceAmount)
    return result
    }
    companion object {
    @JvmStatic
    fun fromBundle(bundle: Bundle): FinanceBorrowerFragmentArgs {
    bundle.setClassLoader(FinanceBorrowerFragmentArgs::class.java.classLoader)
    val __balanceAmount : Int
    if (bundle.containsKey("balanceAmount")) {
    __balanceAmount = bundle.getInt("balanceAmount")
    } else {
    throw IllegalArgumentException("Required argument \"balanceAmount\" is missing and does not have an android:defaultValue")
    }
    return FinanceBorrowerFragmentArgs(__balanceAmount)
    }
    }
    }
    @askashdavies

    View Slide

  78. SafeArgs: Generated Directions
    class MainFragmentDirections private constructor() {
    private data class MainToViewBalance(val balanceAmount: Int) : NavDirections {
    override fun getActionId(): Int = R.id.mainToViewBalance
    @Suppress("CAST_NEVER_SUCCEEDS")
    override fun getArguments(): Bundle {
    val result = Bundle()
    result.putInt("balanceAmount", this.index)
    return result
    }
    }
    companion object {
    fun mainToViewBalance(balanceAmount: Int): NavDirections = BorrowerToBorrower(index, financeBorrower)
    }
    }
    @askashdavies

    View Slide

  79. Single Source of Truth
    @askashdavies

    View Slide

  80. SafeArgs: Activities
    @askashdavies

    View Slide

  81. SafeArgs: Activities
    class MainActivity : Activity {
    override fun onCreate(savedInstanceState: Bundle) {
    super.onCreate(savedInstanceState)
    val args = ViewBalanceActivityArgs(100)
    val intent = Intent(this, ViewBalanceActivity::class.java)
    startActivity(intent, bundle.toBundle())
    }
    }
    @askashdavies

    View Slide

  82. SafeArgs: Getting Started
    buildscript {
    repositories {
    google()
    }
    dependencies {
    classpath "androidx.navigation:navigation-safe-args-gradle-plugin:2.0.0"
    }
    }
    apply plugin: 'androidx.navigation.safeargs.kotlin'
    @askashdavies

    View Slide

  83. !
    Migrating
    @askashdavies

    View Slide

  84. !
    Migrating
    @askashdavies

    View Slide

  85. !
    Migrating
    Move screen behaviour away from activities
    @askashdavies

    View Slide

  86. !
    Migrating
    Create new activity for Fragment's
    @askashdavies

    View Slide

  87. !
    Migrating
    Move existing activity logic to fragment
    • FragmentBindings -> ActivityBindings

    onCreate()
    ->
    onCreateView()

    onViewCreated()

    getViewLifecycleOwner()
    @askashdavies

    View Slide

  88. !
    Migrating
    Initialise fragment in host activity
    @askashdavies

    View Slide

  89. Initialise fragment in host activity
    override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.cheese_activity)
    if (savedInstanceState == null) {
    supportFragmentManager
    .beginTransaction()
    .add(R.id.main_content, CheeseListFragment())
    .commit()
    }
    fun navigateToCheeseDetail(productId: String) {
    ...
    }
    }
    @askashdavies

    View Slide

  90. Pass arguments as necessary
    override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.cheese_activity)
    if (savedInstanceState == null) {
    val fragment = CheeseListFragment() //
    !
    fragment.arguments = intent.extras
    supportFragmentManager
    .beginTransaction()
    .add(R.id.main_content, fragment)
    .commit()
    }
    fun navigateToCheeseDetail(productId: String) {
    ...
    }
    }
    @askashdavies

    View Slide

  91. !
    Migrating
    Create navigation graph
    @askashdavies

    View Slide

  92. Create navigation graph
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:startDestination="@+id/cheeseGraph">
    android:id="@+id/cheeseListFragment"
    android:name="com.sample.CheeseListFragment"
    android:label="@string/cheese_list_title"
    tools:layout="@layout/cheese_list_fragment" />
    android:id="@+id/cheeseDetailsFragment"
    android:name="com.sample.CheeseDetailsFragment"
    android:label="@string/cheese_details_title"
    tools:layout="@layout/cheese_details_fragment" />

    @askashdavies

    View Slide

  93. Create navigation host
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:name="androidx.navigation.fragment.NavHostFragment"
    app:navGraph="@navigation/cheese_list_graph"
    app:defaultNavHost="true" />
    @askashdavies

    View Slide

  94. !
    Migrating
    class CheeseHostActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.cheese_activity)
    }
    }
    @askashdavies

    View Slide

  95. Navigation Directions
    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:startDestination="@+id/cheeseGraph">
    android:id="@+id/cheeseListFragment"
    android:name="com.sample.CheeseListFragment"
    android:label="@string/cheese_list_title"
    tools:layout="@layout/cheese_list_fragment">
    android:id="@+id/navigateToCheeseDetails"
    app:destination="@+id/cheeseDetailsFragment"/>

    android:id="@+id/cheeseDetailsFragment"
    android:name="com.sample.CheeseDetailsFragment"
    android:label="@string/cheese_details_title"
    tools:layout="@layout/cheese_details_fragment">
    android:name="cheeseId"
    app:argType="string" />


    @askashdavies

    View Slide

  96. CheeseListFragment
    class CheeseListFragment : Fragment() {
    ...
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    cheeseAdapter = CheeseAdapter(cheeseClickCallback)
    binding.productsList.setAdapter(productAdapter)
    }
    ...
    // The callback makes the call to the activity to make the transition.
    private val productClickCallback = ProductClickCallback { cheese ->
    val directions = CheeseListDirections.navigateToCheeseDetails(cheese.id)
    findNavController().navigate(directions)
    }
    }
    @askashdavies

    View Slide

  97. !
    Profit
    @askashdavies

    View Slide

  98. onActivityResult?
    @askashdavies

    View Slide

  99. onActivityResult
    https://issuetracker.google.com/issues/79672220
    @askashdavies

    View Slide

  100. Jose Alcérreca: LiveData>
    http://bit.ly/2YuSYXi
    @askashdavies

    View Slide

  101. Dynamic Features
    Coming Soon? ™
    @askashdavies

    View Slide

  102. Ian Lake: Single Activity: Why, When, and How
    bit.ly/2Jo94x9

    View Slide

  103. Thanks!
    @askashdavies

    View Slide