Android使用Gallery实现轮播图效果

这里写图片描述
使用Gallery来完成,好了,废话不多说,上代码。

public class GalleryView extends Gallery {
    public GalleryView(Context paramContext){
        super(paramContext);
    }

    public GalleryView(Context paramContext, AttributeSet paramAttributeSet){
        super(paramContext, paramAttributeSet);
    }

    public GalleryView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
        if (e1.getX() - e2.getX() < 0.0F){
            onKeyDown(KeyEvent.KEYCODE_DPAD_LEFT,null);
        }else{
            onKeyDown(KeyEvent.KEYCODE_DPAD_RIGHT,null);
        }
        return true;
    }

}

这是一个自定义的Gallery,主要重写了onFling方法,因为使用Gallery当你滑动的时候,它不会像viewpager那样自动滑到下一页,它会停在你滑动后手指离开的位置,就这很尴尬了。所以设置后,当你的滑动偏移量大于0的话,就自动滑到下一页。


public class MyGalleryView extends RelativeLayout {
    private static final int WHAT_AUTO_PLAY = 1000;

    private Context context;
    private LinearLayout mPointRealContainerLl;
    private LayoutParams mPointRealContainerLp;
    private TextView textView;
    private ColorDrawable mPointContainerBackgroundDrawable;
    //是否为网络图片
    private boolean isNetUrl = false;
    //是否可以自动播放
    private boolean mAutoPlayAble = true;
    //是否正在播放
    private boolean mIsAutoPlaying = false;
    // 是否只有一个数据
    private boolean mIsOneImg = false;
    private GalleryView mGallery;
    private List<String> mUrls; //网络图片集合
    private List<Integer> mImages; //本地图片集合
    //当前页面位置
    private int mCurrentPositon;
    //指示点资源
    private int mPointDrawableResId = R.drawable.selector_bgabanner_point;
    //自动播放时间
    private int mAutoPalyTime = 3000;

