引入库
解决support-v4冲突(让两个版本一致)
从例子程序中拷贝布局文件
从例子程序中拷贝相关代码(指示器和viewpager绑定; 重写getPageTitle返回标题)
在清单文件中增加样式
背景修改为白色
修改样式-背景样式&文字样式
主要核心代码:
布局文件
<?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="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<com.viewpagerindicator.TabPageIndicator
android:id="@+id/indicator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageButton
android:id="@+id/btn_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:background="@null"
android:src="@drawable/news_cate_arr" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="@+id/vp_news_menu_detail"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
Java代码
1、先注入:
@ViewInject(R.id.indicator)
private TabPageIndicator mIndicator;
2、绑定
mViewPager.setAdapter(new NewsMenuDetailAdapter());
mIndicator.setViewPager(mViewPager);// 将viewpager和指示器绑定在一起.注意:必须在viewpager设置完数据之后再绑定
class NewsMenuDetailAdapter extends PagerAdapter {
// 指定指示器的标题
@Override
public CharSequence getPageTitle(int position) {
NewsTabData data = mTabData.get(position);
return data.title;
}
@Override
public int getCount() {
return mPagers.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
TabDetailPager pager = mPagers.get(position);
View view = pager.mRootView;
container.addView(view);
pager.initData();
return view;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
实现效果: