Banner框架的简单使用(实现轮播图)

来源:互联网 发布:手机联机软件 编辑:程序博客网 时间:2024/06/08 08:07

[-]

  1. 效果展示
  2. 使用步骤
    1. Step 1依赖banner Gradle dependencies     compile comyouthbannerbanner149 最新版本
  3. Step 2添加权限到你的 AndroidManifestxml
  4. Step 3在布局文件中添加Banner可以设置自定义属性
  5. Step 4在Activity或者Fragment中配置Banner
  6. Step 5重写图片加载器
  7. Step 6可选增加体验
  8. 总结
  9. banner实现的效果和ViewPager十分相似但是我们不能忘记ViewPager的使用子啊引导页的时候我们需要对ViewPager设置对应的监听事件


效果展示:

使用步骤:


Step 1.依赖banner

Gradle
dependencies{

compile 'com.youth.banner:banner:1.4.9'
compile 'com.github.bumptech.glide:glide:3.7.0'

}


Step 2.添加权限到你的 AndroidManifest.xml

[html] view plain copy
  1. <!-- if you want to load images from the internet -->  
  2. <uses-permission android:name="android.permission.INTERNET" />   
  3. <!-- if you want to load images from a file OR from the internet -->  
  4. <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />  

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

[html] view plain copy
  1. <com.youth.banner.Banner  
  2.     xmlns:app="http://schemas.android.com/apk/res-auto"  
  3.     android:id="@+id/banner"  
  4.     android:layout_width="match_parent"  
  5.     android:layout_height="高度自己设置" />  

Step 4.在Activity或者Fragment中配置Banner,

(网络请求的数据,图片得手动添加,不能使用for循环)

[java] view plain copy
  1. private List<String> imageArray;  
  2.     private List<String> imageTitle;  
  3.     private Banner mBanner;  
  4.   
  5.     @Override  
  6.     protected void onCreate(Bundle savedInstanceState) {  
  7.         super.onCreate(savedInstanceState);  
  8.         setContentView(R.layout.activity_main);  
  9.   
  10.         //设置图片加载集合  
  11.         imageArray=new ArrayList<>();  
  12.   
  13.         imageArray.add("http://img3.imgtn.bdimg.com/it/u=2758743658,581437775&fm=15&gp=0.jpg");  
  14.         imageArray.add("http://img3.imgtn.bdimg.com/it/u=2105877023,3759180926&fm=15&gp=0.jpg");  
  15.         imageArray.add("http://img2.imgtn.bdimg.com/it/u=1876814088,3589919070&fm=15&gp=0.jpg");  
  16.   
  17.         //设置图片标题集合  
  18.         imageTitle=new ArrayList<>();  
  19.         imageTitle.add("aaaaaaaaa");  
  20.         imageTitle.add("bbbbbbbbb");  
  21.         imageTitle.add("ccccccccc");  
  22.   
  23.         mBanner = (Banner) findViewById(R.id.banner);  
  24.         //设置banner样式  
  25.         mBanner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE_INSIDE);  
  26.         //设置图片加载器  
  27.         mBanner.setImageLoader(new GlideImageLoader());  
  28.         //设置图片集合  
  29.         mBanner.setImages(imageArray);  
  30.         //设置banner动画效果  
  31.         mBanner.setBannerAnimation(Transformer.RotateDown);  
  32.         //设置标题集合(当banner样式有显示title时)  
  33.         mBanner.setBannerTitles(imageTitle);  
  34.         //设置轮播时间  
  35.         mBanner.setDelayTime(1500);  
  36.         //设置指示器位置(当banner模式中有指示器时)  
  37.         mBanner.setIndicatorGravity(BannerConfig.CENTER);  
  38.         //banner设置方法全部调用完毕时最后调用  
  39.         mBanner.start();  
  40.     }  

Step 5.重写图片加载器

[java] view plain copy
  1. private class GlideImageLoader extends ImageLoader {  
  2.   
  3.         @Override  
  4.         public void displayImage(Context context, Object path, ImageView imageView) {  
  5.             //Glide 加载图片简单用法  
  6.             Glide.with(context).load((String) path).into(imageView);  
  7.         }  
  8.     }  

Step 6.(可选)增加体验

[java] view plain copy
  1. //如果你需要考虑更好的体验,可以这么操作  
  2.     @Override  
  3.     protected void onStart() {  
  4.         super.onStart();  
  5.         //开始轮播  
  6.         mBanner.startAutoPlay();  
  7.     }  
  8.     @Override  
  9.     protected void onStop() {  
  10.         super.onStop();  
  11.         //结束轮播  
  12.         mBanner.stopAutoPlay();  
  13.     }  

简单使用:

imageArray = new ArrayList<>();                imageArray.add(bean.getData().getGoods().getGoods_img());                imageArray.add(bean.getData().getGoods().getGoods_img());                imageArray.add(bean.getData().getGoods().getGoods_img());                imageArray.add(bean.getData().getGoods().getGoods_img());                //设置图片加载器                banner.setImageLoader(new GlideImageLoader());                //设置图片集合                  banner.setImages(imageArray);                //banner设置方法全部调用完毕时最后调用                banner.start();

总结:

banner实现的效果和ViewPager十分相似,但是我们不能忘记ViewPager的使用,子啊引导页的时候,我们需要对ViewPager设置对应的监听事件!!

转载自:http://blog.csdn.net/github_37245515/article/details/64131812,
 如有侵权,请告知删除。