    private Handler mAutoPlayHandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            if (!mAutoPlayAble){
                mAutoPlayHandler.sendEmptyMessageDelayed(WHAT_AUTO_PLAY, mAutoPalyTime);
                return;
            }
            mCurrentPositon++;
            mGallery.setSelection(mCurrentPositon);
            mAutoPlayHandler.sendEmptyMessageDelayed(WHAT_AUTO_PLAY, mAutoPalyTime);
        }
    };
    private int mLength;

    public MyGalleryView(Context context) {
        this(context, null);
    }

    public MyGalleryView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyGalleryView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.context = context;
        init();
    }

    private void init() {
        DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();

        mPointContainerBackgroundDrawable = new ColorDrawable(Color.parseColor("#00aaaaaa"));

        mGallery = new GalleryView(context);
        // 设置每张图片的间距  通过手机屏幕的基准比例来设置
        mGallery.setSpacing((int)(-90*displayMetrics.density));
        mGallery.setOnTouchListener(onTouchListener);
        addView(mGallery, new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT));
        //设置指示器背景容器
        RelativeLayout pointContainerRl = new RelativeLayout(context);
        pointContainerRl.setId(R.id.banner_title);
        if (Build.VERSION.SDK_INT >= 16) {
            pointContainerRl.setBackground(mPointContainerBackgroundDrawable);
        } else {
            pointContainerRl.setBackgroundDrawable(mPointContainerBackgroundDrawable);
        }
        //设置内边距
        pointContainerRl.setPadding(0, 10, 0, 10);
        //设定指示器容器布局及位置
        LayoutParams pointContainerLp = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
        pointContainerLp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
        addView(pointContainerRl, pointContainerLp);
        //设置指示器容器
        mPointRealContainerLl = new LinearLayout(context);
        mPointRealContainerLl.setOrientation(LinearLayout.HORIZONTAL);
        mPointRealContainerLp = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        pointContainerRl.addView(mPointRealContainerLl, mPointRealContainerLp);

        textView = new TextView(getContext());
        textView.setText("");
        textView.setTextSize(16);
        textView.setTextColor(Color.WHITE);
        RelativeLayout.LayoutParams layoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
        textView.setGravity(Gravity.CENTER);
        layoutParams.bottomMargin = 5;
        layoutParams.addRule(RelativeLayout.ABOVE, R.id.banner_title);
        addView(textView, layoutParams);
        //设置指示器容器是否可见
        if (mPointRealContainerLl != null) {
            mPointRealContainerLl.setVisibility(View.VISIBLE);
        }
        //设置指示器布局位置
        mPointRealContainerLp.addRule(RelativeLayout.CENTER_HORIZONTAL);
    }

    OnTouchListener onTouchListener = new OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            int action = event.getAction();
            switch (action) {
                case MotionEvent.ACTION_DOWN:
                    mAutoPlayAble = false;
                    break;
                case MotionEvent.ACTION_MOVE:
                    break;
                case MotionEvent.ACTION_UP:
                    mAutoPlayAble = true;
                    break;
            }
            return false;
        }
    };

    public void setOnItemClickListener(AdapterView.OnItemClickListener onItemClickListener) {
        mGallery.setOnItemClickListener(onItemClickListener);
    }

    /**
     * 设置网络图片
     *
     * @param urls
     */
    public void setUrls(List<String> urls) {
        if (urls == null) {
            return;
        }
        mLength = urls.size();
        isNetUrl = true;
        this.mUrls = urls;
        if (urls.size() <= 1)
            mIsOneImg = true;
        initGallery();
    }

    /**
     * 设置本地图片
     *
     * @param images
     */
    public void setImages(List<Integer> images) {
        if (images == null || images.size() == 0) {
            return;
        }
        isNetUrl = false;
        mLength = images.size();
        this.mImages = images;
        if (images.size() <= 1)
            mIsOneImg = true;
        initGallery();
    }

    private void initGallery() {
        if (!mIsOneImg) {
            addPoints();
        }
        ImageAdapter adapter = new ImageAdapter();
        mGallery.setAdapter(adapter);
        mGallery.setOnItemSelectedListener(mOnItemSelectedListener);
        mGallery.setSelection(1);
        if (!mIsOneImg) {
            startAutoPlay();
        }
    }

    /**
     * 开始播放
     */
    public void startAutoPlay() {
        if (mAutoPlayAble && !mIsAutoPlaying) {
            mIsAutoPlaying = true;
            mAutoPlayHandler.sendEmptyMessageDelayed(WHAT_AUTO_PLAY, mAutoPalyTime);
        }
    }

    AdapterView.OnItemSelectedListener mOnItemSelectedListener = new AdapterView.OnItemSelectedListener() {

        @Override
        public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
            Log.e("Tag", "position =" + position + "");
            if (position == 0) {
                mGallery.setSelection(mLength - 2);
                mCurrentPositon = mLength - 2;
                return;
            } else if (position == mLength - 1) {
                mGallery.setSelection(1);
                mCurrentPositon = 1;
                return;
            }
            mCurrentPositon = position;
            // 指示器显示
            switchToPoint(position - 1);
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator imgScaleUpYAnim = ObjectAnimator.ofFloat(view, "scaleY", 0.6f, 0.8f);
            imgScaleUpYAnim.setDuration(100);
            //imgScaleUpYAnim.setInterpolator(DECCELERATE_INTERPOLATOR);
            ObjectAnimator imgScaleUpXAnim = ObjectAnimator.ofFloat(view, "scaleX", 0.6f, 0.8f);
            imgScaleUpXAnim.setDuration(100);
            animatorSet.playTogether(imgScaleUpYAnim, imgScaleUpXAnim);
            animatorSet.start();

            for (int i = 0; i < parent.getChildCount(); i++) {
                if (parent.getChildAt(i) != view) {
                    View s = parent.getChildAt(i);
                    ObjectAnimator imgScaleDownYAnim = ObjectAnimator.ofFloat(s, "scaleY", 0.8f, 0.6f);
                    imgScaleDownYAnim.setDuration(100);
                    //imgScaleUpYAnim.setInterpolator(DECCELERATE_INTERPOLATOR);
                    ObjectAnimator imgScaleDownXAnim = ObjectAnimator.ofFloat(s, "scaleX", 0.8f, 0.6f);
                    imgScaleDownXAnim.setDuration(100);
                    animatorSet.playTogether(imgScaleDownXAnim, imgScaleDownYAnim);
                    animatorSet.start();
                }
            }
        }

        @Override
        public void onNothingSelected(AdapterView<?> parent) {

        }
    };

    /**
     * 添加指示点
     */
    private void addPoints() {
        mPointRealContainerLl.removeAllViews();
        LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        lp.setMargins(10, 10, 10, 10);
        ImageView imageView;
        int length = isNetUrl ? mUrls.size() : mImages.size();
        for (int i = 0; i < length - 2; i++) {
            imageView = new ImageView(getContext());
            imageView.setLayoutParams(lp);
            imageView.setImageResource(mPointDrawableResId);
            mPointRealContainerLl.addView(imageView);
        }
    }

    /**
     * 切换指示器
     *
     * @param currentPoint
     */
    private void switchToPoint(final int currentPoint) {
        for (int i = 0; i < mPointRealContainerLl.getChildCount(); i++) {
            mPointRealContainerLl.getChildAt(i).setEnabled(false);
        }
        mPointRealContainerLl.getChildAt(currentPoint).setEnabled(true);

    }


    private class ImageAdapter extends BaseAdapter {

        @Override
        public int getCount() {
            return isNetUrl ? mUrls == null ? 0 : mUrls.size() : mImages == null ? 0 : mImages.size();
        }

        @Override
        public Object getItem(int position) {
            return position;
        }

        @Override
        public long getItemId(int position) {
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            if (convertView == null) {
                convertView = new ImageView(context);
                ((ImageView) convertView).setScaleType(ImageView.ScaleType.FIT_XY);
                convertView.setLayoutParams(new Gallery.LayoutParams(Gallery.LayoutParams.WRAP_CONTENT, Gallery.LayoutParams.WRAP_CONTENT));
                convertView.setScaleX(0.6f);
                convertView.setScaleY(0.6f);
            }
            if (isNetUrl)
                Glide.with(context).load(mUrls.get(position)).into((ImageView) convertView);
            else
                ((ImageView) convertView).setImageResource(mImages.get(position));
            return convertView;
        }
    }
}

这就是封装好了的GalleryView,通过每次切换给页面进行缩放。别的就是一些很简单的功能了,提供了设置本地图片和网络图片,同时还加上了自动播放切换的功能。再看下mainActivity的代码,很简单

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_my_view);
        MyGalleryView gallery = (MyGalleryView) findViewById(R.id.gallery);
        List<Integer> images = new ArrayList<>();
        images.add(R.mipmap.banner3);
        images.add(R.mipmap.banner1);
        images.add(R.mipmap.banner2);
        images.add(R.mipmap.banner3);
        images.add(R.mipmap.banner1);
        gallery.setImages(images);
        gallery.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Toast.makeText(MyViewActivity.this,""+position,Toast.LENGTH_SHORT).show();
            }
        });
    }

好了到这里,就完成了轮播图的实现。下面放demo地址
http://download.csdn.net/detail/baidu_33853807/9876409

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值