Android之convenientBanner的运用

我们做android的app的时候，经常会用到一个轮播的banner来做顶部的设计。

我们之前做的时候可能大多数会用viewpager+fragment，不管你们是不是，反正我之前是这么做的。

然而今天我发现了一个新的封装好的比较方便的框架，就迫不及待的分享给大家了。

convenientBanner这个开源框架的使用。

那么开始说具体部分吧。

1.首先就是进行gradle文件的配置。让我们集成convenientBanner。

compile 'com.bigkoo:convenientbanner:2.0.5'

2.然后，就是我们的代码部分：

在你用到convenientBanner的地方用如下布局：

<com.bigkoo.convenientbanner.ConvenientBanner
    android:id="@+id/convenientBanner"
    android:layout_width="match_parent"
    android:layout_height="240dp"
    app:canLoop="true" />

3. 布局结束就是我们的activity。

private ConvenientBanner convenientBanner;
private String[] images = {
        "http://pic3.zhimg.com/da1fcaf6a02d1223d130d5b106e828b9.jpg",
        "http://p1.zhimg.com/dd/f1/ddf10a04227ea50fd59746dbcd13c728.jpg",
        "http://p3.zhimg.com/64/5c/645cde143c9a371005f3f749366cffad.jpg"
};
private List<BannerItem> bannerItems = new ArrayList<>();

然后添加轮播图片的代码：

convenientBanner = (ConvenientBanner)findViewById(R.id.convenientBanner);
//生成所需的数据
for (int i = 0; i < images.length; i ++) {
    bannerItems.add(new BannerItem("第" + i + "张", images[i]));
}

convenientBanner.setPages(new CBViewHolderCreator<NetworkImageHolderView>() {
    @Override
    public NetworkImageHolderView createHolder() {
        return new NetworkImageHolderView();
    }
}, bannerItems)
.setPageIndicator(new int[] {R.drawable.dot_unselected, R.drawable.dot_selected});

这里的代码很好理解。重要的地方解释一下吧。

setPageIndicator就是轮播的时候那个小圆点。后面的资源就是你小圆点的图标样式。

大家也可以set别的属性。

说一下常用的吧：

startTurning（）设置轮播的时间，也就是多长时间对图片进行切换。

setOnClickListener() 设置点击事件

setManualPageable() 设置手动影响，里面是true 或者 false。即是否允许手动切换。

等等。主要就说这些方法吧。其余的大家也可以继续试试研究。本人就用到了这些。

还有就是NetworkImageHolderView的代码啦：

public class NetworkImageHolderView implements Holder<Banner> {
    private ImageView view;

    @Override
    public ImageView createView(Context context) {
        view = (ImageView) LayoutInflater.from(context).inflate(R.layout.item_viewpager, null);
        return view;
    }

    @Override
    public void UpdateUI(Context context, int position, Banner data) {
        Glide.with(context).load(data.getImgUrl()).into(view);
        Glide.with(context).load(data.getImgUrl()).placeholder(R.mipmap.banner_top).error(R.mipmap.banner_top).into(view);
    }
}

大家参考使用，这里我对图片的处理是使用的glide框架，我之前也记录过glide的使用方法，大家也可以使用imageloader等图片框架对图片来进行处理。

data就是我们的实体类。里面定义方法包括构造函数。

贴一下吧：

public class Banner {
    //banner图片的url
    private String imgUrl;
  

    public Banner( String image) {
        this.imgUrl = image;
    }

}

大家可以酌情进行修改使用。

希望可以让需要的朋友得到帮助。