Kotlin实现Banner广告轮播功能

效果图：

实现方法：

1.在build中添加引用

（1）.在头部添加

apply plugin: 'kotlin-kapt'

（2）.在dependencies中添加

//glide
implementation "com.github.bumptech.glide:glide:4.10.0"
kapt "com.github.bumptech.glide:compiler:4.10.0"
//广告banner轮滑功能
implementation "com.youth.banner:banner:2.0.10"
//recyclerview
implementation "androidx.recyclerview:recyclerview:1.1.0"

2.在drawable中添加自定义圆点例如：indicator_normal

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <solid android:color="#00BCFF" />
    <size
        android:width="8dp"
        android:height="8dp" />
</shape>

广告图片根据需要自己添加，当然也可以是网络请求下来的图片，这样添加原点时就需要改善一下，动态添加呈放圆点的容器ImageView。

3.添加图片加载工具类：

（1）.WTGlide

package com.ruidde.animationtimesdeclinedemo.utils

import android.content.Context
import android.widget.ImageView
import com.bumptech.glide.annotation.GlideModule
import com.bumptech.glide.load.MultiTransformation
import com.bumptech.glide.module.AppGlideModule
import com.ruidde.animationtimesdeclinedemo.R

@GlideModule
class WTGlide : AppGlideModule() {
    companion object {

        fun loadCrop(
            context: Context,
            imageView: ImageView,
            path: Int,
            place: Int = R.drawable.bander_one
        ) {
            GlideApp.with(context)
                .load(path)
                .placeholder(place)
//                .centerInside()
                .dontAnimate()
                .into(imageView)
        }

        fun loadCropRound(context: Context, imageView: ImageView, path: String) {
            GlideApp.with(context)
                .load(path)
                .centerCrop()
                .transform(MultiTransformation(RoundedCorners(3)))
                .dontAnimate()
                .into(imageView)
        }
    }
}

（2）.RoundedCorners

package com.ruidde.animationtimesdeclinedemo.utils;

import android.annotation.SuppressLint;
import android.graphics.Bitmap;

import androidx.annotation.NonNull;
import androidx.core.util.Preconditions;

import com.bumptech.glide.load.engine.bitmap_recycle.BitmapPool;
import com.bumptech.glide.load.resource.bitmap.BitmapTransformation;
import com.bumptech.glide.load.resource.bitmap.TransformationUtils;
import com.bumptech.glide.util.Util;

import java.nio.ByteBuffer;
import java.security.MessageDigest;

public class RoundedCorners extends BitmapTransformation {
    private static final String ID = "com.bumptech.glide.load.resource.bitmap.RoundedCorners";
    private static final byte[] ID_BYTES = ID.getBytes(CHARSET);

    private final int roundingRadius;

    /**
     * @param roundingRadius the corner radius (in device-specific pixels).
     * @throws IllegalArgumentException if rounding radius is 0 or less.
     */
    @SuppressLint("RestrictedApi")
    public RoundedCorners(int roundingRadius) {
        Preconditions.checkArgument(roundingRadius > 0, "roundingRadius must be greater than 0.");
        this.roundingRadius = roundingRadius;
    }

    @Override
    protected Bitmap transform(
            @NonNull BitmapPool pool, @NonNull Bitmap toTransform, int outWidth, int outHeight) {
        return TransformationUtils.roundedCorners(pool, toTransform, roundingRadius);
    }

    @Override
    public boolean equals(Object o) {
        if (o instanceof RoundedCorners) {
            RoundedCorners other = (RoundedCorners) o;
            return roundingRadius == other.roundingRadius;
        }
        return false;
    }

    @Override
    public int hashCode() {
        return Util.hashCode(ID.hashCode(),
                Util.hashCode(roundingRadius));
    }

    @Override
    public void updateDiskCacheKey(@NonNull MessageDigest messageDigest) {
        messageDigest.update(ID_BYTES);

        byte[] radiusData = ByteBuffer.allocate(4).putInt(roundingRadius).array();
        messageDigest.update(radiusData);
    }
}

