Android使用Banner框架实现轮播图

最新推荐文章于 2024-05-08 12:06:44 发布

陈壮实的搬砖生活

最新推荐文章于 2024-05-08 12:06:44 发布

阅读量889

点赞数 4

分类专栏：安卓开发文章标签： android java Banner kotlin

本文链接：https://blog.csdn.net/qq_41915623/article/details/125898594

版权

安卓开发专栏收录该内容

61 篇文章 3 订阅

订阅专栏

文章目录

按照惯例，先看效果：
在这里插入图片描述

该banner实现了自动轮播、圆角矩形等小功能，具体看下面代码吧！

1. 添加banner依赖和glide(图片加载)依赖

implementation 'io.github.youth5201314:banner:2.2.2' // banner依赖
implementation 'com.github.bumptech.glide:glide:4.12.0' //glide加载网络图片依赖

2. 添加网络权限

在AndroidManifest.xml中：

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

3. 在layout中

<com.youth.banner.Banner
                    android:id="@+id/home_banner"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:layout_marginTop="8dp"
                    android:layout_marginHorizontal="8dp"
                    app:layout_constraintTop_toTopOf="parent"
                    tools:layout_editor_absoluteX="5dp" />

4. 在java代码中

/**
     * 初始化轮播图
     */
    private void initBanner(){
        // 加载数据
        List<String> imageList = new ArrayList();
        imageList.add("https://image14.m1905.cn/uploadfile/2018/0907/thumb_1_1380_460_20180907013518839623.jpg");
        imageList.add("https://image14.m1905.cn/uploadfile/2018/0906/thumb_1_1380_460_20180906040153529630.jpg");
        imageList.add("https://image13.m1905.cn/uploadfile/2018/0907/thumb_1_1380_460_20180907114844929630.jpg");

        // 注入数据
        binding.homeBanner.setAdapter(new BannerImageAdapter<String>(imageList) {
            @Override
            public void onBindView(BannerImageHolder holder, String data, int position, int size) {
                Glide.with(holder.itemView)
                        .load(data)
                        .apply(RequestOptions.bitmapTransform(new RoundedCorners(30)))
                        .into(holder.imageView);
            }})
            .setIndicator(new RectangleIndicator(getContext()))
            .addBannerLifecycleObserver(this)
            .setOnBannerListener(
                    (OnBannerListener<String>)(data, position) ->
                            Toast.makeText(getContext(), position+" "+data, Toast.LENGTH_SHORT).show()  // 添加点击事件
            );

        // 给banner添加圆角
        binding.homeBanner.setOutlineProvider(new ViewOutlineProvider() {
            @Override
            public void getOutline(View view, Outline outline) {
                outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), 30);
            }
        });
        binding.homeBanner.setClipToOutline(true);

    }

附Kotlin版

kotlin版本我没有实现，是看的
banner含kotlin
有兴趣的自己调试一下，应该问题不大。

        banner.adapter = object : BannerImageAdapter<Advertising.AdvertisementsBean.AdvertisementListBean>(advertisements) {
            override fun onBindView(holder: BannerImageHolder, data: Advertising.AdvertisementsBean.AdvertisementListBean, position: Int, size: Int) { //图片加载自己实现
                Glide.with(holder.itemView)
                        .load(data.url)
                        .apply(RequestOptions.bitmapTransform(RoundedCorners(30)))
                        .into(holder.imageView)
            }
        }
        banner
                .setIndicator(RectangleIndicator(context))
                .addBannerLifecycleObserver(this)
                .setOnBannerListener(OnBannerListener { data: Advertising.AdvertisementsBean.AdvertisementListBean?, position: Int ->
                    logd("${data?.jumpUrl}")
                })