Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I implement swiping between tabs on Android?

One of the key design recommendations in Android 4.0 for tabs is to allow swiping between them where appropriate. This behavior enables users to swipe horizontally across the selected tab's contents to navigate to adjacent tabs, without needed to directly interact with the tabs themselves.

How can this be implemented?

like image 632
Roman Nurik Avatar asked Apr 13 '12 01:04

Roman Nurik


People also ask

How is tabbing implemented in an android layout?

TabLayout is introduced in design support library to implement tabs. Tabs are created using newTab() method of TabLayout class. The title and icon of Tabs are set through setText(int) and setIcon(int) methods of TabListener interface respectively.

How to create swipe view with tabs in Android?

Create swipe views with tabs using ViewPager2 1 Implement Swipe Views. You can create swipe views using AndroidX's ViewPager2 widget. ... 2 Add Tabs Using a TabLayout. A TabLayout provides a way to display tabs horizontally. ... 3 Additional resources. To learn more about ViewPager2, see the following additional resources.

What is the use of swipe feature in mobile apps?

There are many apps which use this swipe feature to swipe through different activities in the app. For example, the popular chatting app, Snapchat, uses it to swipe through lenses, chats and stories.

How do I add tabs to help facilitate navigation between pages?

The following sections show how you can add tabs to help facilitate navigation between pages. A TabLayout provides a way to display tabs horizontally. When used together with a ViewPager2, a TabLayout can provide a familiar interface for navigating between pages in a swipe view. Figure 1: A TabLayout with four tabs.

How do I scroll through a list of tabs in tablayout?

Note: If you have a large or potentially infinite number of pages, set the android:tabMode attribute on your TabLayout to "scrollable". This prevents TabLayout from trying to fit all tabs on the screen at once and allows users to scroll through the list of tabs.


Video Answer


2 Answers

NOTE: This is an excerpt from the Android Training class Implementing Effective Navigation.


To implement this (in Android 3.0 or above), you can use a ViewPager in conjunction with the ActionBar tabs API.

Upon observing the current page changing, select the corresponding tab. You can set up this behavior using an ViewPager.OnPageChangeListener in your activity's onCreate() method:

@Override public void onCreate(Bundle savedInstanceState) {     ...     mViewPager.setOnPageChangeListener(             new ViewPager.SimpleOnPageChangeListener() {                 @Override                 public void onPageSelected(int position) {                     // When swiping between pages, select the                     // corresponding tab.                     getActionBar().setSelectedNavigationItem(position);                 }             });     ... } 

And upon selecting a tab, switch to the corresponding page in the ViewPager. To do this, add an ActionBar.TabListener to your tab when creating it using the newTab() method:

actionBar.newTab()         ...         .setTabListener(new ActionBar.TabListener() {             public void onTabSelected(ActionBar.Tab tab,                     FragmentTransaction ft) {                 // When the tab is selected, switch to the                 // corresponding page in the ViewPager.                 mViewPager.setCurrentItem(tab.getPosition());             }             ...         })); 
like image 182
Roman Nurik Avatar answered Oct 04 '22 12:10

Roman Nurik


If you are targeting APIs below Android 3.0, you cannot use Roman's solution above.

I wrote a blog post here about how to accomplish the same thing with ActionBarSherlock if anyone is interested.

like image 45
JesperB Avatar answered Oct 04 '22 10:10

JesperB