ViewPager相信大家都不陌生了，我连续好几篇博客都有介绍这个控件，之所以反复提到这个控件，是因为此控件简单易用，而且在开发过程中使用频率特别高，细心的开发者可能注意到我上一篇的博客中也有ViewPager跟导航栏标题联动的效果，但是ViewPager跟PagerTabStrip连用实现的效果并不是特别美观，今天分享的这个案例与上一篇大同小异，只不过今天的案例导航条是用的安卓Design包空的一个新控件实现的导航条，此控件使用起来特别简单，也给开发者提供了很多可以自定义的属性，整体实现起来还是比较美观大方的，下面我具体贴上代码跟大家一起使用下这个简单的案例。
跟之前一样，采用的还是Fragment填充页面，自定义PagerAdapter继承自FragmentPagerAdapter。
/** * Created by 谢栋 on 2017/1/31. */ public class MyFragmentPagerAdapter extends FragmentPagerAdapter{ private List<Fragment> fragmentList; private String titles[] = {"第1页","第2页","第3页",}; public MyFragmentPagerAdapter(FragmentManager fm ,List<Fragment> fragmentList) { super(fm); this.fragmentList = fragmentList; } /** * 返回ViewPager的当前页 * @param position * @return */ @Override public Fragment getItem(int position) { return fragmentList.get(position); } /** * 返回当成ViewPager的页卡数量 * @return */ @Override public int getCount() { return fragmentList.size(); } /** * 导航条上显示的标题栏字符串 * @param position * @return */ @Override public CharSequence getPageTitle(int position) { return titles[position]; } } 案例中有三个Fragment，都比较简单，我只贴上一个供大家参考 /** * Created by 谢栋 on 2017/1/31. */ public class ViewPagerFragment_1 extends Fragment { private View view; @Nullable @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view = inflater.inflate(R.layout.viewpager_1,null); return view; } }Fragment的布局代码
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="第1页" /> </LinearLayout> 最后是主界面的java代码，此类也比较简单，主要做一些配置信息 /** * Created by 谢栋 on 2017/2/2. */ public class ViewPagerTest_2 extends AppCompatActivity{ private ViewPager viewpager; private TabLayout tablayout; private List<Fragment> fragmentList = new ArrayList<>(); @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.viewpager_layout_2); initView(); viewpager.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(),fragmentList)); tablayout.setupWithViewPager(viewpager); //同步Tablayout与ViewPager,让其联动 } /** * 初始化布局 */ private void initView() { viewpager = (ViewPager) findViewById(R.id.viewpager); tablayout = (TabLayout) findViewById(R.id.tablayout); //添加Fragment fragmentList.add(new ViewPagerFragment_1()); fragmentList.add(new ViewPagerFragment_2()); fragmentList.add(new ViewPagerFragment_3()); } } 主界面的布局文件 <?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" xmlns:app="http://schemas.android.com/apk/res-auto" android:orientation="vertical"> <android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabBackground="@color/design_test_color" app:tabIndicatorColor="@android:color/holo_red_dark" app:tabMode="fixed" app:tabSelectedTextColor="@android:color/black" app:tabTextAppearance="@android:style/TextAppearance.DeviceDefault.Large" 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> 在TabLayout节点下可以根据需要设置相应属性，包括导航条的背景色，字体样式，大小等属性的调整
