道客优

1234
使用ViewPager实现三个fragment切换
2019-03-09 刀刻油 阅读：986

首先看myfragmentPagerAdater这个类的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
package com.example.viewpager;
 
import java.util.List;
 
import android.support.v4.app.Fragment;   //注意打包是用support.v4的
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
<br>//继承
public class myFragmentPagerAdapter extends FragmentPagerAdapter {
     
    private FragmentManager fragmetnmanager;  //创建FragmentManager
    private List<Fragment> listfragment; //创建一个List<Fragment>
<br>　　　　　　//定义构造带两个参数
    public myFragmentPagerAdapter(FragmentManager fm,List<Fragment> list) {
        super(fm);
        this.fragmetnmanager=fm;
        this.listfragment=list;
    }
 
    @Override
    public Fragment getItem(int arg0) {
        // TODO Auto-generated method stub
        return listfragment.get(arg0); //返回第几个fragment
    }
 
    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return listfragment.size(); //总共有多少个fragment
    }
 
     
}

然后到MainActivity初始化ViewPager  （这里还没有图片偏移和链接点击事件的代码 后面讲到）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/*
 * 初始化Viewpager<br>　　　　　*
*/
viewpager=(ViewPager) findViewById(R.id.vp); //获取ViewPager
listfragment=new ArrayList<Fragment>(); //new一个List<Fragment>
Fragment f1 = new fragment01();
Fragment f2 = new fragment02();
Fragment f3 = new fragment03();<br>　　　　　//添加三个fragment到集合
listfragment.add(f1);
listfragment.add(f2);
listfragment.add(f3);
 
FragmentManager fm=getSupportFragmentManager();
myFragmentPagerAdapter mfpa=new myFragmentPagerAdapter(fm, listfragment); //new myFragmentPagerAdater记得带上两个参数
 
viewpager.setAdapter(mfpa);
viewpager.setCurrentItem(0); //设置当前页是第一页

　　现在到MainActivity中的三个链接的点击代码（这三个是TextView来着）之后就可以点击实现页面调转，但是图片偏移还没实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
/*
 * 初始化链接
 */
t1=(TextView) findViewById(R.id.textView1);
t2=(TextView) findViewById(R.id.textView2);
t3=(TextView) findViewById(R.id.textView3);
 
t1.setOnClickListener(new OnClickListener() {
     
    @Override
    public void onClick(View v) {
        viewpager.setCurrentItem(0);
         
    }
});
 
t2.setOnClickListener(new OnClickListener() {
     
    @Override
    public void onClick(View v) {
         
        viewpager.setCurrentItem(1);
    }
});
t3.setOnClickListener(new OnClickListener() {
     
    @Override
    public void onClick(View v) {
         
        viewpager.setCurrentItem(2);
    }
});

然后是图片偏移

1
2
3
private int index; //当前页卡;
private int imgleth; //图片宽度
private int offset; //偏移量

　　

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
  /*
   * 初始化图片
  */
  iv=(ImageView) findViewById(R.id.imageView1);
  //获取图片宽度
  imgleth=BitmapFactory.decodeResource(getResources(), R.drawable.a1).getWidth();
  //获取屏幕宽度
  DisplayMetrics dm=new DisplayMetrics();
  // 把屏幕尺寸信息赋值给DisplayMetrics dm，注意不是set
  getWindowManager().getDefaultDisplay().getMetrics(dm);
  // 屏幕宽度
  int count=dm.widthPixels;
  //计算偏移量
  offset=(count/3-imgleth)/2;
 
  
  //平移动画(第一页的)
Animation  an=new TranslateAnimation(0, offset, 0, 0);
  an.setFillAfter(true);
  an.setDuration(200);
  iv.setAnimation(an);

 最后是偏移图片跟着页面走 只需要在之前的 viewpager.setCurrentItem(0);后面添加即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
viewpager.setOnPageChangeListener(new OnPageChangeListener() {
     
    int one=offset*2+imgleth;//相邻页面的偏移量
    @Override
    public void onPageSelected(int arg0) {
         
        //评议动画
        Animation anima=new TranslateAnimation(index*one+offset,arg0*one+offset,0,0);
        index=arg0; //当前页跟着变
        anima.setFillAfter(true); // 动画终止时停留在最后一帧，不然会回到没有执行前的状态
        anima.setDuration(200);// 动画持续时间0.2秒
        iv.startAnimation(anima);// 是用ImageView来显示动画的
        Toast.makeText(MainActivity.this, "您选择了第"+(index+1)+"个页卡", 100).show(); 
    }
     
    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {
        // TODO Auto-generated method stub
         
    }
     
    @Override
    public void onPageScrollStateChanged(int arg0) {
        // TODO Auto-generated method stub
         
    }
});

　　

特别注意打包时候是打v4包（每个fragment也是打v4包）

1
2
3
4
5
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;

　　

TranslateAnimation参数说明： 

float fromXDelta:这个参数表示动画开始的点离当前View X坐标上的差值；

float toXDelta, 这个参数表示动画结束的点离当前View X坐标上的差值；

float fromYDelta, 这个参数表示动画开始的点离当前View Y坐标上的差值；

float toYDelta, 这个参数表示动画开始的点离当前View Y坐标上的差值；

这4个参数确定移动的起点和终点


推荐阅读：
使用ViewPager实现三个fragment切换