自定义仿ViewParger无限循环滑动界面

实现的部分

1,实现无限循环
2,实现滑动条目时图片暂停播放
3,实现定时播放图片

GenyMotion测试

实现原理-1-handler.sendEmptyMessage();方法实现延时发送消息
对条目滑动进行监听,条目滑动结束后再次发送消息

private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what) {
                case MESSAGE:
                    vp_abs.setCurrentItem(vp_abs.getCurrentItem() + 1);
                    break;
            }
        }
    };

延时3秒发送消息

 handler.sendEmptyMessageDelayed(MESSAGE, 3000);

2,条目选中暂停播放

private class myOnPageChangeListener implements ViewPager.OnPageChangeListener {

        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }

        @Override
        public void onPageSelected(int position) {
        }

        @Override
        public void onPageScrollStateChanged(int state) {
            //滑动状态为空闲状态时修改UI
            switch (state) {
                case ViewPager.SCROLL_STATE_IDLE:
                    changeDot8Desc();
                    //当滑动监听到之后,为防止消息干扰,先清除一下消息
                    handler.removeCallbacksAndMessages(null);
                    if (handler != null) {
                        //发送延时消息
                        handler.sendEmptyMessageDelayed(MESSAGE, 3000);
                    }
                    break;
                case ViewPager.SCROLL_STATE_DRAGGING:
                    //当条目为选择状态不能发送消息
                    handler.removeCallbacksAndMessages(null);
                    break;
            }
        }
    }


select.xml文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/shape_dotwhite"></item>
    <item android:state_selected="false" android:drawable="@drawable/shape_dotblack"></item>
</selector>

shape.xml文件

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@color/dot_black"/>
</shape>

布局文件

<?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="150dp"
    tools:context="com.oblivion.myviewparger.MainActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/vp_ads"
        android:layout_width="match_parent"
        android:layout_height="150dp"></android.support.v4.view.ViewPager>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@color/trans_black"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv_desc"
            android:textColor="@color/desc_white"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/tv_desc" />

        <LinearLayout
            android:id="@+id/ll_desc"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_gravity="center_horizontal"></LinearLayout>
    </LinearLayout>

</RelativeLayout>

ViewParge重写的适配器

package com.oblivion.myviewparger;

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

/**
 * Created by oblivion on 2016/10/21.
 */

/**
 * 创建适配器类继承PargerAdapter
 */
class myPargerAdapter extends PagerAdapter {
    private int[] imageViewIds;

    public myPargerAdapter(int[] imageViewIds) {
        this.imageViewIds = imageViewIds;
    }

    //为了实现图片的死循环将返回的count值设定*10000,模拟实现死循环
    @Override
    public int getCount() {
        return imageViewIds.length * 10000;
    }

    //判断能否复用。固定写法
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }

    //在viewparger中设定条目,并返回条目
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        ImageView imageView = new ImageView(container.getContext());
        //由于getCount()方法中值是大于集合长度的,所以为防止指针越界,对position进行简单取模处理
        /**
         * 0 % 5 = 0;
         * 1 % 5 = 1;
         * .
         * .
         * .
         * 7 % 5 = 2;
         */
        position = position % imageViewIds.length;
        imageView.setBackgroundResource(imageViewIds[position]);
        container.addView(imageView);
        return imageView;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((ImageView) object);
        object = null;
    }
}

主方法

package com.oblivion.myviewparger;

