Android中ConvenientBanner 网络上的图片

港控/mmm° 2022-06-08 03:25 206阅读 0赞

Android-ConvenientBanner 通用的广告栏控件，让你轻松实现广告头效果。支持无限循环，可以设置自动翻页和时间(而且非常智能，手指触碰则暂停翻页，离开自动开始翻页。你也可以设置在界面onPause的时候不进行自动翻页，onResume之后继续自动翻页)，

并且提供多种翻页特效。 对比广告栏控件，大多都需要对源码进行改动才能加载网络图片，或者帮你集成不是你所需要的图片缓存库。而这个库能让有代码洁癖的你欢喜，不需要对库源码进行修改你就可以使用任何你喜欢的网络图片库进行配合。自定义你Holder，实现更多复杂的界面，不一定是图片翻页，任何控件翻页亦可。

效果图：

![Center][]

一.首先添加依赖

compile 'com.bigkoo:convenientbanner:2.0.5'

compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.5'

二. 首先得在清单文件中，添加权限

<uses-permission android:name="android.permission.INTERNET"/>

代码：

package com.bawei.com.myapplication;
    
    import android.app.Activity;
    import android.content.Context;
    import android.os.Bundle;
    import android.widget.ImageView;
    import android.widget.Toast;
    
    import com.bigkoo.convenientbanner.ConvenientBanner;
    import com.bigkoo.convenientbanner.holder.CBViewHolderCreator;
    import com.bigkoo.convenientbanner.holder.Holder;
    import com.bigkoo.convenientbanner.listener.OnItemClickListener;
    import com.bumptech.glide.Glide;
    import com.nostra13.universalimageloader.core.ImageLoader;
    import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
    
    import java.util.Arrays;
    import java.util.List;
    
    public class MainActivity extends Activity implements OnItemClickListener{
    
        private ConvenientBanner convenientBanner;
        private List<String> networkImages;
        private String[] images = {
      "http://00.imgmini.eastday.com/mobile/20170912/20170912201427_be67e7db7619c612a8678a058d468b45_4_mwpm_03200403.jpg",
                "http://00.imgmini.eastday.com/mobile/20170912/20170912201427_be67e7db7619c612a8678a058d468b45_5_mwpm_03200403.jpg",
                "http://00.imgmini.eastday.com/mobile/20170912/20170912201351_29d277fefcdcde1bb7bf3c429fa775b1_3_mwpm_03200403.jpg",
                "http://00.imgmini.eastday.com/mobile/20170912/20170912201351_29d277fefcdcde1bb7bf3c429fa775b1_4_mwpm_03200403.jpg",
                "http://06.imgmini.eastday.com/mobile/20170912/20170912201319_d41d8cd98f00b204e9800998ecf8427e_1_mwpm_03200403.jpg"
    
        };
        protected ImageLoader imageLoader;
    
        @Override protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            convenientBanner = (ConvenientBanner) findViewById(R.id.convenientBanner);
    
            imageLoader = ImageLoader.getInstance();
            imageLoader.init(ImageLoaderConfiguration.createDefault(this));
    
            //网络加载例子 networkImages = Arrays.asList(images);
            convenientBanner.setPages(new CBViewHolderCreator<NetImageLoadHolder>() {
                @Override public NetImageLoadHolder createHolder() {
                    return new NetImageLoadHolder();
                }
            },networkImages)
                    //设置指示器是否可见 .setPointViewVisible(true)
                    //设置自动切换（同时设置了切换时间间隔） .startTurning(2000)
                    //设置两个点图片作为翻页指示器，不设置则没有指示器，可以根据自己需求自行配合自己的指示器,不需要圆点指示器可用不设 .setPageIndicator(new int[]{
      R.mipmap.ic_page_indicator, R.mipmap.ic_page_indicator_focused})
                    //设置指示器的方向（左、中、右） .setPageIndicatorAlign(ConvenientBanner.PageIndicatorAlign.ALIGN_PARENT_RIGHT)
                    //设置点击监听事件 .setOnItemClickListener(this)
                    //设置手动影响（设置了该项无法手动切换） .setManualPageable(true);
        }
    
        public class NetImageLoadHolder implements Holder<String> {
            private ImageView image_lv;
    
            //可以是一个布局也可以是一个Imageview @Override public ImageView createView(Context context) {
                image_lv = new ImageView(context);
                image_lv.setScaleType(ImageView.ScaleType.FIT_XY);
    
                return image_lv;
    
            }
    
            @Override public void UpdateUI(Context context, int position, String data) {
    
                Glide.with(context).load(data).placeholder(R.mipmap.ic_launcher).into(image_lv);
            }
        }
        //图片的点击事件 @Override public void onItemClick(int position) {
            Toast.makeText(this, "position:" + position, Toast.LENGTH_SHORT).show();
        }
    }

三 .添加Glide依赖

compile 'com.github.bumptech.glide:glide:3.7.0'

布局文件：

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
        android:layout_height="match_parent" tools:context="com.bawei.com.myapplication.MainActivity">
    
        <com.bigkoo.convenientbanner.ConvenientBanner xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/convenientBanner"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:canLoop="true" />
    
    </RelativeLayout>

![Center 1][]

mipmap中中放放置的图片，前两张张是默认的图片，第三，四张是小圆点的图片

[Center]: /images/20220608/7793d3f471024fb4b217ad709141fa4d.png
[Center 1]: /images/20220608/fd70aa15a4ab49b79329ac3a35815e72.png