I am looking for a Tab navigation UI component that would work similarly to the SlidingPaneLayout, i.e. would show as many tabs as possible and make the tabs slidable left/right when the tabs wouldn't fit on the screen (in my case its tablets vs smartphones case). An example of it would be Slideable top navigation UI pattern.
Is there any library I could use to implement such component in my app?
Action bar tabs and ViewPager are the one's you are looking for. These are in built feature of Android, Easy to access and backward compatible to earlier versions as well.
ActionBar tabs is the one that will give you the tab like feature.
ViewPager on the other hand will provide the functionality of swipe.
Here is a step by step example on both.
Related
I am currently rewriting one of my iOS apps for Android, and I am working on adding tabbed navigation. The problem is, I haven't found a way to integrate tabs into an Android app without them being sliding (swipe left and right to switch tabs).
In the iOS version of my app, the middle of the three tabs contains a full-screen map view, so obviously in Android with the sliding tabs, the middle tab would not be slidable. I don't want this, as I would like to maintain consistency between the tabs.
Is there a way to deactivate the sliding on tabs? Or is there a way I could intercept the gesture in a similar way to the way a map would absorb it?
so obviously in Android with the sliding tabs, the middle tab would not be slidable
Actually, by default, it would be swipeable, though this would mean that the user cannot pan around the map. You have to take special steps to make a MapView get the touch events instead of the ViewPager, for reasons I have never fully understood.
I haven't found a way to integrate tabs into an Android app without them being sliding (swipe left and right to switch tabs)
Use FragmentTabHost. Or, use TabHost. Or, write your own tab implementation that toggles the visible view or fragment.
Note, though, that your users may expect to be able to swipe between tabs, if the tab content itself is not something that obviously would take precedence (e.g., the map). Users may prefer that your app be consistent with other Android apps, rather than be consistent with an app (your iOS app) that none of them use.
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'm looking through the ActionBarSherlock samples demo, and I see that the List Navigation and the Tab Navigation both make use of the ActionBar's setNavigationMode method. This tells me that you can only have one or the other. If I want the user to have list navigation to move around between activities but I want some activities to have tabs, is there a different way to add tabs than via navigation mode? Is it against ActionBar design guidelines to use both? I don't look at tabs and consider this to be a navigation feature, so I find it odd that you get one or the other.
This tells me that you can only have one or the other
Correct. Bear in mind that with action bar tabs, Android will convert you to list navigation, on its own, in certain configurations, whether you like it or not.
If I want the user to have list navigation to move around between activities but I want some activities to have tabs, is there a different way to add tabs than via navigation mode?
You can use a ViewPager with PagerTabStrip or the tab flavor of ViewPagerIndicator.
Or, you can go retro and use TabHost and TabWidget.
Is it against ActionBar design guidelines to use both?
The design guidelines refer to them as separate options for "View Controls". More importantly, given the automatic conversion of tab navigation to list navigation, it would be seriously confusing for the action bar to have two Spinners' worth of navigation choices.
How can I allow horizontal tab navigation (swipe views) if I'm using action bar navigation tabs?
Is there anything special I have to do to get this to work with ActionBarSherlock?
The code-generated stuff for a "Tabs+Swipe" activity (from BlankActivity in the new activity wizard in Eclipse) has code for this. Basically, your tabs tie into a ViewPager, calling setCurrentItem() to change the page, rather than running their own FragmentTransaction or otherwise affecting the UI. The ViewPager handles the horizontal swiping, and you populate those pages using some form of PagerAdapter (one is code generated for you). See this very related question and answer for more.
Is there anything special I have to do to get this to work with ActionBarSherlock?
Other than standard stuff for using ActionBarSherlock, nothing out of the ordinary should be required. ViewPager is in the Android Support package, which ActionBarSherlock also needs, so you will have that already in your project.
Note, though, that action bar tabs only sometimes show up as tabs. In some screen sizes and orientations, they are automatically converted into a drop-down list (per "list navigation" with the action bar instead of "tab navigation"). If you want to use tabs all of the time, rather than using action bar tabs with ViewPager, use PagerTabStrip (from the Android Support package) or a suitable indicator from ViewPagerIndicator instead.
Is there a native way to swipe/fling between different ActionBar tabs (the Honeycomb/ICS native one) containing fragments (one per tab)?
I know of the Android Compatibility package, which is used by this solution provided by Google itself. But I don't want to add the whole library just to use one simple and very common usability pattern.
Even the brand new Android Design Guide advocated swiping between ActionBar tabs, but without mentioning a way to do it natively in Honeycomb or Ice Cream Sandwich.
Is there a native way to swipe/fling between different ActionBar tabs (the Honeycomb/ICS native one) containing fragments (one per tab)?
If by "tab" you mean "tab" (i.e., the thing the user taps on), then tabs will be swipe-able automatically by the OS when it lets you. If you have more tabs than there is room for in the action bar, either the user can swipe back and forth (normal-size screen in portrait), or the tabs will be converted into a Spinner-style drop-down list (normal-size screen in landscape, or both orientations on large/xlarge-size screens).
If by "tab" you mean "tab content" (i.e., the thing that takes up the bulk of the screen), then tabs are not swipeable unless you handle that yourself (e.g., ViewPager).