简单使用XML文件，使用ViewPagerAdapter适配器，来适配不同的page
具体实现方法：
- 设置相应的xml文件，几个page以及title和bottom
- 在MainActivity.xml中加入Title和bottom还有viewPager
- 在MainActivity中初始化相应的View，实现ViewPager需要实现的Adapter其中需要复写几个方法
destroyItem(), 移除指定位置的页面。该 Adapter 负责在 finishUpdate() 方法返回时从容器删除视图。
container.removeView(mViews.get(position));
instantiateItem(), 创建指定位置的页面，该 Adapter 负责将视图添加进当前的容器（container），并返回一个键（key），用来关联当前的页面视图 View.直接在mViews里面取出相应的View，并且在container里面添加进去
View view = mViews.get(position);container.addView(view);return view;```
getCount(), 返回可用视图的数量。
isViewFromObject(),判断instantiateItem(ViewGroup, int) 方法所返回来的 Key 与一个页面视图是否是代表的同一个视图(即它俩是否是对应的，对应的表示同一个View)。
```java
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}```
- 现在实现初始化View的方法
//初始化View，包括ViewPager和相应的几个控件
private void initView() {
mViewPager = (ViewPager) findViewById(R.id.view_pager);
mTabWinxin = (LinearLayout) findViewById(R.id.id_tab_weixin);
mTabWinAddres = (LinearLayout) findViewById(R.id.id_tab_contacts);
mTabWinFrd = (LinearLayout) findViewById(R.id.id_tab_friend);
mTabWinSetting = (LinearLayout) findViewById(R.id.id_tab_setting);
mWinxinImg = (ImageButton) findViewById(R.id.id_tab_weixin_img);
mAddresImg = (ImageButton) findViewById(R.id.id_tab_contacts_img);
mFrdImg = (ImageButton) findViewById(R.id.id_tab_friend_img);
mSettingImg = (ImageButton) findViewById(R.id.id_tab_setting_img);
LayoutInflater mInflater = LayoutInflater.from(this);
View tab01 = mInflater.inflate(R.layout.tab01, null);
View tab02 = mInflater.inflate(R.layout.tab02, null);
View tab03 = mInflater.inflate(R.layout.tab03, null);
View tab04 = mInflater.inflate(R.layout.tab04, null);
mViews.add(tab01);
mViews.add(tab02);
mViews.add(tab03);
mViews.add(tab04);
mAdapter = new PagerAdapter() {
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mViews.get(position));
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
View view = mViews.get(position);
container.addView(view);
return view;
}
@Override
public int getCount() {
return mViews.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
};
mViewPager.setAdapter(mAdapter);
}```
- 到现在，我们就实现了Viewpager的滑动，但是底部栏的变化和点击事件都没有写，下面对LinearLayout写入点击事件（如果LinearLayout里面有Button的点击冲突事件，那么要在Button里面写入Clickable为false，因为Layout首先处理有点击事件的控件）
private void initEvent() {
//处理每一个的LinearLayout的点击事件
mTabWinxin.setOnClickListener(this);
mTabWinAddres.setOnClickListener(this);
mTabWinFrd.setOnClickListener(this);
mTabWinSetting.setOnClickListener(this);
/**
* 在设置好每次点击Bottom的点击事件后，如果想要拖动ViewPager同时bottom也发生改变
* 那么就要重写PageChangeListener的PageSelected方法
* 让在PageChange页面改变的时候，改变Bottom的图片
*
* Notice 注意SetOnPageChangeListener已经遗弃，用AddOnPageChangeListener替换
*/
ViewPager.OnPageChangeListener listener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
int currentItem = mViewPager.getCurrentItem();
resetImg();
switch (currentItem) {
case 0:
mWinxinImg.setImageResource(R.drawable.tab_weixin_pressed);
break;
case 1:
mFrdImg.setImageResource(R.drawable.tab_find_frd_pressed);
break;
case 2:
mAddresImg.setImageResource(R.drawable.tab_address_pressed);
break;
case 3:
mSettingImg.setImageResource(R.drawable.tab_settings_pressed);
break;
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
mViewPager.addOnPageChangeListener(listener);
}
注意Activity实现OnClickListener方法，重写OnClick()方法，当每次监听到点击事件，都会实现resetImg()方法，即重置每一个ImageButton成灰色，然后监听到的那个按钮的点击，即将那个ImageButton换成亮色
@Override
public void onClick(View v) {
resetImg();
switch (v.getId()){
case R.id.id_tab_weixin:
mViewPager.setCurrentItem(0);
mWinxinImg.setImageResource(R.drawable.tab_weixin_pressed);
break;
case R.id.id_tab_contacts:
mViewPager.setCurrentItem(2);
mAddresImg.setImageResource(R.drawable.tab_address_pressed);
break;
case R.id.id_tab_friend:
mViewPager.setCurrentItem(1);
mFrdImg.setImageResource(R.drawable.tab_find_frd_pressed);
break;
case R.id.id_tab_setting:
mViewPager.setCurrentItem(3);
mSettingImg.setImageResource(R.drawable.tab_settings_pressed);
break;
}
}```
重置每一个Image，相应的resetImg()方法
```java
private void resetImg() {
mWinxinImg.setImageResource(R.drawable.tab_weixin_normal);
mFrdImg.setImageResource(R.drawable.tab_find_frd_normal);
mAddresImg.setImageResource(R.drawable.tab_address_normal);
mSettingImg.setImageResource(R.drawable.tab_settings_normal);
} ```
这样整个Viewpager配合适配器的滑动界面就完成了
未完待续（挖坑）：ViewPager配合Fragment实现滑动不同界面
-----更新-----
####终极使用ViewPager实现页面滑动
#####ViewPager结合Fragment
此方法为上述方法的升级版，在View的管理上，使用Fragment管理会更清晰，而且更利于后期代码的修缮
主要是这样几个步骤：
1. 初始化View，创建需要的Fragment和xml布局，加入ViewPager布局
```java
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</android.support.v4.view.ViewPager>
- 创建Fragment的List，并且初始化ViewPager和FragmentPagerAdapter
private List<Fragment> mFragments;
onCreate(...){
...
mFragments = new ArrayList<>();
Fragment mTab01 = new WeixinFragment();
Fragment mTab02 = new FrdFragment();
Fragment mTab03 = new AddressFragment();
Fragment mTab04 = new SettingFragment();
mFragments.add(mTab01);
mFragments.add(mTab02);
mFragments.add(mTab03);
mFragments.add(mTab04);
... }```
3. 设置ViewPager的监听事件，重写onPageSelected()方法
```java
mPagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
@Override
public Fragment getItem(int position) {
return mFragments.get(position);
}
@Override
public int getCount() {
return mFragments.size();
}
};
mViewPager.setAdapter(mPagerAdapter);
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
//用来监听ViewPager的改变，通常用来改变Tab的样式
int current = mViewPager.getCurrentItem();
setTab(current);
}
@Override
public void onPageScrollStateChanged(int state) {
}
});```
4. 设置Tab的点击事件(如果在点击或者滑动有特效，需要进一步去实现)这里只介绍，如何实现ViewPager和Fragment的组合效果
```java
public void setSelect(int select) {
mViewPager.setCurrentItem(select);
}```
5. 如果你想实现相应的通过ViewPager的监听，来改变Tab的样式，这里提供了代码参考,对应的是ViewPager的addOnPageChangeListener中onPageSelected()中用到的方法
```java
private void setTab(int select) {
resetImg();
switch (select){
case 0:
mTabWeixinImg.setImageResource(R.drawable.tab_weixin_pressed);
break;
case 1:
mTabFrdImg.setImageResource(R.drawable.tab_find_frd_pressed);
break;
case 2:
mTabAdressImg.setImageResource(R.drawable.tab_address_pressed);
break;
case 3:
mTabSettingImg.setImageResource(R.drawable.tab_settings_pressed);
break;
}
}```
以上总结参考自[慕课网](http://www.imooc.com/video/5904)中[hyman](http://www.imooc.com/u/320852/courses?sort=publish)的课程
后续会更新热门开源项目[FlycoTabLayout](https://github.com/H07000223/FlycoTabLayout)的使用教程（挖坑），这个相对于ViewPager来说更酷炫，更方便使用，本文的代码参考在我的GitHub上，欢迎留言提出意见，感谢您的阅读