android 使用viewpager实现广告轮播效果

来源：互联网发布：linux下 vim安装编辑：程序博客网时间：2024/05/17 01:21

一.简介

广告轮播我们在很多应用软件上都可以看到，其实现原理也都大致相同。今天就分享一下自己写的一个广告轮播的demo，以后也方便自己看。

二.实现

1.布局部分代码：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent">    <android.support.v4.view.ViewPager        android:id="@+id/view_pager"        android:layout_width="match_parent"        android:layout_height="200dp">    </android.support.v4.view.ViewPager>    <LinearLayout        android:id="@+id/dot_container"        android:layout_width="match_parent"        android:layout_height="30dp"        android:layout_alignBottom="@+id/view_pager"        android:orientation="horizontal"        android:background="@color/banner_bg_color"        android:gravity="center">    </LinearLayout></RelativeLayout>

2.自定义PagerAdapter

public class BannerAdapter extends PagerAdapter{    private List<ImageView>mList;    public BannerAdapter(List<ImageView>list) {        mList = list;    }    @Override    public int getCount() {        return mList.size();    }    @Override    public boolean isViewFromObject(View view, Object object) {        return view == object;    }    @Override    public Object instantiateItem(ViewGroup container, int position) {        ImageView image = mList.get(position);        container.addView(image);        return image;    }    @Override    public void destroyItem(ViewGroup container, int position, Object object) {       container.removeView(mList.get(position));    }}

3.activity代码实现部分

public class MainActivity extends AppCompatActivity {    private static final String TAG = "MainActivity";    private ViewPager mViewPager;    //线性布局用于存放圆点    private LinearLayout mDotContainer;    //viewpager容器内图片资源，这里就用了五个color，有图片可以直接掉图片id，网络加载的就要把加载的图片放到数组里然后再设置给ImageView    int[] colors = {R.color.color1, R.color.color2, R.color.color3, R.color.color4, R.color.color5};    //viewpager容器里放得ImageView列表    private List<ImageView> mList;    //记录下上一页的position    private int mPreviousPosition;    //子线程给handler发送的消息    private final int CHAGE_PAGE = 1;    //控制线程内部是否执行    private boolean play = false;    //执行定时任务    ScheduledExecutorService executor = Executors.newScheduledThreadPool(1);    //处理子线程发送过来的消息    private Handler handler = new Handler(){        @Override        public void handleMessage(Message msg) {            super.handleMessage(msg);            switch (msg.what){                case CHAGE_PAGE:                    int position = (mPreviousPosition + 1) % mList.size();                    Log.e(TAG, "handleMessage: " + position);                    mViewPager.setCurrentItem(position);                    break;            }        }    };    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initUi();        initListener();        initData();    }    //初始化UI    private void initUi() {        mViewPager = (ViewPager) findViewById(R.id.view_pager);        mDotContainer = (LinearLayout) findViewById(R.id.dot_container);    }    private void initData() {        initViewPagerData();        BannerAdapter adaper = new BannerAdapter(mList);        mViewPager.setAdapter(adaper);        play = true;        play();    }    //设置延时自动播放    private void play() {        Thread thread = new Thread(new Runnable() {            @Override            public void run() {                if(play){                    handler.sendEmptyMessage(CHAGE_PAGE);                }            }        });        executor.scheduleAtFixedRate(thread,3,3, TimeUnit.SECONDS);    }    //初始化Viewpager里的数据    private void initViewPagerData() {        mList = new ArrayList<>();        for (int i = 0; i < colors.length; i++) {            ImageView image = new ImageView(this);            image.setImageResource(colors[i]);            mList.add(image);            TextView textview = new TextView(this);            LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(15, 15);            if (i == 0) {                textview.setSelected(true);            } else {                lp.leftMargin = 10;            }            textview.setLayoutParams(lp);            textview.setBackgroundResource(R.drawable.banner_dot);            mDotContainer.addView(textview);        }    }    private void initListener() {        mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {                if(mPreviousPosition != position){                    mDotContainer.getChildAt(mPreviousPosition).setSelected(false);                    mDotContainer.getChildAt(position).setSelected(true);                    mPreviousPosition = position;                }            }            @Override            public void onPageSelected(int position) {            }            @Override            public void onPageScrollStateChanged(int state) {            }        });        mViewPager.setOnTouchListener(new View.OnTouchListener() {            @Override            public boolean onTouch(View v, MotionEvent event) {                switch (event.getAction()){                    case MotionEvent.ACTION_DOWN:                        play = false;                        break;                    case MotionEvent.ACTION_UP:                        play = true;                        break;                }                return false;            }        });    }    @Override    protected void onDestroy() {        super.onDestroy();        executor.shutdown();    }}

4.其中用到的color资源

<color name="banner_bg_color">#80dbd8d8</color><color name="color1">#ff0000</color><color name="color2">#00ff00</color><color name="color3">#0000ff</color><color name="color4">#ffff00</color><color name="color5">#00ffff</color><color name="dot_unselector">#999999</color><color name="dot_selector">#ff0000</color>

5.圆点banner_dot.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_selected="false">        <shape android:shape="oval">            <solid android:color="@color/dot_unselector"/>        </shape>    </item>    <item android:state_selected="true">        <shape android:shape="oval">            <solid android:color="@color/dot_selector"/>        </shape>    </item></selector>

好了所有实现的代码都在这里，希望大家都能看懂。看不懂的可以自己研究一下运行过程。

三.最后

写的demo大家可以去下载下来运行看看，地址：http://download.csdn.net/detail/jianlipp/9727919

1 0