欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android ViewPager实现无限循环轮播广告位Banner效果

程序员文章站 2022-07-02 12:00:32
现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络。这个广告位banner是典型的android...

现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络。这个广告位banner是典型的android viewpager实现,但是如果自己实现这样的viewpager,要解决一系列琐碎的问题,比如:

(1)这个广告位viewpager要支持无限循环轮播,例如,有3张图片,a,b,c,当用户滑到最后c时候再滑就要滑到a,反之亦然。
(2)viewpager要实现自动播放,比如每个若干秒如2秒,自动切换播放到下一张图片。
(3)通常这样的viewpager下面会放一排指示器小圆圈,用以形象指示当前页码。

这样的android广告位复用程度很高,通用长度也很高。github上有一个开源项目:
实现了上述的全部功能,并提供多种样式选择。使用也简单,比如写一个简单的例子,xml代码(片段):

<com.youth.banner.banner
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:id="@+id/banner"
      android:layout_width="match_parent"
      android:layout_height="140dp"
      app:image_scale_type="center_crop"
      app:default_image="@drawable/home"
      app:indicator_drawable_selected="@drawable/selected_radius"
      app:indicator_drawable_unselected="@drawable/unselected_radius"
      app:indicator_height="8dp"
      app:indicator_width="8dp"
      app:indicator_margin="6dp"/>

引用的selected_radius.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/color_e91e63" />
</shape>

unselected_radius.xml:

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

颜色值#80ffffff是白色半透明。

上层java代码:

 banner banner= (banner) view.findviewbyid(r.id.banner);
  string url1="http://xxx.xxx.xxx.jpg";
  string url2="http://xxx.xxx.xxx.jpg";
  string url3="http://xxx.xxx.xxx.jpg";
  string[] images= new string[] {url1,url2,url3};

  banner.setbannerstyle(bannerconfig.circle_indicator);
  banner.setimages(images);
  banner.setdelaytime(2000);

代码运行结果:

Android ViewPager实现无限循环轮播广告位Banner效果

附: 《android实现viewpager无限循环滚动回绕》

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。