1 Agenda

• Fragment Implementation
• Fragment Lifecycle
• Changing Fragments in Code
• Navigation in Compose
• Assignment 3

2 Fragment Basics

• Component introduced in Android 3.0 (API level 11)
• Multiple Fragments can be combined in one Activity
• Each Fragment defines a part of the UI in an Activity and must be embedded in an Activity
• The lifecycle of a Fragment is directly dependent on the Activity's lifecycle
• But: Fragments can be independently manipulated (e.g. added or removed)
• The Layout is defined in a layout.xml, the implementation in a class derived from the class Fragment

2.1 Fragment View Layout

• Two Fragments can be contained in one Activity (left) or in separate Activities (right)

  

2.2 Fragment View Layout

• Example Activity Layout with two Fragments

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >
    <fragment
        android:id="@+id/fragment1"
        android:name="com.example.fragmentexampleapp.ExampleListFragment"
        android:layout_width="248dp"
        android:layout_height="match_parent" />
    <fragment
        android:id="@+id/fragment2"
        android:name="com.example.fragmentexampleapp.ExampleDetailFragment"
        android:layout_width="wrap_content"
        android:layout_height="match_parent" />
</LinearLayout>

2.3 Fragment Implementation

• Create a subclass of Fragment

class ExampleDetailFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        return inflater.inflate(R.layout.detail_fragment, container, false)
    }
}

• And implement onCreateView() returning the View that will be embedded in the surrounding Activity
• LayoutInflater loads XML based layouts and creates View hierarchy

4 FragmentManager

• Instead of defining a fragment for an activity in the layout file, it can be added during runtime
• The FragmentManager class is used to create a FragmentTransaction
  • Provides APIs to add, remove and replace fragments
  • Call commit() when ready to make changes
• Fragments must have a container view in the layout. Read more: Fragment Manager

4.1 Loading Fragments dynamically

val newFragment = ArticleFragment()
val transaction = supportFragmentManager.beginTransaction()

/* Replace whatever is in the fragment_container view with this fragment,
and add the transaction to the back stack so the user can navigate back */
transaction.replace(R.id.fragment_container, newFragment)
transaction.addToBackStack(null)

// Commit the transaction
transaction.commit()

5 Navigation with Compose

• Modern Jetpack Compose applications prefer the usage of the navigation component.
• So first you have to introduce a navigation controller to hold the navigation graph
• Second you have to implement a NavHost to build the navigation graph

Please see the following example:

@Composable
fun MovieTracker() {
    //navController holds the navigation graph
    val navController: NavHostController = rememberNavController()

    MovieTrackerNavHost(navController = navController)
}

@Composable
fun MovieTrackerNavHost(navController: NavHostController) {
    //NavHost builds the navigation graph
    NavHost(navController = navController, startDestination = homeScreen) {
        composable(homeScreen) {
            HomeScreen(
                onSearchClick = {
                    navController.navigate(searchScreen)
                }
            )
        }
        composable(searchScreen) {
            SearchScreen(
                onMovieClick = { currentMovie: Movie ->
                    navController.popBackStack()
                }
            )
        }
    }
}

6 Android Assignment 3

7 Summary

• Fragments are a good way to create flexible user interfaces
• They encapsulate a UI-Controller for an logical part of the UI. This simplifies component oriented UI programming on Android
• They can be statically added to layout files for different device types and also be used dynamically to change the UI corresponding to changes of the devices screen

8 Recap Questions

• When would you use a Fragment and when only an Activity?
• When dynamically replacing a Fragment, what is required in the layout? Try to replace a Fragment dynamically.
• Why do you have to call commit, when dynamically changing fragments?
• When accessing a view component that is added in one Fragment from another Fragment, what do you have to consider concerning the lifecycle?
• Which methods are "safe" to access view components from?