DrawerLayout and Multi Pane Layout

Question

My application uses a Multi Pane layout to display a list of assignments. Each Assignment can be put in one AssignmentCategory. I want to use a DrawerLayout to display all the AssignmentCategories so the user can switch easily between the diffirent categories.

I didn't manage to create such a layout. In the official DrawerLayout tutorial the DrawerLayoutActivity replaces a Fragment when a user clicks on a item (in my case an AssignmentCategory). The problem I facing is that a Multi Pane layout requires a FragmentActivity. I don't know how to create a Fragment which contains a Multi Pane layout. Did someone manage to do this?

Answer 1

Combining the two projects shouldn't be too difficult. In the sample code the DrawerLayout example does replace the content fragment but you don't have to do the same, you could simply update the same fragment to show the proper data. You could implement the two projects this way:

• start from the multi pane demo project.
• update the two activities of the multi pane demo to extends ActionBarActivity(v7), you don't need to extend FragmentActivity
• implement the DrawerLayout(the sample code from the drawer project) code in the start list activity(I'm assuming you don't want the DrawerLayout in the details activity, but implementing it shouldn't be a problem if you want it).

• the layout of the start list activity will be like this(don't forget that you need to implement the DrawerLayout changes in the activity_item_twopane.xml as well!):

  <DrawerLayout>
       <fragment android:id="@+id/item_list" .../>
       <ListView /> <!-- the list in the DrawerLayout-->
  </DrawerLayout>
  

• change the implementation DrawerItemClickListener so when the user clicks the drawer list item you don't create and add a new list fragment, instead you update the single list fragment from the layout:

  AssignmentListFragment alf = (AssignmentListFragment) getSupportFragmentManager()
          .findFragmentById(R.id.item_list);
  if (alf != null && alf.isInLayout()
          && alf.getCurrentDisplayedCategory() != position) {
      alf.updateDataForCategory(position); // the update method
      setTitle(DummyContent.CATEGORIES[alf.getCurrentDisplayedCategory()]);
  }
  

• the update method would be something like this:

  /**
  * This method update the fragment's adapter to show the data for the new
  * category
  * 
      * @param category
      *            the index in the DummyContent.CATEGORIES array pointing to the
  *            new category
  */
  public void updateDataForCategory(int category) {
      mCurCategory = category;
      String categoryName = DummyContent.CATEGORIES[category];
      List<DummyContent.Assigment> data = new ArrayList<Assigment>(
          DummyContent.ITEM_MAP.get(categoryName));
      mAdapter.clear(); // clear the old dsata and add the new one!
      for (Assigment item : data) {
              mAdapter.add(item);
      }
  }
  
  public int getCurrentDisplayedCategory() {
          return mCurCategory;
  }
  

  -various other small changes

I've made a sample project to illustrate the above changes that you can find here.