I would like to implement two Material Design elements in Android:
the Floating Action Button (FAB)
"shifting views" (not sure if this is the proper term)
I cannot find any Android widget to implement FABs. Which is the best recommended solution? is it to use third party libraries?
With "shifting view", I mean a view that shifts up and down. For example if you have two views in a fragment: top view which is fixed, and the bottom view which is a list, by scrolling the list, you can actually make the list take some space of the top view. How do you implement that? is it part of the Android framework or you need to use some third party libraries again?
There's no stock Android implementation of FAB, but I've used this implementation of FAB's in couple of my projects and its working great and supports the material greatness!
so given the fact that there's no FAB implementation on Android, you should go for a 3rd party implementation
By shifting views do you mean like toolbar? Like similar to this or this? Its hard to say, now knowing exactly the use case or what do toy mean, but this is what your explanation reminds me of
This one here might be pretty useful for any of the other material needed elements (widgets, dialogs, progress bars) and it also covers the FAB. As stated in the other answer, there is no default implementation so the solution would be to go for 3rd party libraries.
And here you can find different ways of implementing what you refer to as "shifting view". There is a demo app as well and it is easily customizable.
Related
Is there a library for creating Floating Action Buttons with labels (similar to the Evernote app)?
Evernote Screenshot
The popular libraries seem to be
https://github.com/futuresimple/android-floating-action-button (closest to what I want... ability to expand hide "sub" actions)
https://github.com/makovkastar/FloatingActionButton (Primary function is to hide/show with a scrollview, recyclerview, or listview)
https://github.com/oguzbilgener/CircularFloatingActionMenu (library which has been around pre-lollipop)
Neither of these, to my knowledge, have this capability. Before re-inventing the wheel, has somebody already done this?
This feature request ended up being implemented in https://github.com/futuresimple/android-floating-action-button. This includes labels on both the left and right sides.
If you're interested, see the discussion here: https://github.com/futuresimple/android-floating-action-button/issues/22#issuecomment-66155108
Disclaimer: I haven't used this (yet).
I'd recommend this library over others that I've seen.
Nowadays there are available techniques of manipulating behaviour of the view that enable you to program FloatinActionButton as you want and to have joy that you have made it by yourself!
Fade in/out FloatingActionButton while scrolling RecyclerView . DETAILS
Slide down/up , beside it blog says how to:
Expand floatingActionButton and show subFloatingButtons. DETAILS HERE
There is to much details, "how to do". Therefore I've attached just links to blogs. Anyway I encourage you guys to take a look at those blogs. You will have total control over your application. Currenty I use all solutions from both blog's. Enjoy!
Especially the last library you mentioned looks quite sophisticated. To my knowledge, you can set any kind of View you want to be shown as a Button.
This View could simply be a custom-view of yours that shows an image as well as a label.
In case anyone is still looking for this functionality: I made an Android library that has this ability and much more, called ExpandableFab (https://github.com/nambicompany/expandable-fab).
The Material Design spec refers to this functionality as 'Speed Dial' and ExpandableFab implements it along with many additional features.
Nearly everything is customizable (colors, text, size, placement, margins, animations and more) and optional (don't need an Overlay, or FabOptions, or Labels, or icons, etc). Every property can be accessed or set through XML layouts or programmatically - whatever you prefer.
Written 100% in Kotlin but comes with full JavaDoc and KDoc (published API is well documented). Also comes with an example app so you can see different use cases with 0 coding.
Github: https://github.com/nambicompany/expandable-fab
Library website (w/ links to full documentation): https://nambicompany.github.io/expandable-fab/
I want to do in my app a View that I can swipe from the bottom of the window (Images below explain it better).
I want the view to stop at certain point. The view must allow to swipe/drag it to the bottom again. Any idea or tip of how can I do that?
I think you are in search of a ViewDragHelper:
API doc:
https://developer.android.com/reference/android/support/v4/widget/ViewDragHelper.html
How to use. This answer links to a sample project to show you how as well:
ViewDragHelper: how to use it?
Dragging best practices:
http://developer.android.com/training/gestures/scale.html
You can use the new material design pattern called Bottom Sheets.
They do the exact thing that you want. They also support custom layouts for the view.
Material Design - Component - Bottom Sheets
I need to incorporate a youtube like drawer navigation drawer for both(left,right) sides. AFAIK android apis don't provide means for the right-to-left drawer functionality. There're quite a lot of implementations out there(sliding menu) which do.
This sliding menu feature seems to present a performance issue. Should I try to rewrite original NavigationDrawer, which I expect to be the least performance-impact solution, or there is another performance-optimal library?
Thanks.
I would choose NavigationDrawer. I used both and I find NavigationDrawer smoother. If you try to mimic google UX then with NavigationDrawer should be enought for your needs.
I recently made a project/demo to implement NavigationDrawer with ActionBarSherlock for pre Honeycomb devices because I need for an app.
SherlockNavigationDrawer impl
Another thing to take in mind is that if you use NavigationDrawer try to avoid Tabs because all the tabs items could fit perfectly as a listview in NavigationDrawer.
Actually NavigationDrawer supports drawers on both edges.
You have to supply the two drawer views inside your layout xml; one with gravity:left and one with gravity:right.
Then, in your Activity you call setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED) on your DrawerLayout object.
This will enable swiping either from left or right edge.
#MichaĆ The question is actually implementation of both left as well as the right drawer.
#midnight NavigationDrawer right now only implements one-sided menu which you can place either on the left or the right. If you want to implement the other pane also you can make your content layout as SlidingPaneLayout.
This was also added to the latest support library along with the NavgationDrawer. For an implemented example you can look at the newest Hangouts app on how they are using it. This layout will probably suit your purposes better rather than rewriting the NavigationDrawer. In any case i'd hold off on re-writing it since it is the first release of the Layout and may undergo changes fairly quickly.
Since the last version of SupportLibrary there is a NavigationDrawer in Android.
I don't think these examples use viewpager, but visually they look a little like viewpager.
See Evernote's settings:
http://1.androidauthority.com/wp-content/uploads/howto/evernote-screenshots-120524.jpg
And Pocket Casts' handheld control pane:
http://www.shiftyjelly.com/android/pocketcasts
Basically, a panel is swiped in from left, but the left edge of the previous panel is still visible.
So my question is, is this UI pattern featured in an example you have seen, or did these two make it out of whole cloth and now I have to, too?
Edit for posterity:
As of Google I/O 2013, this is now built into Android. They call it the Navigation Drawer: http://developer.android.com/training/implementing-navigation/nav-drawer.html
https://github.com/jfeinstein10/SlidingMenu
This library might help you out. I think this is what you're trying to achieve.
EDIT
I've updated the link to another SlidingMenu library but as of 2015/09/16, I wouldn't use the library referenced here anyway. Google has provided the DrawerLayout in the v4 support library to achieve this. Inside the drawer, for a more standard structured navigation, the design support library has also provided the NavigationView that can be placed inside the DrawerLayout and use standard menu resource to inflate the items contained within. This SO can help out with the details of the implementation.
I'm trying to replicate the following sliding navigation menu functionality (the one with "TOP STORIES", "World", "U.S" etc.) with no luck so far.
I'm feeling there is an obvious way to achieve this, as I'm constantly seeing this in many apps. Is it based on a library shipped with Android? Any starting point or materials used to achieve this are welcomed.
Keep in mind, I don't care about the design/xmls, just the implementation logic.
It is nothing but a HorizontalScrollView that contains child views.