Getting DrawerLayout to Slide over the ActionBar

Question

I have a sliding drawer menu in an activity, which has an actionbar with some tabs on it.

I'd like to get the sliding drawer to slide over the tabs , not below them.

This is what it looks like right now...

Any ideas on how this could be done?

Note: I understand that I might be breaking some conventions and UI patterns here, and if it does not work at all, I'll look at alternatives. But I'd like to get this working first.

EDIT: See the below screen shot of the Google Play Music app that does exactly what I need. See @CommonsWare's answer below where he does agree that I might be breaking convention. But then given the Play Music app, it may not be altogether that rare either.

Answer 1

I managed to achieve this requirement by setting the navigationMode inside OnDrawerClosed and onDrawerOpened functions. It is a temp fix since the tabs actually do not disappear immediately.

  public void onDrawerClosed(View view) {
          getActionBar().setTitle(mTitle);
          if(getActionBar().getTabCount()>0) //Add tabs when the fragment has it
          getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);               
                        ...
                    }

---

   public void onDrawerOpened(View drawerView) {
            getActionBar().setTitle(mDrawerTitle);
            getActionBar().setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);              
                    ..

                    }

If you have some fragments with tabs, and other without it don't forget to remove tabs onCreateView of fragment that does not have tabs.

 getActionBar().removeAllTabs();

Answer 2

Play music does not use standard ActionBar.Tab Then you can implement your own tab container by extend HorizontalScrollView and work together with ViewPager

Answer 3

Actionbar Navigaton Drawer and SwipeTabs cant be used simultaneously. You should implement Navigation Drawer using Actionbar and swipetabs by simple Tabhosts. You can use Tabhost for tabs and use fragments for inside view of each Tab. Fragments should be used via viewpager to provide scrolling/swiping effect. Connect tabs and viewpager with eachother through their methods

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TabHost
    android:id="@+id/tabHost"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <HorizontalScrollView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:fillViewport="true"
            android:scrollbars="none" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >
            </TabWidget>
        </HorizontalScrollView>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <android.support.v4.view.ViewPager
                android:id="@+id/viewPager_home"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </FrameLayout>
    </LinearLayout>
</TabHost>

Answer 4

Finally, a clean way to achieve navigation drawer over sliding tabs in this blog http://www.paulusworld.com/technical/android-navigationdrawer-sliding-tabs