ViewPager+ImageView 图片滑动预览

来源：互联网发布：centos 系统版本编辑：程序博客网时间：2024/06/05 14:23

项目需求：

1、展示从网上url获取的图片

2、页面既可以左右滑动，也可以依靠向左向右的箭头按钮控制

难点：

1、如果在ViewpagerAdapter里面使用ImageLoader加载ImageView，因为网络请求耗时较长，会造成每张图片都卡顿

解决方案：

1）先将图片都下载下来

List<String> imageUrls = FragmentSetting.imageUrls;         len = imageUrls.size();        List<ImageView> lists = new ArrayList<>();        ImageViewFactory factory = new ImageViewFactory();        for (int i = 0;i<len;i++){            lists.add(factory.getImageView(context, imageUrls.get(i)));        }        ImagePager mypager = new ImagePager(context,lists);        imgPager.setAdapter(mypager);

其中：

public class ImageViewFactory {    public ImageView getImageView(Context context,String imgUrl){        ImageView imageView = (ImageView) LayoutInflater.from(context).inflate(                R.layout.imageview, null);        getImageRequest(context,imageView,imgUrl);        return imageView;    }    private void getImageRequest(Context context, final ImageView imageView, String imgUrl) {        ImageRequest imReq = new ImageRequest(imgUrl, new Response.Listener<Bitmap>() {            @Override            public void onResponse(Bitmap arg0) {                imageView.setImageBitmap(arg0);            }        }, 0, 0, Bitmap.Config.RGB_565, new Response.ErrorListener() {            @Override            public void onErrorResponse(VolleyError volleyError) {//                imageView.setImageResource(R.mipmap.default_pic);            }        }        );        RequestQueue queue = RequestManager.getRequestQueue();        queue.add(imReq);        queue.start();    }}

重写PagerAdapter

package com.chinaso.so.ui.control;import android.content.Context;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import com.android.volley.toolbox.ImageLoader;import com.chinaso.so.R;import java.util.List;/** * Created by chinaso on 2015/11/4. */public class ImagePager extends PagerAdapter {    private Context context;    private List<ImageView> strDrawables;    public  ImagePager(Context context, List<ImageView> strDrawables) {        this.context=context;        this.strDrawables=strDrawables;    }    @Override    public int getCount() {        return strDrawables.size();    }    @Override    public View instantiateItem(ViewGroup container, int position) {        ImageView imageView = strDrawables.get(position);        container.addView(imageView);        return imageView;    }    @Override    public void destroyItem(ViewGroup container, int position, Object object) {        container.removeView((View) object);    }    @Override    public boolean isViewFromObject(View view, Object object) {        return view == object;    }}

2、currentItem是有两个改变的原因，一个是button的click事件，一个是需要重写Viewpager的setOnPageChangeListener事件

（1）重写ChangeedListener

imgPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {                if (currentImg == 0) {                    //如果offsetPixels是0页面也被滑动了，代表在第一页还要往左划                    if (positionOffsetPixels == 0 && currentPageScrollStatus == 1) {                        CoverActivity.this.finish();                    }                } else if (currentImg == (len - 1)) {                    //已经在最后一页还想往右划                    if (positionOffsetPixels == 0 && currentPageScrollStatus == 2) {                        Toast.makeText(context, "没有下一张啦", Toast.LENGTH_SHORT).show();                    }                }            }            @Override            public void onPageSelected(int position) {                currentImg = position;            }            @Override            public void onPageScrollStateChanged(int state) {                //记录page滑动状态，如果滑动了state就是1                currentPageScrollStatus = state;            }        });

参数解释：onPageScrollStateChanged(int arg0) ，此方法是在状态改变的时候调用，其中arg0这个参数有三种状态（0，1，2）。arg0 ==1表示正在滑动，arg0==2表示滑动完毕了，arg0==0表示什么都没做。当页面开始滑动的时候，三种状态的变化顺序为（1，2，0）。
onPageScrolled(int arg0,float arg1,int arg2) ，当页面在滑动的时候会调用此方法，在滑动被停止之前，此方法回一直得到调用。其中三个参数的含义分别为：arg0 :当前页面，及你点击滑动的页面。arg1:当前页面偏移的百分比。arg2:当前页面偏移的像素位置。

onPageSelected(int arg0) ，此方法是页面跳转完后得到调用，arg0是你当前选中的页面的position。

（2）重写Click事件

  private class RotateOnClickListener implements View.OnClickListener {        @Override        public void onClick(View view) {            if (view != null){                int id = view.getId();                if (id == R.id.point_left){                    if (currentImg <= 0) {                        CoverActivity.this.finish();                    }                    imgPager.setCurrentItem(--currentImg);                }else if (id == R.id.point_right){                    if (currentImg >= (len-1)) {                        Toast.makeText(context,"没有下一张啦",Toast.LENGTH_SHORT).show();                    }else{                    imgPager.setCurrentItem(++currentImg);}                }            }        }    }

0 0