TabLayout+ViewPager的简单用法Demo

根据这篇博文写的Demo。

• MainActivity：

package cn.nuosi.andoroid.testxns01;

import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;


public class MainActivity extends AppCompatActivity {
    TabLayout mTabLayout;
    ViewPager mViewPager;
    private String[] array = {"邮箱", "全部", "购物车"};
    private int[] img = {
            R.drawable.email_selector,
            R.drawable.all_selector,
            R.drawable.cart_selector
    };

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

        mTabLayout = (TabLayout) findViewById(R.id.tablayout);
        mViewPager = (ViewPager) findViewById(R.id.viewpager);

        FragmentManager manager = getSupportFragmentManager();
        mViewPager.setAdapter(new FragmentStatePagerAdapter(manager) {
            @Override
            public Fragment getItem(int position) {
                String i = array[position];
                return Fragment_blank.getInstance(i);
            }

            @Override
            public int getCount() {
                return array.length;
            }
        });

        mTabLayout.setupWithViewPager(mViewPager);
        mTabLayout.setTabMode(TabLayout.MODE_FIXED);

        for (int i = 0; i < mTabLayout.getTabCount(); i++) {
            TabLayout.Tab tab = mTabLayout.getTabAt(i);
            tab.setCustomView(getTabView(i));
        }
    }

    private View getTabView(int i) {
        View view = LayoutInflater.from(this).inflate(R.layout.bottom_item, null);
        TextView tv = (TextView) view.findViewById(R.id.bottom_text_view);
        tv.setText(array[i]);
        ImageView iv = (ImageView) view.findViewById(R.id.bottom_image_view);
        iv.setImageResource(img[i]);
        return view;
    }
}

• Fragment:

package cn.nuosi.andoroid.testxns01;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

/**
 * Created by Elder on 2017/1/18.
 */

public class Fragment_blank extends Fragment {
    private TextView mTextView;
    private String i;
    public static Fragment_blank getInstance(String i) {
        Bundle args = new Bundle();
        args.putString("tv", i);
        Fragment_blank fragment = new Fragment_blank();
        fragment.setArguments(args);
        return fragment;
    }

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        i = getArguments().getString("tv", "null");
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_blank, container, false);
        mTextView = (TextView) view.findViewById(R.id.show_text_view);
        mTextView.setText(i);
        return view;
    }
}

• 布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="cn.nuosi.andoroid.testxns01.MainActivity">

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

    <android.support.design.widget.TabLayout
        android:id="@+id/tablayout"
        android:layout_width="match_parent"
        android:layout_height="35dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"/>

</RelativeLayout>

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

    <ImageView
        android:id="@+id/bottom_image_view"
        android:layout_width="match_parent"
        android:layout_height="15dp"
        android:src="@drawable/email_selector"/>

    <TextView
        android:id="@+id/bottom_text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="邮箱"
        android:textColor="@color/text_view"
        android:layout_below="@id/bottom_image_view"
        android:gravity="center"/>

</LinearLayout>