我们做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; }
}大家可以酌情进行修改使用。
希望可以让需要的朋友得到帮助。