3.Acticity以及布局实现

（1）.xml

activity_main：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_margin="15dp"
        android:layout_height="160dp">

        <com.youth.banner.Banner
            android:id="@+id/indexBanner"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#F0F2F7" />

        <LinearLayout
            android:id="@+id/ll"
            android:layout_width="wrap_content"
            android:layout_height="10dp"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="10dp"
            android:gravity="center_horizontal"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/iv1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/indicator_normal" />

            <ImageView
                android:id="@+id/iv2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:src="@drawable/indicator_selector" />

            <ImageView
                android:id="@+id/iv3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:src="@drawable/indicator_selector" />

        </LinearLayout>

    </RelativeLayout>

</LinearLayout>

item_banner：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imgBanner"
        android:layout_width="match_parent"
        android:scaleType="fitXY"
        android:layout_marginStart="5dp"
        android:layout_marginEnd="5dp"
        android:layout_height="match_parent"/>

</RelativeLayout>

（2）.adapter：IndexBannerAdapter

package com.ruidde.animationtimesdeclinedemo.utils

import android.content.Context
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView
import androidx.recyclerview.widget.RecyclerView
import com.ruidde.animationtimesdeclinedemo.R
import com.youth.banner.adapter.BannerAdapter

class IndexBannerAdapter(private var contxt: Context, urls: List<Int>) :
    BannerAdapter<Int, IndexBannerAdapter.BannerViewHolder>(urls) {

    override fun onCreateHolder(parent: ViewGroup?, viewType: Int): BannerViewHolder {
        val view = LayoutInflater.from(contxt).inflate(R.layout.item_banner, parent, false)
        return BannerViewHolder(view)
    }

    override fun onBindView(holder: BannerViewHolder?, data: Int, position: Int, size: Int) {
        WTGlide.loadCrop(contxt, holder!!.imageView, data, R.drawable.bander_one)
    }

    inner class BannerViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val imageView: ImageView = view.findViewById(R.id.imgBanner)
    }
}

（3）.activity

package com.ruidde.animationtimesdeclinedemo

import android.content.Context
import android.os.Bundle
import android.util.Log
import androidx.appcompat.app.AppCompatActivity
import com.ruidde.animationtimesdeclinedemo.utils.IndexBannerAdapter
import com.youth.banner.listener.OnPageChangeListener
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), OnPageChangeListener {

    lateinit var mContext: Context
    var bannerList: List<Int> = mutableListOf(R.drawable.bander_one, R.drawable.home_banner, R.drawable.bander_three)

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        mContext = this
        initView()
        initData()
    }

    fun initView() {
        val bannerAdapter = IndexBannerAdapter(mContext, bannerList)
        indexBanner.adapter = bannerAdapter
        indexBanner.addOnPageChangeListener(this)

    }

    fun initData() {

    }

    override fun onPageScrollStateChanged(state: Int) {

    }

    override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {

    }

    override fun onPageSelected(position: Int) {
        Log.e("okhttp" ,"position = "+position)
        if (position == 0) {
            iv1.setImageResource(R.drawable.indicator_normal)
            iv2.setImageResource(R.drawable.indicator_selector)
            iv3.setImageResource(R.drawable.indicator_selector)
        } else if (position == 1) {
            iv1.setImageResource(R.drawable.indicator_selector)
            iv2.setImageResource(R.drawable.indicator_normal)
            iv3.setImageResource(R.drawable.indicator_selector)
        } else if (position == 2) {
            iv1.setImageResource(R.drawable.indicator_selector)
            iv2.setImageResource(R.drawable.indicator_selector)
            iv3.setImageResource(R.drawable.indicator_normal)
        }
    }


}

总结：这样就实现banner广告轮播效果了，希望对小伙伴们有所帮助

demo