import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
    private static final int MESSAGE = 0;
    private ViewPager vp_abs;
    private myPargerAdapter adapter;
    private int[] imageResIds = {
            R.mipmap.a,
            R.mipmap.b,
            R.mipmap.c,
            R.mipmap.d,
            R.mipmap.e,
    };

    private String[] descs = {
            "巩俐不低俗,我就不能低俗",
            "扑树又回来啦!再唱经典老歌引万人大合唱",
            "揭秘北京电影如何升级",
            "乐视网TV版大派送",
            "热血屌丝的反杀",
    };
    private LinearLayout ll_desc;
    private LinearLayout.LayoutParams layoutParams;
    private TextView tv_desc;
    private myOnPageChangeListener listener;
    private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what) {
                case MESSAGE:
                    vp_abs.setCurrentItem(vp_abs.getCurrentItem() + 1);
                    break;
            }
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        listener = new myOnPageChangeListener();
        vp_abs.addOnPageChangeListener(listener);
        adapter = new myPargerAdapter(imageResIds);
        vp_abs.setAdapter(adapter);
        initdot();
        //将初始位置设定为适配器getCount()设定值的一半;
        vp_abs.setCurrentItem(adapter.getCount() / 2);
        int position = (adapter.getCount() / 2) % descs.length;
        tv_desc.setText(descs[position]);
        ll_desc.getChildAt(position).setSelected(true);
        //延时发送3秒发送消息
        handler.sendEmptyMessageDelayed(MESSAGE, 3000);
    }

    /**
     * 初始化控件ID
     */
    private void initView() {
        ll_desc = (LinearLayout) findViewById(R.id.ll_desc);
        tv_desc = (TextView) findViewById(R.id.tv_desc);
        vp_abs = (ViewPager) findViewById(R.id.vp_ads);
    }

    private void changeDot8Desc() {
        //获取ll_desc ViewGroup 中的子控件个数,遍历并将当前ViewParger的条目所在的点设置为选中的
        for (int i = 0; i < imageResIds.length; i++) {
            //设置当前文本为所选条目的文本信息
            tv_desc.setText(descs[vp_abs.getCurrentItem() % 5]);
            if (i == (vp_abs.getCurrentItem() % 5)) {
                //将所选的点点亮
                ll_desc.getChildAt(i).setSelected(true);
            } else {
                //其他点设定为灭
                ll_desc.getChildAt(i).setSelected(false);
            }
        }
    }

    /**
     * 创建ViewParger的滑动监听
     */
    private class myOnPageChangeListener implements ViewPager.OnPageChangeListener {

        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }

        @Override
        public void onPageSelected(int position) {
        }

        @Override
        public void onPageScrollStateChanged(int state) {
            //滑动状态为空闲状态时修改UI
            switch (state) {
                case ViewPager.SCROLL_STATE_IDLE:
                    changeDot8Desc();
                    //当滑动监听到之后,为防止消息干扰,先清除一下消息
                    handler.removeCallbacksAndMessages(null);
                    if (handler != null) {
                        //发送延时消息
                        handler.sendEmptyMessageDelayed(MESSAGE, 3000);
                    }
                    break;
                case ViewPager.SCROLL_STATE_DRAGGING:
                    //当条目为选择状态不能发送消息
                    handler.removeCallbacksAndMessages(null);
                    break;
            }
        }
    }

    /**
     * 根据图片的int[] 集合的长度获取要创建的点
     */
    private void initdot() {
        for (int i = 0; i < imageResIds.length; i++) {
            //获取px,并且将点属性设定好
            int _npx = dp2px(5);
            layoutParams = new LinearLayout.LayoutParams(_npx, _npx);
            layoutParams.leftMargin = _npx;
            View dot = new View(this);
            dot.setBackgroundResource(R.drawable.selector_dot);
            dot.setLayoutParams(layoutParams);
            //将点添加到布局文件中
            ll_desc.addView(dot);
        }
    }

    /**
     * 将要设定的dp值转化为px
     *
     * @param dp 传入的dp值
     * @return px
     */
    public int dp2px(int dp) {
        float density = getApplicationContext().getResources().getDisplayMetrics().density;
        //0.5f是为了对获取的float值进行四舍五入
        return (int) (dp * density + 0.5f);
    }

    @Override
    protected void onDestroy() {
        //为防止Activity穿透,在销毁之前清除消息
        super.onDestroy();
        handler.removeCallbacksAndMessages(null);
    }
}

Github源码地址

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值