I have a project where the designs require a sliding drawer that comes from the bottom and has essentially three states.
fully collapsed (just the handle at the bottom
half mast (drawer opens from bottom but only halfway up the screen
full mast (drawer opens from bottom and takes up the whole screen minus a top margin of lets say 80dp
I am developing for android 4.0 and higher and obviously sliding drawer is deprecated. But the Navigation drawer only supports left and right (which i already have in use)
So i am wondering if anyone knows a tutorial or even a custom component someone has written that meets the above functionality requirements
In my experience, you probably have to create something yourself, but since you're developing for api lvl 14, check out ObjectAnimator. It allows you to move Views around and still use them (by that I mean that it's the original view that has been moved and not a copy of it)
This will probably be the easiest way.
FYI, using the Navigation Drawer, you can't open the drawer halfway, or you should programmatically invoke touch events...
I think this is what you are looking for.
I have found this library best so far for sliding up menus in Android.
https://github.com/umano/AndroidSlidingUpPanel
You can specify what screen area slide up menu or view will use.
Accept & vote up my answer if it is what you are looking for.
Related
I am looking to implement a menu like used on the Android Uber app.
It seems to be like an action bar on top with 3 small settings stripes on left side. (probably not a real action bar)
When clicking in that area a black menu slides out from the left and occupies 70% of the screen.
The right side of the screen still showing the map is darkened to keep focus on the menu.
I like that style, it looks good and everyone immediately knows how to use it.
I would like to have the same but don't know where to start or if there is maybe something available that would do something similar.
The actionbar itself only offers the menu on top right which is better for pure settings.
I also experimented with a split action bar having the menu items on bottom but that also seems superior to the clean interface Uber provides.
You want the Android Navigation Drawer. It's an Android sanctioned navigation pattern and more details about it can be found here. For some more technical documentation and an example of how to use it, you can find a sample over here. It works great with the Action Bar so shouldn't need anything too custom outside of what the Android v4 compat library gives you.
I'm experimenting for the first time with Android's Navigation Drawer. I think it is a very elegant way to provide an application menu. However, showing my prototype to some friends, it seems that it is not quit intuitive to search for a menu i) on the top left corner respectively ii) on the left side of the screen.
To provide a "user hint" for case i), I added a custom image by creating an ActionBarDrawerToggle. This results in following design of the title bar (the little arrow is the cutom image, while the red star is the application icon):
Now while developping, I thought this is quite obvious, but apparantly I'm wrong :). So as a second idea, to support a user to find option ii) described below, I tried to figure out how to add a further image at a specific place, which I want to explain with following image:
Don't look at the design itself in the first place, but following: the image must be placed outside of the "view bounds" (when the navigation menu is hidden), and also exceed the navigation panel itself on the right side (always). Is this in any way possible without customize the entire navigation panel? I really wonder why I can't find much about this idea, since I think it is a very nice option to provide for the user (as long as the arrow don't disturbs the application usage)
Although I haven't actually tested it with Android's Navigation Drawer,
did you try putting an imageview in your activity's layout? The image would be placed in the middle vertically and on parent left horizontally. I believe this would work (i.e. the image will get pushed when you open the drawer. As an improvement you could also change the image itself in the drawer's callbacks, so that you have an arrow pointing right when the drawer is closed and an arrow pointing left when the drawer is open.
Hope it helps.
I'm using the slide menu library and setting the menu offset from a xml.
setBehindOffsetRes(R.dimen.slidingmenu_offset);
when I click the menu item I use
menu.toggle(true);
which moves the content to left with menu behind it. My scenario is when I click the menu item, the content has to move all the way to right and then should bring the content in like the normal way so that the user dont get to see the UI change. I used
setBehindOffsetRes(R.dimen.slidingmenu_fullscreen);
showMenu(true);
where R.dimen.slidingmenu_fullscreen = 0dp. The menu goes to full screen behind the content, but the content doesn't moves to the right. Thanks in advance!
Edit 1: This is similar to Xoom application... Sample "Slide Sample"
I would recommend using ActionBarSherlock. Use this tutorial for sliding menu, It is much easier to use, and you will find much more help with it. It is also more compatible with different screen sizes, and more Android versions.
Finally I figured it myself.
menu.mViewAbove.scrollTo(menu.mViewAbove.getScrollX()-200,0);
moved the content to right. But now got into another problem. which I have descibed here->
https://stackoverflow.com/questions/19714871/sliding-menu-move-content-to-right
The SlidingMenu library is an excellent third party library and I've already used it for a long time. Now I know Android provides a new navigation pattern using Navigation Drawer. It looks like the sliding menu. So is there anyone who already uses these two both? What is the difference and what are the pros and cons? Thanks a lot.
SlidingMenu library is a third party api which uses a RelativeLayout inside. The main advantage is customization according to your requirement. Buy your layouts have to be based on a viewgroup, unfortunatly this negates the <merge> optimisations.
Navigation Drawer is available in the Support Library of android it uses DrawerLayout inside. The main advantage is improved performance.
They also have different visual effects. SlidingMenu looks like horizontal scroll view. Sliding it in will push the main content out.
Pros :
It comes with cool entrance / exit animations for the menu content.
Depending on what Activity you use it on, it can be placed below the Action Bar or next to it (pushing the Action Bar too)
You can explicitly set the touch mode via a setter: margin or full screen. In full screen mode touching anywhere on the screen will open the menu. In margin, only when you slide from the edge of screen will the menu open.
Cons :
You can only control the shadow of the side menu
Navigation Drawer / Drawer Layout looks like an additional top level view in a frame layout. Sliding it in will mask the main content.
Pros :
If you use v4 support lib then it's already there.
You can control both the side menu shadow and obscure the main
content via setScrimColor e.g when the drawer is opened, a fade-in
alpha layer will appear above the main content. This is good to visually separate the content and the menu especially when both have a same color.
Cons:
It can only be placed below ActionBar
There is no setter for touch mode and by default you can only do margin touch mode. Doing a full screen touch mode (like Youtube) involves a lot of work
I think the best advantage is that It is official Google code, I mean it just works and works excellent.
The main disadvantage is that it is very basic to use, I mean... you cannot put two navigation drawer in the same activity or fragment, you can only use one in left and that's it.
You already said it yourself. Sliding menu is third party. Navigation drawer is official. Both have the same purpose, but third party libraries might implementing it slightly differently, depending on which one you use.
I am developing an app on Android and would like to use the similar menu bar like Google Plus or Facebook, when you click the button, the menu bar will slide in and will not occupy the whole screen. Any ideas on that?
Thanks.
A pretty popular library for accomplishing the 'sliding menu' effect (or 'drawer' as the design guidelines on the Android developer website prefer to call it) is Jeremy Feinstein's SlidingMenu. It's also compatible with ActionBarSherlock, in case your project is using that too. Unfortunately, at this stage there is no component built into the SDK that allows you to do easily accomplish the same thing.
There are also a couple of alternative implementations for a sliding menu (do a search either here on SO or Google), but I haven't checked those out for a little while. If I recall correctly, there are especially some variations in terms of whether the ActionBar is supposed to slide along with the content or stay fixed at the top of the screen.
You can use FrameLayout in parent view and use translate animation in menu layout to show the slide in and slide out effect.