天天看点
返回

Android ViewPager+Handler实现无限轮播和监听处理事件时轮播速度越来越快的问题解决

大家都知道android的无限轮播实现的方法有很多，我们先来看看ViewPager+Handler吧：

一.ViewPager+Handler实现无限轮播    点击下载源码

package com.demo.sb.main;

import java.util.ArrayList;
import com.demo.sb.utils.DensityUtil;
import com.demo.suibian.R;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;

public class MActivity_Luenbo extends Activity {

    private ViewPager viewPager;
    private LinearLayout group;
    private int[] images = { R.drawable.a, R.drawable.c, R.drawable.d,
            R.drawable.guide_1, R.drawable.guide_2 };
    private ArrayList<ImageView> mImageViewList;
    private ImageView[] diandian;// ViewPager上的点点
    private int selectedItem = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.mactivity_luenbo);
        viewPager = (ViewPager) findViewById(R.id.vp_viewPager);
        group = (LinearLayout) findViewById(R.id.ll_viewGroup);
        init();

    }

    @SuppressLint("HandlerLeak")
    private Handler mHandler = new Handler() {
        public void handleMessage(android.os.Message msg) {
            viewPager.setCurrentItem(selectedItem + 1);
            mHandler.sendEmptyMessageDelayed(0, 3000);
        };
    };

    private void init() {
        // TODO Auto-generated method stub
        // 引导3个ViewPager
        mImageViewList = new ArrayList<ImageView>();
        for (int i = 0; i < images.length; i++) {
            ImageView imageView = new ImageView(this);
            imageView.setBackgroundResource(images[i]);
            mImageViewList.add(imageView);
        }

        // 将点点加入到ViewGroup中
        diandian = new ImageView[images.length];
        for (int i = 0; i < images.length; i++) {
            // 循环加入点点图片组
            diandian[i] = new ImageView(this);
            if (i == 0) {
                diandian[i].setImageResource(R.drawable.page_indicator_focused);
            } else {
                diandian[i]
                        .setImageResource(R.drawable.page_indicator_unfocused);
            }
            diandian[i].setPadding(8, 8, 8, 8);
            group.addView(diandian[i]);
        }
        viewPager.setAdapter(new GuideAdapter());
        // 设置监听，主要是设置点点的背景
        viewPager.setOnPageChangeListener(new GuidePagerListener());
        // 设置ViewPager的默认项，设置为长度的1000倍，这样开始就能向左滑动了
        viewPager.setCurrentItem((images.length) * 1000);
    }

    /**
     * 每次当onResume有焦点时发送个空消息开始轮播
     */
    @Override
    protected void onResume() {
        // TODO Auto-generated method stub
        super.onResume();
        mHandler.sendEmptyMessageDelayed(0, 2000);
    }

    /**
     * 当暂停时停止轮播
     */
    @Override
    protected void onPause() {
        // TODO Auto-generated method stub
        super.onPause();
        mHandler.removeCallbacksAndMessages(null);
    }

    /**
     * ViewPager的适配器
     * 
     */
    private class GuideAdapter extends PagerAdapter {

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(View arg0, Object arg1) {
            // TODO Auto-generated method stub
            return arg0 == arg1;
        }

        // @Override
        // public void destroyItem(View container, int position, Object object)
        // {
        // // TODO Auto-generated method stub
        // ((ViewGroup) container).removeView(images[position
        // % images.length]);
        // }
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            // TODO Auto-generated method stub
            container.removeView((View) object);
        }

        /**
         * 加载图片进去，用当前的position除以图片数组长度取余数是关键
         */
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            // TODO Auto-generated method stub
            final int currentIten = position % images.length;
            ImageView iView = mImageViewList.get(currentIten);
            try {

                if (iView.getParent() == null) {
                    container.addView(iView);
                }
                iView.setOnClickListener(new OnClickListener() {

                    @Override
                    public void onClick(View arg0) {
                        // TODO Auto-generated method stub
                        DensityUtil.showToast(MActivity_Luenbo.this,
                                currentIten + "");
                    }
                });
                iView.setOnTouchListener(new NewTouchListener());
            } catch (Exception e) {
                // TODO: handle exception
            }

            return iView;
        }

    }

    /**
     * ViewPager 的滑动监听
     * 
     * @author Administrator
     * 
     */
    private class GuidePagerListener implements OnPageChangeListener {

        @Override
        public void onPageScrollStateChanged(int arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void onPageScrolled(int arg0, float arg1, int arg2) {
            // TODO Auto-generated method stub
            System.out.println(arg0 + "  dd " + arg1 + "  dddd  " + arg2);
        }

        @Override
        public void onPageSelected(int position) {
            // TODO Auto-generated method stub
            selectedItem = position;
            System.out.println("第几个页面" + position + "  " + position
                    % mImageViewList.size());
            for (int i = 0; i < diandian.length; i++) {
                if (i == position % images.length) {
                    diandian[i]
                            .setImageResource(R.drawable.page_indicator_focused);
                } else {
                    diandian[i]
                            .setImageResource(R.drawable.page_indicator_unfocused);
                }
            }
        }

    }

    /**
     * ViewPager的触摸事件当按下图片停止轮播
     * 
     * @author Administrator
     * 
     */
    private class NewTouchListener implements OnTouchListener {

        @Override
        public boolean onTouch(View arg0, MotionEvent arg1) {
            // TODO Auto-generated method stub
            switch (arg1.getAction()) {
            case MotionEvent.ACTION_DOWN:
                mHandler.removeCallbacksAndMessages(null);
                break;
            case MotionEvent.ACTION_CANCEL:
                mHandler.sendEmptyMessageDelayed(0, 3000);
                break;
            case MotionEvent.ACTION_UP:
                mHandler.sendEmptyMessageDelayed(0, 3000);
                break;
            default:
                break;
            }
            return true;
        }

    }

}

