Unit 3: Fragments and the Navigation Component

[WhoisAbel]

Fragment lifecycle

Like activities, fragments can be initialized and removed from memory, and throughout their existence, appear, disappear, and reappear onscreen. Also, just like activities, fragments have a lifecycle with several states, and provide several methods you can override to respond to transitions between them. The fragment lifecycle has five states, represented by the Lifecycle.State enum.

INITIALIZED: A new instance of the fragment has been instantiated. CREATED: The first fragment lifecycle methods are called. During this state, the view associated with the fragment is also created. STARTED: The fragment is visible onscreen but does not have "focus", meaning it can't respond to user input. RESUMED: The fragment is visible and has focus. DESTROYED: The fragment object has been de-instantiated.

• The lifecycle states and callback methods are quite similar to those used for activities. However, keep in mind the difference with the onCreate() method. With activities, you would use this method to inflate the layout and bind views. However, in the fragment lifecycle, onCreate() is called before the view is created, so you can't inflate the layout here. Instead, you do this in onCreateView(). Then, after the view has been created, the onViewCreated() method is called, where you can then bind properties to specific views.

[WhoisAbel]

The type should be FragmentLetterListBinding? and it should have an initial value of null. Why make it nullable? Because you can't inflate the layout until onCreateView() is called. There's a period of time in-between when the instance of LetterListFragment is created (when its lifecycle begins with onCreate()) and when this property is actually usable. Also keep in mind that fragments' views can be created and destroyed several times throughout the fragment's lifecycle. For this reason you also need to reset the value in another lifecycle method, onDestroyView().

[WhoisAbel]

• The only other thing to note is there are some subtle differences with the onCreateOptionsMenu() method when working with fragments. While the Activity class has a global property called menuInflater, Fragment does not have this property. The menu inflater is instead passed into onCreateOptionsMenu().

Fragment:

   override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
        inflater.inflate(R.menu.layout_menu, menu)

        val layoutButton = menu.findItem(R.id.action_switch_layout)
        setIcon(layoutButton)
    }

Activity:

    /**
     * Initializes the [Menu] to be used with the current [Activity]
     */
    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
        menuInflater.inflate(R.menu.layout_menu, menu)

        val layoutButton = menu?.findItem(R.id.action_switch_layout)
        // Calls code to set the icon based on the LinearLayoutManager of the RecyclerView
        setIcon(layoutButton)

        return true
    }

• Also note that the onCreateOptionsMenu() method used with fragments doesn't require a return statement.

[WhoisAbel]

• Note: requireContext() returns the Context this fragment is currently associated with.

[WhoisAbel]

The Navigation component has three key parts which you'll use to implement navigation in the Words app:

• Navigation Graph: The navigation graph is an XML file that provides a visual representation of navigation in your app. The file consists of destinations which correspond to individual activities and fragments as well as actions between them which can be used in code to navigate from one destination to another. Just like with layout files, Android Studio provides a visual editor to add destinations and actions to the navigation graph.
• NavHost: A NavHost is used to display destinations from a navigation graph within an activity. When you navigate between fragments, the destination shown in the NavHost is updated. You'll use a built-in implementation, called NavHostFragment, in your MainActivity.
• NavController: The NavController object lets you control the navigation between destinations displayed in the NavHost. When working with intents, you had to call startActivity to navigate to a new screen. With the Navigation component, you can call the NavController's navigate() method to swap the fragment that's displayed. The NavController also helps you handle common tasks like responding to the system "up" button to navigate back to the previously displayed fragment.

[WhoisAbel]

• However, destinations from the navigation graph are displayed to the user by the FragmentContainerView. All you need to do is to create an XML file and define the possible destinations. Then you can use the generated code to navigate between fragments.
• Below the id attribute, add a name attribute and set it to androidx.navigation.fragment.NavHostFragment. While you can specify a specific fragment for this attribute, setting it to NavHostFragment allows your FragmentContainerView to navigate between fragments.

android:name="androidx.navigation.fragment.NavHostFragment"

• This allows the fragment container to interact with the navigation hierarchy. For example, if the system back button is pressed, then the container will navigate back to the previously shown fragment, just like what happens when a new activity is presented.

app:defaultNavHost="true"

• Add an attribute called app:navGraph and set it equal to "@navigation/nav_graph". This points to an XML file that defines how your app's fragments can navigate to one another. For now, the Android studio will show you an unresolved symbol error. You will address this in the next task.

  app:navGraph="@navigation/nav_graph"

[WhoisAbel]

Configure MainActivity

• Create a navController property. This is marked as lateinit since it will be set in onCreate.

private lateinit var navController: NavController

• Then, after the call to setContentView() in onCreate(), get a reference to the nav_host_fragment (this is the ID of your FragmentContainerView) and assign it to your navController property.

  val navHostFragment = supportFragmentManager
  .findFragmentById(R.id.nav_host_fragment) as NavHostFragment
  navController = navHostFragment.navController

• Then in onCreate(), call setupActionBarWithNavController(), passing in navController. This ensures action bar (app bar) buttons, like the menu option in LetterListFragment are visible.

  setupActionBarWithNavController(navController)

• Finally, implement onSupportNavigateUp(). Along with setting defaultNavHost to true in the XML, this method allows you to handle the up button. However, your activity needs to provide the implementation.

override fun onSupportNavigateUp(): Boolean {
   return navController.navigateUp() || super.onSupportNavigateUp()
}