Background
In the recent months Google released the Youtube app with navigation drawer (AKA sliding menu).
it has many cool features that i wish to have on an app i'm working on.
the features are:
-
touch anywhere to start sliding.
-
moving icon on the "up" button of the action bar when switching modes.
-
content area (the area on the right, not the menu itself) stays instead of scrolling, when sliding the menu.
-
action bar stays instead of scrolling.
-
content area (the area on the right, not the menu itself) changes its color when scrolling, and not the menu itself.
here are screenshots to show what i'm talking about :
before sliding:
after sliding:
currently, i know of 2 main libraries that are responsible of using a navigation drawer :
-
the official google navigation drawer library .
the problem
both the official library and the slidingMenu library don't have all of those features combined like on the youtube app.
for example, the official library doesn't have ability #1 (that's why i've posted this thread) , so i used the slidingMenu library instead.
however, the slidingMenu library doesn't have (or is it?) ability #2 and #3 .
both libraries don't have enough documentation/examples of what can be done, so it's very hard to use them or add new features to them.
what i've tried
currently, i use the slidingMenu library, so this is my code for preparing the slidingMenu :
activity.setBehindContentView(slidingMenuRootView);
mSlidingMenu = activity.getSlidingMenu();
mSlidingMenu.setShadowWidthRes(R.dimen.slidingmenu_shadow_width);
mSlidingMenu.setShadowDrawable(R.drawable.slidingmenu_shadow);
mSlidingMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
mSlidingMenu.setFadeEnabled(true);
mSlidingMenu.setFadeDegree(1.0f);
mSlidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
activity.setSlidingActionBarEnabled(false);
question
how can i get the slidingMenu (or navigation drawer) to act like on youtube app , meaning with all of the features i've mentioned combined ?
possible solution
EDIT: using the menuDrawer library (github link here) , i've successfully achieved all of the features i've mentioned. here's a sample code:
public class ActionBarSherlockSample extends SherlockActivity {
private MenuDrawer mDrawer;
@Override
protected void onCreate(final Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getSupportActionBar();
mDrawer = MenuDrawer.attach(this, MenuDrawer.Type.OVERLAY);
final TextView menuView = new TextView(this);
menuView.setTextColor(0xFFFFFFFF);
menuView.setText("As the drawer opens, the drawer indicator icon becomes smaller.");
menuView.setGravity(Gravity.CENTER);
mDrawer.setMenuView(menuView);
mDrawer.setTouchMode(MenuDrawer.TOUCH_MODE_FULLSCREEN);
mDrawer.setOnDrawerStateChangeListener(new OnDrawerStateChangeListener() {
@Override
public void onDrawerStateChange(final int oldState, final int newState) {
Log.d("AppLog", "oldState:" + oldState + " newState:" + newState);
}
@Override
public void onDrawerSlide(final float openRatio, final int offsetPixels) {
}
});
final TextView contentView = new TextView(this);
contentView
.setText("This sample uses ActionBarSherlock to display an ActionBar on older platforms. The drawer indicator, "
+ "as per the design guidelines, is visible in the top left corner.");
contentView.setGravity(Gravity.CENTER);
mDrawer.setContentView(contentView);
mDrawer.setSlideDrawable(R.drawable.ic_drawer);
mDrawer.setDrawerIndicatorEnabled(true);
}
@Override
public boolean onOptionsItemSelected(final MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
mDrawer.toggleMenu();
break;
}
return super.onOptionsItemSelected(item);
}
}
Best Answer
Use this MenuDrawer
A slide-out menu implementation, which allows users to navigate between views in your app.
Features: