XBanner的小实现
来源:互联网 发布:淘宝818购物节 编辑:程序博客网 时间:2024/06/03 13:10
XBanner是一个非常优秀的无限自动轮播框架,同时也是一个控件,XBanner的主要功能如下:
- 根据传入的数据条数自动调整广告页数
- 当图片数量大于一张时,可以无限循环自动播放、手指按下停止轮播、抬起手指继续轮播
- 可以自定义指示器的位置:左下角、下侧中间、右下角
- 自定义指示点:正常状态和选中状态
- 监听Item的点击事件
- 支持设置图片轮播时间间隔
- 可以设置指示器的背景及其显示/隐藏
- 可以显示提示性文字并设置其颜色、大小
- 支持改变图片切换动画,框架中默认支持10中动画
- 可以设置图片切换动画的时长
XBanner的用法
一、首先导依赖,需要用到xbanner,还有加载网络图片的依赖,还有在清单文件里面写网络权限。
compile 'com.xhb:xbanner:1.2.2' compile 'com.nineoldandroids:library:2.4.0' compile 'com.github.bumptech.glide:glide:3.7.0' compile 'jp.wasabeef:glide-transformations:1.0.6'
二、创建布局。 XBanner控件的部分属性如下表所示:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <com.stx.xhb.xbanner.XBanner android:id="@+id/banner" android:layout_width="300dp" android:layout_height="400dp" android:layout_gravity="center" app:AutoPlayTime="3000" app:pointsContainerBackground="#44AAAAAA" app:pointsPosition="RIGHT" app:tipTextColor="#FFFFFFFF" app:tipTextSize="16.0sp" /> <!-- 翻页动画单选按钮组 --> <RadioGroup android:id="@+id/transforms" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <RadioButton android:id="@+id/rb_default" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="Default" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_alpha" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Alpha" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_rotate" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Rotate" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_cube" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Cube" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_flip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Flip" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_accordion" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Accordion" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_zoomfade" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ZoomFade" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_zoomcenter" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ZoomCenter" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_zoomstack" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ZoomStack" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_depth" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Depth" android:textSize="16.0sp" /> <RadioButton android:id="@+id/rb_stack" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Stack" android:textSize="16.0sp" /> </RadioGroup></LinearLayout>三、MainActivity.java
找控件
banner = (XBanner) findViewById(R.id.banner); transforms = (RadioGroup) findViewById(R.id.transforms);创建list集合添加图片地址跟图片描述
images = new ArrayList<>(); titles = new ArrayList<>(); images.add("http://img01.sogoucdn.com/app/a/100520024/f4d580ab0d9f5d514c9471b23bba0561"); titles.add("美女1美女1"); images.add("http://img03.sogoucdn.com/app/a/100520024/611aff966911ebb8f61df057f4822dd9"); titles.add("美女2"); images.add("http://img01.sogoucdn.com/app/a/100520024/2ac6c898d7d768e3aabd72b0fbb62e5a"); titles.add("美女3"); images.add("http://img01.sogoucdn.com/app/a/100520024/bc84efff94797560fd239a883712cf71"); titles.add("美女4");给XBanner赋值
// 为XBanner绑定数据 banner.setData(images, titles); // XBanner适配数据 banner.setmAdapter(new XBanner.XBannerAdapter() { @Override public void loadBanner(XBanner banner, View view, int position) { Glide.with(MainActivity.this).load(images.get(position)).into((ImageView) view); } });
这里可以给XBanner设置一个滑动的特效跟特效时间
// 设置XBanner的页面切换特效 Default默认的 banner.setPageTransformer(Transformer.Default); // 设置XBanner页面切换的时间,即动画时长 banner.setPageChangeDuration(1000);
Default是默认的平滑效果,Transformer提供了好几种动画特效。供君选择
public enum Transformer { Default, Alpha, Rotate, Cube, Flip, Accordion, ZoomFade, ZoomCenter, ZoomStack, Stack, Depth, Zoom}也可以像我那样为了方便些一排RadioGroup动态的去改变特效
// RadioGroup中选中某个RadioButton时回调的方法 transforms.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { switch (checkedId) { case R.id.rb_default: banner.setPageTransformer(Transformer.Default); break; case R.id.rb_alpha: banner.setPageTransformer(Transformer.Alpha); break; case R.id.rb_rotate: banner.setPageTransformer(Transformer.Rotate); break; case R.id.rb_cube: banner.setPageTransformer(Transformer.Cube); break; case R.id.rb_flip: banner.setPageTransformer(Transformer.Flip); break; case R.id.rb_accordion: banner.setPageTransformer(Transformer.Accordion); break; case R.id.rb_zoomfade: banner.setPageTransformer(Transformer.ZoomFade); break; case R.id.rb_zoomcenter: banner.setPageTransformer(Transformer.ZoomCenter); break; case R.id.rb_zoomstack: banner.setPageTransformer(Transformer.ZoomStack); break; case R.id.rb_stack: banner.setPageTransformer(Transformer.Stack); break; case R.id.rb_depth: banner.setPageTransformer(Transformer.Depth); break; } } });
XBanner自带的点击事件
// XBanner中某一项的点击事件 banner.setOnItemClickListener(new XBanner.OnItemClickListener() { @Override public void onItemClick(XBanner banner, int position) { Toast.makeText(MainActivity.this, "点击了第" + (position + 1) + "张图片", Toast.LENGTH_SHORT).show(); } });
还可以与Activity的生命周期关联起来使用,当Activity失去焦点的时候停止自动轮播,当Activity获得焦点的时候才开始自动轮播
//当Activity失去焦点时立即停止自动轮播;当Activity获得焦点时才开始自动轮播 @Override protected void onResume() { super.onResume(); banner.startAutoPlay(); } @Override protected void onStop() { super.onStop(); banner.stopAutoPlay(); }
简单的用一下还是可以的
Demo点我
阅读全文
0 0
- XBanner的小实现
- Banner和XBanner的实现
- XBanner的使用实现无限自动轮播图
- Xbanner的简单使用
- XBanner的简单使用
- 简单的使用xBanner
- xbanner的使用
- Xbanner的基本使用
- XBanner
- Xbanner
- Xbanner
- xbanner
- Xbanner
- 【Android - 框架】之XBanner的使用
- xbanner使用
- XBanner轮播图
- XBanner简单学习
- xbanner无限轮播
- eclipse中好看的方法注释模板
- Spark算子[01]:foreach,foreachPartition
- postgresql 复合数据类型的使用方法
- java.sql.BatchUpdateException问题处理
- Ethernet/IP 学习笔记四
- XBanner的小实现
- 黑白棋分解一
- 带中文说明书OSLO Light 6.2-ISO 1CD光学软件
- 趣图丨新·颈椎病康复指南
- java理解反射
- android开发里跳过的坑-AS导入NDK工程提示错误 No such property: sdkHandler for class: com.android.build.gradle.Librar
- 14个你可能不知道的JavaScript调试技巧
- 为什么要实现Serializable自己理解
- BDTC 2017丨大数据在金融、交通、医疗、工业领域落地实践与应用