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. :)