ViewPager+Fragment可以让我们快速搭建出一个新闻类app的框架，我们先来看一下效果
其实实现起来非常简单，我们先来看一下主页面的布局文件
ViewPager是v4包下的不用多说了，顶部的Tab导航条也是使用的v4包下的，其实我们很少用到，很多人根本也都不知道，谷歌原来还给我们提供了这样一个Tab导航条，其实效果还是挺不错的。
接下来看一下Fragment的代码
/**
* 用来实例化一个FirstFragment，并且传入一个标题和页码
*/
public static FirstFragment newInstance(String title , int page){
FirstFragment firstFragment = new FirstFragment();
Bundle args = new Bundle();
args.putInt("page", page);
args.putString("title", title);
firstFragment.setArguments(args);
return firstFragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//获得从MainActivity添加fragment时传入的标题和页码
mPage=getArguments().getInt("page");
mTitle=getArguments().getString("title");
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//通过反射得到fragment的布局
View view = inflater.inflate(R.layout.first_fragment, container, false);
TextView title = (TextView) view.findViewById(R.id.tv_first_title);
TextView page = (TextView) view.findViewById(R.id.tv_first_page);
//显示标题
title.setText(mTitle);
//显示页码
page.setText(String.valueOf(mPage));
return view;
}
}
fragment的布局文件
MainActivity.java
public class MainActivity extends FragmentActivity {
private ViewPager mViewPager;
private FragmentPagerAdapter mAdapter;
private static final String[] TITLES={"头条","娱乐","科技","财经","汽车"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//这句话是隐藏顶部的ActionBar，实现全屏效果
getWindow().requestFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
//拿到ViewPager
mViewPager=(ViewPager) findViewById(R.id.my_viewpager);
//实例化adapter
mAdapter=new MyPagerAdapter(getSupportFragmentManager());
//给ViewPager设置适配器，将内容显示到ViewPager中
mViewPager.setAdapter(mAdapter);
//这个方法是用来给ViewPager翻页的时候添加动画的
mViewPager.setPageTransformer(true, new ViewPager.PageTransformer() {
@Override
public void transformPage(View view, float position) {
//(-infinite,-1)，此时view已经完全移除屏幕的左方
if (position<-1) {
//将view设置成完全透明
view.setAlpha(0);
//[-1,0],此时view的一部分已经移出屏幕左边，但是没有整个移出，随着view
//向左边移动，position会逐渐从0-->-1变化。这时我们就可以利用这个不断变化的position
}else if (position<=0) {
//此时position是从0到-1不断减小的，Math.abs(position)是取position的绝对值
//是从0到1不断增大的，所以我们用1减去position的绝对值，得到的数值是一个从1到0不断
//减小的值，setAlpah(0)是完全透明，setAlpha(1)是完全不透明，所以这句代码就实现
//了view随着向屏幕左方移动的同时，渐渐淡出的效果。而当view从屏幕左边慢慢移回屏幕
//的中央时，正好是反过来的，所以实现了渐渐淡入的效果
view.setAlpha(1-Math.abs(position));
//(0,1],此时view的一部分已经移出屏幕右边，但是没有整个移出，随着view向右边移动，
//position会逐渐从0-->1变化
}else if (position<=1) {
//由于position是从0到1逐渐变化的，所以1-position是从1到0逐渐变化的，所以随着
//view向屏幕右方慢慢移动的同时，表现出渐渐淡出的效果，相反，会表现出渐渐淡入的效果
view.setAlpha(1-position);
//(1,infinite),view已经完全移动出屏幕右方
}else{
//将view设置成完全透明
view.setAlpha(0);
}
}
});
}
/**
* ViewPager的适配器，这里使用了static修饰符，我们在开发中，如果一个内部类没有使用到外部类的
* 成员变量时，我们就将其用static修饰一下，因为这样就会使内部类放弃外部类的一个强引用，否则将会
* 有内存泄露的危险。
*/
public static class MyPagerAdapter extends FragmentPagerAdapter{
//一共有5页
private static final int MAX_ITEM=5;
//构造方法，一定要实现的，这里要注意一下，如果要是使用v4包下的fragment，那么这里导包
//也要导v4下的包，否则会出现错误，通常新手会手足无措
public MyPagerAdapter(FragmentManager fm) {
super(fm);
// TODO Auto-generated constructor stub
}
/**
* 根据ViewPager当前的下标，实例化fragment。由于我们演示的fragment都是相同的结构，
* 为了方便这里我们只创建了一种fragment，通常我们每一个页面所需要显示的布局都是不一样的
* 那么就需要创建几个不一样的fragment，道理一样，这里我就不赘述了
*/
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return FirstFragment.newInstance("头条",1);
case 1:
return FirstFragment.newInstance("娱乐",2);
case 2:
return FirstFragment.newInstance("科技",3);
case 3:
return FirstFragment.newInstance("财经",4);
case 4:
return FirstFragment.newInstance("汽车",5);
}
return null;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return MAX_ITEM;
}
//根据ViewPager当前下标，给Tab导航条赋值
@Override
public CharSequence getPageTitle(int position) {
return TITLES[position];
}
}
}
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
