文档章节

Android广告图片轮播控件

youth5201314
 youth5201314
发布于 2016/07/29 10:28
字数 748
阅读 127
收藏 1

Android图片轮播控件 (如果对你有帮助请star哦!)


传送门

https://github.com/youth5201314/banner

现在的绝大数app都有banner界面,实现循环播放多个广告图片和手动滑动循环等功能。因为ViewPager并不支持循环翻页, 所以要实现循环还得需要自己去动手,所以其他的轮播控件大多都是重写viewpager,而且代码很臃肿。 我就把项目中的控件剔了出来,希望大家觉得有用。

效果图

模式图片
指示器模式效果示例
数字模式效果示例
数字加标题模式效果示例
指示器加标题模式效果示例

##Gradle

dependencies{
    compile 'com.youth.banner:banner:1.1.6'  //指定版本
    compile 'com.youth.banner:banner:+' //最新版本
}

或者引用本地lib

compile project(':banner')

常量

方法名描述
BannerConfig.NOT_INDICATOR不显示指示器和标题
BannerConfig.CIRCLE_INDICATOR显示圆形指示器
BannerConfig.NUM_INDICATOR显示数字指示器
BannerConfig.NUM_INDICATOR_TITLE显示数字指示器和标题
BannerConfig.CIRCLE_INDICATOR_TITLE显示圆形指示器和标题
BannerConfig.LEFT指示器居左
BannerConfig.CENTER指示器居中
BannerConfig.RIGHT指示器居右

##方法 |方法名|描述 |---|---| |setBannerStyle(int bannerStyle)| 设置轮播样式(默认为Banner.NOT_INDICATOR) |setIndicatorGravity(int type)| 设置指示器位置(没有标题默认为右边,有标题时默认左边) |isAutoPlay(boolean isAutoPlay)| 设置是否自动轮播(默认自动) |setBannerTitle(String[] titles)| 设置轮播要显示的标题和图片对应(如果不传默认不显示标题) |setDelayTime(int time)| 设置轮播图片间隔时间(默认为2000) |setImages(Object[]/List<?> imagesUrl)| 设置轮播图片(所有设置参数方法都放在此方法之前执行) |setImages(Object[]/List<?> imagesUrl,OnLoadImageListener listener)| 设置轮播图片,并且自定义图片加载方式 |setOnBannerClickListener(this)|设置点击事件,下标是从1开始 |setOnBannerImageListener(this)|设置图片加载事件,可以自定义图片加载方式

##使用步骤 * 更多用法请下载demo

1.在布局文件中添加Banner,可以设置自定义属性

  • 简单使用
<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="高度自己设置" />
  • 深度自定义,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="高度自己设置"
    app:default_image="默认加载图片"
    app:delay_time="轮播间隔时间"
    app:is_auto_play="是否自动轮播"
    app:indicator_margin="指示器之间的间距"
    app:indicator_drawable_selected="指示器选中效果"
    app:indicator_drawable_unselected="指示器未选中效果"
    app:indicator_height="指示器圆形按钮的高度"
    app:indicator_width="指示器圆形按钮的宽度" />

2.在Activity或者Fragment中配置Banner

private Banner banner;
String[] images= new String[] {"url"};
String[] titles=new String[]{"标题"};
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    banner = (Banner) findViewById(R.id.banner);
    //一步搞定,设置图片就行了
    banner.setImages(images);
 
}

© 著作权归作者所有

共有 人打赏支持
youth5201314
粉丝 0
博文 1
码字总数 748
作品 0
成都
技术主管
私信 提问
Android 轮播图Banner切换图片的效果

Android XBanner使用详解 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://www.cnblogs.com/huangzedong/p/9961371.html 前言:现如今的很多APP都介入了广告,不过,大多数都是以...

雨雪陌生
11/15
0
0
Android中广告轮播框架Banner----(功能很全面

转载地址:https://github.com/youth5201314/banner 参考视频:http://ke.atguigu.com/course/150 Android图片轮播控件 新框架发布,欢迎大家Star XFrame - Android快速开发框架 XFrame详细功...

丁佳辉
08/02
0
0
自定义广告图片轮播View——CarouselView

  因为一个广告机的需求,需要做一个广告轮播的效果,不需要什么特别的动画,正常的轮播就可以了。笔者看了网上很多文章,要么不好用,要么就是效果太多,太复杂,用不上。索性自己写了一个...

饮水思源为名
08/08
0
0
自定义控件和试图(原生api)viewPager图片轮播广告

使用android提供的api来做出去自己想要的控件显示效果。基于原生api是最低级的自定义控件和试图 android的v4包自带的控件 android.support.v4.view.ViewPager 几个滚动原点是放在LinearLayou...

chenruibing
2015/05/29
0
0
Android开发商也项目中UI部分具体用什么技术实现?

最近在研究Android,感觉Android的UI设计的控件繁多,而且实现相对繁琐,我用html+js+css几行代码就实现一个图片轮播的效果,但AndroidUI就有点复杂了,请问在开发商也项目中UI部分具体用到什...

xiaoDuDu
2015/03/11
153
2

没有更多内容

加载失败,请刷新页面

加载更多

大数据学习有哪几个步骤

目前大数据行业异常火爆,不少人都对大数据充满了兴趣,其中有大部分人都从没接触过大数据,对于应该如何学习大数据一头雾水。大数据学习并不是高深莫测的,虽然它并没有多简单,但是通过努力...

董黎明
20分钟前
4
0
shell习题_3

1:监控httpd的进程;每隔10s检测一次服务器的httpd的进程数,如果大于500则自动重启httpd服务;并检测是否启动成功; 如果没有正常启动还需要再启动一次,最大不成功数超过五次立即发邮件给管理...

芬野de博客
20分钟前
1
0
Android 9.0 优势探讨

我们来谈论一下 Android。尽管 Android 只是一款内核经过修改的 Linux,但经过多年的发展,Android 开发者们(或许包括正在阅读这篇文章的你)已经为这个平台的演变做出了很多值得称道的贡献...

问题终结者
37分钟前
4
0
vue 组件使用中的一些细节点

细节一 基础例子 运行结果: 以上大家都懂,这边就不多说,回到代码里,有时候我们需要 tbody 里面每一行是一个子组件,那我们代码可以怎么写呢?我们可以这样写,定义一个全局组件,如下: ...

peakedness丶
44分钟前
2
0
vue 之 css module的使用方法

动手之前先配置项目,网上很多文章说需要下载css-loader插件,Vue中的vue-loader已经集成了 CSS Modules,因此删掉也能正常运行 在vue.config.js中添加如下配置 `css: {``loaderOptions: ...

前端小攻略
47分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部