Android Nested Fragment Approach

Question

I am newbie in using android fragments .I got a scenario Let me explain it i got

1. Main Activity that extends FragmentActivity .My main activity consists of two Fragments
2. Option List That extends Fragment
3. Details List that extends Fragment
4. Details description that extends Fragment

When I launch my main activity . It will consist of Option List in Fragment 1 & Details List in Fragment 2 . Then i select an item from Details List . Then its Description must be loaded into Fragment 2 of the main activity

See this image

I am not getting an idea how to achieve this . I mean how can i tell Details List fragment to load Details description fragment inside main activity . Also when i press back button i must return to the initial stage ie

EDIT :

What i did was creating a interfaces(Listener) inside fragments and implement it on my parent activity. But if there is 10 different fragments i need implement all interfaces in my parent activity . So is there any other approach to achieve this??

Answer 1

The thing to always remember when developing fragments is that it needs a UI in order for it to be displayed. You need a place in your layout where you want the fragment be. There are two ways of doing that:

• Create a Fragment class and declaring them in your layout like below.

  Here we assume that we have created a ArticleListFragment and ArticleReaderFragment fragment.

  <fragment
      android:id="@+id/list"
      android:name="com.example.news.ArticleListFragment"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1" />
  
  <fragment
      android:id="@+id/viewer"
      android:name="com.example.news.ArticleReaderFragment"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="2" />
  

  The downside of doing this is that you can't change this at runtime, meaning when your application is executing you can't replace a fragment with another one. If you have to display two fragments for example you have to declare two in your layout and hide either one. Fortunately there's another way.

• Programmatically adding your fragment at runtime. In this approach you have to declare a layout first and be sure to add a container (LinearLayout, RelativeLayout, etc) where you will place the fragment. For example:

  <ListView
      android:id="@id/options_list"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1" >
  </ListView>
  
  <LinearLayout
      android:id="@id/detail_layout"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="2"
      android:orientation="vertical" >
  </LinearLayout>
  

Here I define a list options_list for your options and a layout detail_layout where you need will put the details. Now at runtime when an option is clicked you display the details fragment on detail_layout like:

ExampleFragment fragment = new ExampleFragment();
getFragmentManager().beginTransaction().add(R.id.detail_layout, fragment).commit();

To replace that fragment with another one:

Fragment newFragment = new AnotherExampleFragment();
getFragmentManager().beginTransaction().replace(R.id.detail_layout, newFragment).addToBackStack(null).commit();

Notice the call to addToBackStack. This is needed so that when the user presses Back, the previous one will be displayed.

I think you can figure it out from here. :)

Answer 2

In Your Fragment Activity, you can use 2 containerviews (2 Linearlayouts for example) - for your left navigation (Option List) and your right content. Then you need a public function like public void switchFragmentInContainer(Fragment f, int position) in which you load a new fragment to your container...

In your OptionList, you call this function like ((FragmentActivity) getActivity).switchFragmentInContainer(NEWFRAGMENT, FragmentActivity.RIGHT);.

I hope this is what you searched for.

Answer 3

According to http://developer.android.com/guide/components/fragments.html#Adding

// Create new fragment and transaction
Fragment newFragment = new ExampleFragment();
FragmentTransaction transaction = getFragmentManager().beginTransaction();

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

// Commit the transaction
transaction.commit();

You may also need:

public class MainActivity extends FragmentActivity {
    ...
    public void onArticleSelected(Uri articleuri) {
        //use data to add the new fragment
    }
    ...
} 

public static class FragmentA extends ListFragment {
    OnArticleSelectedListener mListener;

    // Container Activity must implement this interface
    public interface OnArticleSelectedListener {
        public void onArticleSelected(Uri articleUri);
    }
    ...
    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        try {
            mListener = (OnArticleSelectedListener) activity;
        } catch (ClassCastException e) {
            throw new ClassCastException(activity.toString() + " must implement OnArticleSelectedListener");
        }
    }
    ...

    @Override
    public void onListItemClick(ListView l, View v, int position, long id) {
        // Append the clicked item's row ID with the content provider Uri
        Uri noteUri = ContentUris.withAppendedId(ArticleColumns.CONTENT_URI, id);
        // Send the event and Uri to the host activity
        mListener.onArticleSelected(noteUri);
    }
    ...
}