Android Fragments and Navigation

• Fragments and Navigation are key components in mobile application development, particularly in Android.

Fragment Definition

• A fragment represents a reusable portion of an application's user interface.
• A fragment defines and manages its own layout, lifecycle, and input events.
• Fragments cannot exist independently; they must be hosted by an activity or another fragment.
• Fragments enable modularity and reusability by dividing the UI into discrete chunks.
• Fragments make it easier to modify an activity's appearance at runtime for improved flexibility.
• Fragments can be added, replaced, or removed while the activity is in the STARTED lifecycle state or higher.

Creating a Fragment

• Create a fragment layout in the res directory to define the UI.
• Create a Java class that extends Fragment.
• Add the fragment to an activity using <androidx.fragment.app.FragmentContainerView> in the layout XML.

App Navigation

• Navigation refers to the interactions that allow users to navigate across, into, and back out from different pieces of content within an app.
• Host: A UI element that contains the current navigation destination.
• Graph: A data structure defining all navigation destinations within the app.
• Controller: Manages navigation between destinations, handling deep links and the back stack.
• Destination: A node in the navigation graph, displaying content when navigated to.
• Route: Uniquely identifies a destination and any required data for navigation.

App Navigation Benefits

• Provides standardized resources for animations and transitions.
• Implements and handles deep links to take the user directly to a destination.
• Supports UI patterns like navigation drawers and bottom navigation.
• Enables scoping a ViewModel to a navigation graph for sharing UI-related data.
• Fully supports and handles fragment transactions.
• Handles back and up actions correctly by default.

Navigation Controller

• The navigation controller is a key concept, holding the navigation graph and exposing methods to move between destinations.
• Example 1 NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
• Example 2
  • NavHostFragment navHostFragment = (NavHostFragment) getSupportFragmentManager().findFragmentById(R.id.nav_host_fragment);
  • NavController navController = navHostFragment.getNavController();

Navigation Graph

• The Navigation component uses a navigation graph to manage the app's navigation.

• The navigation graph is a data structure that contains each destination and the connections between them.

• Step 1: Define the navigation graph in XML. An example will be nav_graph.xml

• Step 2: Create a NavHostFragment which serves as the navigation host.

• XML Example

  • <androidx.fragment.app.FragmentContainerView android:id="@+id/nav_host_fragment" android:name="androidx.navigation.fragment.NavHostFragment" android:layout_width="match_parent" android:layout_height="match_parent" app:navGraph="@navigation/nav_graph" />

• Navigation Graph XML Example:

<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/nav_graph"
    app:startDestination="@id/profile">

    <fragment
        android:id="@+id/profile"
        android:name="com.example.ProfileFragment"
        android:label="Profile">
        <!-- Action to navigate from Profile to Friends List -->
        <action
            android:id="@+id/action_profile_to_friendslist"
            app:destination="@id/friendslist" />
    </fragment>

    <fragment
        android:id="@+id/friendslist"
        android:name="com.example.FriendsListFragment"
        android:label="Friends List" />
    <!-- Add other fragment destinations similarly -->
</navigation>

Navigating to a Destination

• Use the NavController to move between destinations.
• In the key type, use Bundle() to move between destinations
• Utilize getArguments() at the destination to retrieve data contained in the Bundle.

AppBarConfiguration

• NavigationUI uses an AppBarConfiguration object to manage the behavior of the Navigation button.
• The Navigation button's behavior changes based on whether the user is at a top-level destination.
• Top-level destinations do not display an Up button.
• The start destination is the default top-level destination.
• When at a top-level destination, the Navigation button becomes a drawer icon if the destination uses a DrawerLayout.
• If the destination doesn't use a DrawerLayout, the Navigation button is hidden.
• On any other destination, the Navigation button appears as an Up button.

AppBarConfiguration Configuration

• To configure the Navigation button using only the start destination as the top-level destination:
  • appBarConfiguration = new AppBarConfiguration.Builder(navController.getGraph()).build();
  • NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
• For multiple top-level destinations:
  • AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(R.id.navigation_home, R.id.navigation_dashboard, R.id.navigation_notifications, R.id.navigation_about).build();
  • NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
• With DrawerLayout:
  • DrawerLayout drawer = binding.drawerLayout;
  • mAppBarConfiguration = new AppBarConfiguration.Builder(R.id.nav_home, R.id.nav_gallery, R.id.nav_slideshow).setOpenableLayout(drawer).build();
  • NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
• Override onSupportNavigateUp() to handle Up navigation:

@Override
public boolean onSupportNavigateUp() {
    NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_content_main);
    return NavigationUI.navigateUp(navController, appBarConfiguration) || super.onSupportNavigateUp();
}