安卓开发笔记（三十二）:banner轮播图的实现

一.activity.xml

我这里主要爬取的爱奇艺首页的图片进行轮播，应用了两个github上的开源库，一个banner的库，一个加载网络图片的库，用开源库能够极大地节省我们编写代码的时间。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

        <com.youth.banner.Banner
            android:id="@+id/banner"
            android:layout_width="match_parent"
            android:layout_height="170dp"



            />

</LinearLayout>
    </ScrollView>

</LinearLayout>

二.添加相关的库以及网络权限

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

 implementation'com.youth.banner:banner:1.4.10'
 implementation "com.github.bumptech.glide:glide:4.6.1"

三.activity.java

import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.Toast;

import com.bumptech.glide.Glide;
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 java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    Banner banner;//banner组件
    List mlist;//图片资源
    List<String> mlist1;//轮播标题
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ActionBar actionBar=getSupportActionBar();
        if(actionBar !=null)
        {
            actionBar.hide();
        }



        mlist = new ArrayList<>();
        mlist.add("http://pic0.iqiyipic.com/common/lego/20190504/5c7c889174894cd7aed96218320e1945.jpg");
        mlist.add("http://pic3.iqiyipic.com/common/lego/20190504/902898f2117c41ccaea5fa36eb4d0545.jpg");
        mlist.add("http://pic3.iqiyipic.com/common/lego/20190504/8245013abf2b44ce8736d7435d4567dc.jpg");
        mlist.add("http://pic2.iqiyipic.com/common/lego/20190501/9cdcc1a900a34c1497aeff9c5af610f2.jpg");
        mlist1 = new ArrayList<>();
        mlist1.add("这是一个美好的早晨");
        mlist1.add("但我们并不美好");
        mlist1.add("因为我是学人工智能的");
        mlist1.add("已经被学金融的虐得头破血流");

        banner = findViewById(R.id.banner);

        banner.setImageLoader(new GlideImageLoader());   //设置图片加载器
        banner.setImages(mlist);//设置图片源
        banner.setBannerTitles(mlist1);//设置标题源
        banner.setDelayTime(2000);//设置轮播事件，单位毫秒
        banner.setBannerAnimation(Transformer.ZoomOutSlide);//设置轮播动画，动画种类很多，有兴趣的去试试吧，我在这里用的是默认
//stack

/**
 *  轮播图的点击事件
 */
        banner.setOnBannerListener(new OnBannerListener() {
            @Override
            public void OnBannerClick(int position) {
                Toast.makeText(MainActivity.this, "这是第" + position +"个效果", Toast.LENGTH_SHORT).show();
            }
        });
        banner.setIndicatorGravity(BannerConfig.CENTER);//设置指示器的位置

        banner.start();//开始轮播，一定要调用此方法。



    }


//下面的代码可写可不写，用于提升控件的加载效率
    protected void onResume() {
        super.onResume();
        banner.start();
    }

    @Override
    protected void onStop() {
        super.onStop();
        banner.stopAutoPlay();
    }

}

四.网络图片加载的新类

import android.content.Context;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.youth.banner.loader.ImageLoader;

public class GlideImageLoader extends ImageLoader {


    public void displayImage(Context context, Object path, ImageView imageView) {

        Glide.with(context).load(path).into(imageView);

    }

    @Override
    public ImageView createImageView(Context context) {

        ImageView imageView = new ImageView(context);
        return imageView;
    }

}

代码一共就这些，全部照抄不误就可以得到我们的banner效果了，十分简单。