【Android 基础】ViewPager&TabLayout使用简例

前言：

应用viewpager的时候，一般会使用TabPageIndicator来与其配合，达到很漂亮的效果。但是TabPageIndicator是第三方的，而且比较老了，当然了现在很多大神都已经开始自己写TabPageIndicator来满足自己的需求，在2015年的google大会上，google发布了新的Android Support Design库，里面包含了几个新的控件，其中就有一个TabLayout，它就可以完成TabPageIndicator的效果，而且还是官方的，最好的是它可以兼容到2.2以上版本，包括2.2。

现在一般都是 android studio进行开发的，所以引用TabLayout很简单，只要在build.gradle中加入

compile ‘com.android.support:design:23.3.0’即可。

demo演示：

直接上代码：

直接看代码应该更好理解,说多反而乱。

布局文件：

<?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"
>
<include layout="@layout/titlebar"/>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/holo_red_dark"
app:tabIndicatorColor="@android:color/background_dark"
app:tabSelectedTextColor="@android:color/background_dark"
app:tabTextColor="@android:color/white" />

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

</LinearLayout>

MyFragment.java

public class MyFragment extends Fragment {

/**
* 标题
*/
private final String title;
/**
* 内容
*/
private final String content;
Context mContext;
TextView textView;

/**
* 得到内容
* @return
*/
public String getContent() {
return content;
}

/**
* 得到标题
* @return
*/
public String getTitle() {
return title;
}

public MyFragment(String title, String content){
super();
this.title = title;
this.content = content;
}

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//上下文
mContext = getActivity();
}

/**
* 创建视图
* @param inflater
* @param container
* @param savedInstanceState
* @return
*/
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
//创建视图
textView = new TextView(mContext);
textView.setTextColor(Color.RED);
textView.setTextSize(25);
textView.setGravity(Gravity.CENTER);
return textView;
}

/**
* 绑定数据
* @param savedInstanceState
*/
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
//设置内容
textView.setText(content);
}
}

ViewPagerAdapter.java

public class ViewPagerAdapter extends FragmentPagerAdapter {
private final ArrayList<MyFragment> fragments;

public ViewPagerAdapter(FragmentManager fm, ArrayList<MyFragment> fragments) {
super(fm);
this.fragments = fragments;
}

/**
* 根据位置返回对应的Fragment
* @param position
* @return
*/
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}

@Override
public int getCount() {
return fragments.size();
}

/**
* 得到页面的标题
* @param position
* @return
*/
@Override
public CharSequence getPageTitle(int position) {
return fragments.get(position).getTitle();
}
}

TabLayoutMainActivity .java

public class TabLayoutMainActivity extends AppCompatActivity {

ViewPager viewPager;
TextView tv_title;
TabLayout tabLayout;

ArrayList<MyFragment> fragments;

ViewPagerAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab_layout_main);
viewPager = (ViewPager) findViewById(R.id.viewPager);
tv_title = (TextView) findViewById(R.id.tv_title);

tabLayout = (TabLayout) findViewById(R.id.tabLayout);
tv_title.setText("TabLayout的使用");

//初始化数据
fragments = new ArrayList<>();
for (int i=0;i<12;i++){
fragments.add(new MyFragment("标题"+i,"内容"+i));
}
//设置ViewPager的适配器
adapter = new ViewPagerAdapter(getSupportFragmentManager(),fragments);
viewPager.setAdapter(adapter);
//关联ViewPager
tabLayout.setupWithViewPager(viewPager);
//设置固定的
//tabLayout.setTabMode(TabLayout.MODE_FIXED);
//设置滑动的。
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
}
}

以上权当学习案例归纳，方便以后回顾以及代码重用。