What are the names of the Tabs (Tabs) that are being used in the new apps?

Question

It is a tab that when you slide the contents of Tab to the side goes to the new tab. In the new Youtube update they implemented this and I wanted to know the name to implement in my app. Youtube tab link.

Update image:

Answer 1

This is called TabLayout, after Google released the Android 5.0 as ActionBar remained deprecated follows below example of how to implement withdrawn from here.

Tab Layout, need to add support android.support.design.widget.TabLayout and android.support.v4.view.ViewPager.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<android.support.design.widget.TabLayout
    android:id="@+id/sliding_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:tabMode="scrollable" />

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="0px"
    android:layout_weight="1"
    android:background="@android:color/white" />

Fragment, you may have one or more depending on your demand

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center" />

Fragment.java., logic for your Operation.

// In this case, the fragment displays simple text based on the page
 public class PageFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";

private int mPage;

public static PageFragment newInstance(int page) {
    Bundle args = new Bundle();
    args.putInt(ARG_PAGE, page);
    PageFragment fragment = new PageFragment();
    fragment.setArguments(args);
    return fragment;
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mPage = getArguments().getInt(ARG_PAGE);
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_page, container, false);
    TextView textView = (TextView) view;
    textView.setText("Fragment #" + mPage);
    return view;
}
 }

Fragmentadapter, here will be controlled your ViewPager.

public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 3;
private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" };
private Context context;

public SampleFragmentPagerAdapter(FragmentManager fm, Context context) {
    super(fm);
    this.context = context;
}

@Override
public int getCount() {
    return PAGE_COUNT;
}

@Override
public Fragment getItem(int position) {
    return PageFragment.newInstance(position + 1);
}

@Override
public CharSequence getPageTitle(int position) {
    // Generate title based on item position
    return tabTitles[position];
}
 }

Configuring the tabs slide, here will be done in two steps :

1- in the method OnCreate to ViewPager connects with the Adapter. 2- Define the ViewPager in the TabLayout to assign the pager with the guides.

public class MainActivity extends FragmentActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Get the ViewPager and set it's PagerAdapter so that it can display items
    ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
    viewPager.setAdapter(new SampleFragmentPagerAdapter(getSupportFragmentManager(), 
        MainActivity.this));

    // Give the TabLayout the ViewPager
    TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
    tabLayout.setupWithViewPager(viewPager);
}

 }

Exit:

Answer 2

In the principle of Material Design this component is called Tabs, just like that.

In the case of Youtube, there is a ViewPager with the tabs component, where each item in the ViewPager has a tab representative.

If you use the support libraries (support v4 and/or the appcompat v7) you can use the TabLayout of design library of google, which has several components and classes with specific behaviors of Material Design.

If you use Android Studio, just include it as a dependency:

compile 'com.android.support:design:22.2.1'

Recalling that version 22.2.1 fixes several bugs of version 22.2.0.

Using the component TabLayout is quite simple, the simplest is:

<android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:tabMode="fixed"
    app:tabGravity="fill" />

<android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Setting up in your Activity or Fragment:

TabLayout tabLayout = ...;
PagerAdapter adapter = ...;
ViewPager viewPager = ...;

tabLayout.setupWithViewPager(pager);
tabLayout.setTabsFromPagerAdapter(adapter);

A good source to know the other components of design library is http://android-developers.blogspot.com.br/2015/05/android-design-support-library.html