1 .在ViewPager的适配器中的getCount()长度设置无限大Integer.MAX_VALUE

2 . 明白当前currentIten 为position % images.length;

3 . 设置一开始ViewPager的位置 viewPager.setCurrentItem((images.length) * 1000);这样刚开始就可以向左滑动了

4 . 在OnPageChangeListener ViewPager的滑动监听中设置小点的位置

5 . 设置Handler 定时滑动开启滑动

6 . 在onResume中发送空消息，在onPause中移除消息将所有的Callbacks和Messages全部清除掉，避免内存泄露。

上面这种的无限轮播要注意一个问题，那就是轮播图在滑动的后会越来越快，这要注意下面的触摸监听了：

/**
     * ViewPager的触摸事件当按下图片停止轮播
     * 
     * @author Administrator
     * 
     */
    private class NewTouchListener implements OnTouchListener {

        @Override
        public boolean onTouch(View arg0, MotionEvent arg1) {
            // TODO Auto-generated method stub
            switch (arg1.getAction()) {
            case MotionEvent.ACTION_DOWN:
                mHandler.removeCallbacksAndMessages(null);
                break;
            case MotionEvent.ACTION_CANCEL:
                mHandler.sendEmptyMessageDelayed(0, 3000);
                break;
            case MotionEvent.ACTION_UP:
                mHandler.sendEmptyMessageDelayed(0, 3000);
                break;
            default:
                break;
            }
            return true;
        }

    }

在按下的时候加入下面的一行代码：

mHandler.removeCallbacksAndMessages(null);

二.UltraViewPager来实现，用UltraViewPager可以很简单的实现无限轮播      点击下载源码

1.布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.xieer.citybike.app.activity.guide.GuideActivity">

    <com.tmall.ultraviewpager.UltraViewPager
        android:id="@+id/ultra_viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/darker_gray" />

    <Button
        android:id="@+id/guide_start"
        android:layout_width="90dp"
        android:layout_height="40dp"
        android:background="#FCCCC7"
        android:textSize="12sp"
        android:textColor="#D0525D"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"
        android:text="开始"
        android:visibility="gone" />
</RelativeLayout>

2.代码:

import android.content.Intent;
import android.content.SharedPreferences;
import android.graphics.Color;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.TypedValue;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

import com.tmall.ultraviewpager.UltraViewPager;
import com.xieer.citybike.app.MainActivity;
import com.xieer.citybike.app.R;
import com.xieer.citybike.app.adapter.PageMyAdapter;
import com.xieer.citybike.app.utils.common.ToastUtils;

import java.util.ArrayList;

/**
 * 引导页面
 * 使用UltraViewPager 来实现的轮播效果
 * 
 */
public class GuideActivity extends AppCompatActivity {
    private SharedPreferences sPreferences;
    private ArrayList<ImageView> mdata;
    private static final int[] mImageIds = new int[]{R.drawable.guide_1,R.drawable.guide_2,R.drawable.guide_3};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_guide);
        mdata = new ArrayList<>();
        for(int i=0;i<mImageIds.length;i++){
            ImageView imageView = new ImageView(this);
            imageView.setBackgroundResource(mImageIds[i]);
            mdata.add(imageView);
        }
        sPreferences = getSharedPreferences("info",MODE_PRIVATE);
        final Button btn_start = (Button)findViewById(R.id.guide_start);
        UltraViewPager ultraViewPager = (UltraViewPager)findViewById(R.id.ultra_viewpager);
        ultraViewPager.setScrollMode(UltraViewPager.ScrollMode.HORIZONTAL);
        PagerAdapter adapter = new PageMyAdapter(this,mdata);
        ultraViewPager.setAdapter(adapter);
        //设置indicator样式
        ultraViewPager.initIndicator();
        ultraViewPager.getIndicator().setOrientation(UltraViewPager.Orientation.HORIZONTAL)
                .setFocusColor(Color.GREEN)
                .setNormalColor(Color.WHITE)
                .setMargin(0,0,0, ToastUtils.dp2px(this,10))
                .setRadius((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,ToastUtils.dp2px(this,4),this.getResources().getDisplayMetrics()));
        ultraViewPager.getIndicator().setGravity(Gravity.CENTER_HORIZONTAL | Gravity.BOTTOM);
        ultraViewPager.getIndicator().build();
        ultraViewPager.setInfiniteLoop(false);
        ultraViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener(){
            @Override
            public void onPageSelected(int position) {
                super.onPageSelected(position);
                if(position == mdata.size() - 1){
                   btn_start.setVisibility(View.VISIBLE);
                }else {
                    btn_start.setVisibility(View.GONE);
                }
            }
        });
        btn_start.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                sPreferences.edit().putBoolean("isLoad",false).commit();
                startActivity(new Intent(GuideActivity.this, MainActivity.class));
                finish();
            }
        });
    }
}

三. RollViewPager无限轮播点击，代码就不贴了，需要的可以私聊，直接发你    点击下载源码

ImageSwitcher与gallery图片浏览
上一篇: 安卓控件使用系列26：ImageSwitcher图片切换控件的使用方法
下一篇: Gallery和ImageSwitcher滑动切换照片简单demo实现

继续阅读