Activity to Fragment

Why do we refactor? Apps commonly need their UI to be flexible, and using UI Fragments allows just that. A Fragment is a modular piece of an activity, with its own UI, behavior, and lifecycle. You can put multiple fragments in an activity.

More about Fragments →

There are 5 steps we need to do in order for an activity to use a UI Fragment.

Setup the Fragment

Next, we need to create a spot in SupActivity's view hierarchy for the fragment.

Open up res/layouts/activity_sup.xml and replace everything with the following:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	android:orientation="vertical"
	android:id="@+id/fragment_container">
</FrameLayout>

The FrameLayout is a generic container view that can be used to host fragments.

More about Frame Layouts →

Adding a Library Dependency

Go to File > Project Structure, then select app under Modules on the left pane. Then select the Dependencies tab and click + at the bottom and choose the Library dependency.

Highlight the com.android.support:support-v4:25.0.0 library and select OK.

The purpose of SupFragment is to let the user select a contact and send "Sup" to that contact. We'll implement that later.

We then set SupFragment's view by overriding onCreateView(...). Autocomplete should help you with that. In this function, add the following:

View v = inflater.inflate(R.layout.fragment_sup, container, false);
return v;

Note: Make sure to include the libraries that are necessary. Generally, Android Studio's autocomplete will allow you to do this. You can also use alt+enter to enter.

Here, we see the LayoutInflater inflater, that inflates the fragment's view. The first parameter is the view's resource ID. The second parameter is the view's parent, which is needed to configure the widgets. The boolean at the end tells the inflater if we want to add the inflated view to the view's parent. We stated false here because we will add the view in the activity later.

Manage the Activity Lifecycle

Now, we'll use an activity to manage SupFragment's lifecycle.

We don't need to add anything specific to SupActivity in order to add a fragment to the activity. Therefore, we will create an abstract subclass of Activity that adds a fragment to itself, then subclass it in SupActivity.

Go to the /java/com/uci/android101/sup/ directory in the Project pane. Right click this and select New > Java Class.

Name the class SingleFragmentActivity. Choose android.support.v7.app.AppCompatActivity as the superclass, and in Modifiers, select Abstract.

Now, in SingleFragmentActivity.java, add the following:

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
	setContentView(R.layout.activity_fragment);
    FragmentManager fm = getSupportFragmentManager();
    Fragment fragment = fm.findFragmentById(R.id.fragment_container);
    if (fragment == null) {
        fragment = createFragment();
        fm.beginTransaction().add(R.id.fragment_container, fragment).commit();
    }
}

Make sure your code looks like this:

Again, you'll need to import the necessary classes using alt+enter, as we did before. If you notice, we still have an error - the resource ID referenced in setContentView(). We're actually just going to rename activity_sup.xml to activity_fragment.xml because it just contains a container for one fragment. To rename, right click activity_sup.xml in the left pane, then select Refactor > Rename, and rename it to activity_fragment.xml.

Run Your App

Press the green play button. Your app should look like this: