Banner 浅析

1. Banner 是什么

Banner能实现循环播放多个广告图片和手动滑动循环等功能。

因为原生ViewPager并不支持循环翻页， 要实现循环还得需要自己去动手。

Banner框架可以进行不同样式、不同动画设置， 以及完善的api方法能满足大部分软件首页轮播图效果的需求。

下载地址：​​https://github.com/youth5201314/banner​​

Gradle 添加依赖

dependencies{
    compile 'com.youth.banner:banner:1.4.8'  //最新版本
    or
    compile 'com.youth.banner:banner:1.3.3' //旧版本，旧版本用法下面有跳转链接      

2. 简单使用

2.1 在布局文件中添加Banner，可以设置自定义属性

！！！此步骤可以省略，直接在Activity或者Fragment中new 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="高度自己设置"      

2.2 重写布局加载器

public class GlideImageLoader extends ImageLoader
    @Override
    public void displayImage(Context context, Object path, ImageView imageView) {
        /**
          注意：
          1.图片加载器由自己选择，这里不限制，只是提供几种使用方法
          2.返回的图片路径为Object类型，由于不能确定你到底使用的那种图片加载器，
          传输的到的是什么格式，那么这种就使用Object接收和返回，你只需要强转成你传输的类型就行，
          切记不要胡乱强转！
         */
        eg：

        //Glide 加载图片简单用法
       Glide.with(context)
                .load(path)//图片地址
                .crossFade()
                .into(imageView);

        //Picasso 加载图片简单用法
        Picasso.with(context).load(path).into(imageView)

        //用fresco加载图片简单用法，记得要写下面的createImageView方法
        Uri uri = Uri.parse((String) path);
        imageView.setImageURI(uri);
    }

    //提供createImageView 方法，如果不用可以不重写这个方法，主要是方便自定义ImageView的创建
    @Override
    public ImageView createImageView(Context context) {
        //使用fresco，需要创建它提供的ImageView，当然你也可以用自己自定义的具有图片加载功能的ImageView
        SimpleDraweeView simpleDraweeView=new SimpleDraweeView(context);
        return      

2.3 在Activity或者Fragment中配置Banner

--------------------------简单使用-------------------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Banner banner = (Banner) findViewById(R.id.banner);
    //设置图片加载器
    banner.setImageLoader(new GlideImageLoader());
    //设置图片集合
    banner.setImages(images);
    //banner设置方法全部调用完毕时最后调用
    banner.start();

    //或者链式调用
    banner.setImages(MyApplication.images)
          .setImageLoader(new GlideImageLoader())
          .start();

}
--------------------------详细使用-------------------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Banner banner = (Banner) findViewById(R.id.banner);
    //设置banner样式
    banner.setBannerStyle(BannerConfig.CIRCLE_INDICATOR_TITLE);
    //设置图片加载器
    banner.setImageLoader(new GlideImageLoader());
    //设置图片集合
    banner.setImages(images);
    //设置banner动画效果
    banner.setBannerAnimation(Transformer.DepthPage);
    //设置标题集合（当banner样式有显示title时）
    banner.setBannerTitles(titles);
    //设置自动轮播，默认为true
    banner.isAutoPlay(true);
    //设置轮播时间
    banner.setDelayTime(1500);
    //设置指示器位置（当banner模式中有指示器时）
    banner.setIndicatorGravity(BannerConfig.CENTER);
    //banner设置方法全部调用完毕时最后调用
    banner.start();
}
-----------------当然如果你想偷下懒也可以这么用--------------------
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Banner banner = (Banner) findViewById(R.id.banner);
    banner.setImages(images)
          .setImageLoader(new GlideImageLoader())
          .setBannerAnimation(Transformer.FlipHorizontal)
          .start();      

2.4 增加体验

//如果你需要考虑更好的体验，可以这么操作
@Override
protected void onStart() {
    super.onStart();
    //开始轮播
    banner.startAutoPlay();
}

@Override
protected void onStop() {
    super.onStop();
    //结束轮播      

3. Banner 各种强大动画

.setBannerAnimation(Transformer.DepthPage);      

4. Banner 各种内置样式

六种格式

.setImages(MyApplication.images)
                .setBannerTitles(MyApplication.titles)
                .setBannerStyle(BannerConfig.NOT_INDICATOR)
                .setImageLoader(new GlideImageLoader())
                .start();      

5. Banner 设置指示器位置

.setIndicatorGravity(BannerConfig.LEFT);
banner.setIndicatorGravity(BannerConfig.CENTER);
banner.setIndicatorGravity(BannerConfig.RIGHT);      

6. Banner 自定义样式

com.youth.banner.Banner 
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/banner1"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:indicator_drawable_selected="@drawable/selected_radius"
            app:indicator_drawable_unselected="@drawable/unselected_radius"
            app:indicator_height="8dp"
            app:indicator_margin="4dp"
            app:indicator_width="8dp" />

        <com.youth.banner.Banner 
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/banner2"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:indicator_drawable_selected="@color/main_color"
            app:indicator_drawable_unselected="@android:color/white"
            app:indicator_height="4dp"
            app:indicator_margin="4dp"
            app:indicator_width="20dp" />
        <com.youth.banner.Banner 
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/banner3"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:title_background="#555CB85C"
            app:title_textsize="10sp"
            app:title_textcolor="@android:color/white"
            app:title_height="30dp"/>