Android轮播图制作开源框架的介绍及应用（Banner框架/AndroidImageSlider框架）

一、前言

在开始我的博客之前，我为大家准备了几个非常热门的app的主界面的截图。不难发现，这些apps都用到了轮播图（红色圈出来的部分），实现循环播放多个广告图片和手动滑动循环等功能。如今，在大部分的apps中，轮播图基本已经是随处可见。

那提到轮播图的制作，很多人应该最先想到的Android Studio自身的viewpage的控件，但是viewpage的许多功能都需要通过自定义来实现，工作量比较大，实现起来比较繁琐。因此我就“不重复造轮子”，不用viewpage来制作，主要介绍的是我在github上发现两款热门的开源框架：

1.Banner框架

官方Github地址：https://github.com/youth5201314/banner/tree/release-1.4.10

2.AndroidImageSlider框架

官方Github地址：https://github.com/daimajia/AndroidImageSlider

这两款开源框架不仅仅功能十分强大，重点是十分简单易用，对于新手来说容易上手，对于老手来说可以提高效率，接下来就来详细介绍一下这两个框架的具体实现。

二、Banner框架的应用

Step1：在build.gradle中添加相关依赖

dependencies{
   
    //图片轮播框架
    implementation 'com.youth.banner:banner:1.4.10'
    //图片加载框架
    implementation 'com.github.bumptech.glide:glide:3.7.0'
}

目前banner框架最新版本已经达到2.0，实现的功能更加强大，有兴趣的朋友可以自行探索。我采用的是1.0版本中最新的1.4.10。
需要特别注意的一点是banner本身不提供图片加载功能，因此我们除了需要用到banner框架自身外，还需要用到图片加载的相关框架，图片加载的框架有很多，这边用到的是glide框架。

Step2：AndroidManifest.xml权限设置

这里讲到的权限设置主要是和导入图片资源有关，如果你想以链接的方式直接从网络上获取图片资源或者是从文件中获取图片资源则需要在AndroidManifest.xml中进行如下设置。

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

Step3：在布局文件中添加Banner（可选）

Banner的属性完全可以按着个人喜好来自定义。当然跳过这一步也是可以的，但是这种情况下，需要在Activity或者Fragment中new Banner()。以下是我在布局文件中简单的定义了一个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="250dp" />

如果想对banner的一些小部件进行自定义，那就必须在布局文件中进行定义。在自定义操作之前，先在布局文件中加入这行代码：

    xmlns:custom="http://schemas.android.com/apk/res-auto"

只有加入了这行代码以后，才能完成以下的自定义banner布局编写，举几个简单的例子：

//设置标题字体颜色
custom:title_textcolor="***";
//设置标题字体大小
custom:title_textsize=**sp;
//设置标题栏高度
custom:title_height=**dp;
//设置圆形指示器宽度
custom:indicator_width=**dp
//设置圆形指示器高度
custom:indicator_height=**dp
//设置圆形指示器间距
custom:indicator_margin=**dp
//还可以设置指示器选中效果、指示器未选中效果、标题背景颜色等等...

Step4：MainActivity的编写（图片加载器+初始化数据+banner相关属性设置）

先附上完整代码：

package com.example.mybanner;

import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Context;
import android.widget.ImageView;
import android.widget.Toast;
import com.youth.banner.Banner;
import com.youth.banner.BannerConfig;
import com.youth.banner.Transformer;
import com.youth.banner.listener.OnBannerListener;
import com.youth.banner.loader.ImageLoader;
import com.bumptech.glide.Glide;
import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
   

    //定义图片加载器
    public class MyImageLoader extends ImageLoader {
   
        @Override
        public void displayImage(Context context, Object path, ImageView imageView) {
   
            Glide.with(context).load(path).into(imageView);
        }
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
   
        super.onCreate(savedInstanceState);
        setContentView(R