viewPager实现图片左右滑动

原文地址为： viewPager实现图片左右滑动

一，viewPager

能够实现图片的左右滑动效果，并且滑动到最后一张后，再次滑动，又会跳到第一张

viewPager的适配器是PagerViewPager，它最少要实现以下四个方法：

1.该方法将返回所包含的item总个数。为了实现一种循环滚动的效果，返回了基本整形的最大值

 @Override

 public int getCount() {

  // TODO Auto-generated method stub

  return Integer.MAX_VALUE;

 }

2.判断出去的view是否等于进来的view，如果为true直接复用

 @Override

 public boolean isViewFromObject(View arg0, Object arg1) {

  // TODO Auto-generated method stub

  return arg0==arg1;

 }

3.销毁预加载以外的view对象，会把需要销毁的对象的索引位置传进来，就是position，y

 因为imageView只要6条数据，而position会取到很大的值，所以使用取余数的方法来获取每一条数据项

 @Override

 public void destroyItem(ViewGroup container, int position, Object object) {

  // TODO Auto-generated method stub

  container.removeView(list.get(position%list.size()));

 }

4.装入图片

 @Override

 public Object instantiateItem(ViewGroup container, final int position) {

  container.addView(list.get(position%list.size()),0); //装入图片

  return list.get(position%list.size());

 }

下面举个例子实现图片左右滑动，并且，在图片上加上了点点，滑动到哪一张图片的时候，哪一张图片上的点就会变白

1.布局文件代码如下；

    xmlns:tools=" http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

            android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="请选择图片"
        android:textColor="#ff0000"
        android:textSize="20sp" />

            android:layout_width="match_parent"
        android:layout_height="match_parent" >

                    android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

                    android:id="@+id/viewGroup"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="30dp"
            android:gravity="center_horizontal"
            android:orientation="horizontal" >
        
    

2.定义一个类继承适配器PagerAdapter

package com.example.viewpager.adapter;

import java.util.List;

import org.w3c.dom.ls.LSInput;

import android.R;

import android.content.Context;

import android.support.v4.view.PagerAdapter;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.ImageView;

public class MyAdapter extends PagerAdapter {

 private List list;

 private Context context;

 public MyAdapter (  List list, Context context) {

  super();

  this.list = list;

  this.context = context;

 }

 //该方法将返回所包含的item总个数。为了实现一种循环滚动的效果，返回了基本整形的最大值

 @Override

 public int getCount() {

  // TODO Auto-generated method stub

  return Integer.MAX_VALUE;

 }

//判断出去的view是否等于进来的view，如果为true直接复用

 @Override

 public boolean isViewFromObject(View arg0, Object arg1) {

  // TODO Auto-generated method stub

  return arg0==arg1;

 }

 

 //销毁预加载以外的view对象，会把需要销毁的对象的索引位置传进来，就是position，y

 //因为imageView只要6条数据，而position会取到很大的值，所以使用取余数的方法来获取每一条数据项

 @Override

 public void destroyItem(ViewGroup container, int position, Object object) {

  // TODO Auto-generated method stub

  container.removeView(list.get(position%list.size()));

 }

 //装入图片

 @Override

 public Object instantiateItem(ViewGroup container, final int position) {

  // TODO Auto-generated method stub

  final ImageView imageView = list.get(position % list.size());

  container.addView(list.get(position%list.size()),0);

  return list.get(position%list.size());

 }

}

3.Activity中实现点点的效果，设置适配器

....省略n个包

public class MainActivity extends Activity {

 //装图片id的数组

 private int[]bitmaps = {R.drawable.b0,R.drawable.b1,R.drawable.b2,R.drawable.b3,

   R.drawable.b4,R.drawable.b5,R.drawable.b6,};

 private ViewPager viewpager;

 private List list;//装ImageView的集合

 private ImageView imageView;

 private ImageView[] tips;//装点点的集合

 private ViewGroup viewGroup ;

 @Override

 protected void onCreate(Bundle savedInstanceState) {

  super.onCreate(savedInstanceState);

  requestWindowFeature(Window.FEATURE_NO_TITLE);

  setContentView(R.layout.activity_main);

 

  viewpager = (ViewPager) findViewById(R.id.viewPager);

  viewGroup = (ViewGroup) findViewById(R.id.viewGroup);

  //将imageView图片资源存在集合中

  list = new ArrayList();

  for (int i = 0; i < bitmaps.length; i++) {

   imageView = new ImageView(MainActivity.this);

   imageView.setBackgroundResource(bitmaps[i]);

   //为imageView设置tag，将id传入，方便页面跳转时，发送图片的资源id

   imageView.setTag(bitmaps[i]);

   list.add(imageView);

  }

  //将点点装入到结集合中

  tips = new ImageView[bitmaps.length];

  for (int i = 0; i < bitmaps.length; i++) {

   imageView = new ImageView(MainActivity.this);

   imageView.setLayoutParams(new LayoutParams(10,10));

   tips[i]=imageView;

   if(i==0){

    tips[i].setBackgroundResource(R.drawable.page_indicator_focused);

   }else {

    tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);

   }

   viewGroup.addView(imageView);

  }

 

//设置适配器

  viewpager.setAdapter(new MyAdapter(list,this));

  viewpager.setOnPageChangeListener(new OnPageChangeListener() {

   public void onPageSelected(int arg0) {

    setImageBackground(arg0 % bitmaps.length);

   }

   public void onPageScrolled(int arg0, float arg1, int arg2) {

   }

   public void onPageScrollStateChanged(int arg0) {

   }

  });

  // 第一次初始化界面时，显示的界面

  // 设置ViewPager的默认项, 设置为长度的100倍，这样子开始就能往左滑动

  viewpager.setCurrentItem((bitmaps.length) * 100);

 }

 /**

  * 设置选中的tip的背景 ，选中哪个图片，哪个图片的点点就变成白的

  */

 private void setImageBackground(int selectItems) {

  for (int i = 0; i < tips.length; i++) {

   if (i == selectItems) {

    tips[i].setBackgroundResource(R.drawable.page_indicator_focused);

   } else {

    tips[i].setBackgroundResource(R.drawable.page_indicator_unfocused);

   }

  }

  }

 }

转载请注明本文地址： viewPager实现图片左右滑动