通过ViewPager实现图片的轮播

一.添加权限和依赖包

   <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
 implementation ("com.github.bumptech.glide:glide:4.15.1")

二.创建相关的文件

三.初始化相应的控件

  private ViewPager2 viewPager2;
    private List<String> imageUrls; // 图片URL列表
    private ImagePagerAdapter pagerAdapter;
    private Handler handler = new Handler();
    private Runnable runnable;

四.建立实现方法和图片链接

 viewPager2 = findViewById(R.id.viewPager2);
        imageUrls = new ArrayList<>();
        // 填充图片URLs到 imageUrls 列表
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c38755763e.png");
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c387f1ef92.png");
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c3e3377837.png");
        startAutoScroll();
        pagerAdapter = new ImagePagerAdapter(imageUrls);
        viewPager2.setAdapter(pagerAdapter);
        viewPager2.setPageTransformer(new ViewPager2.PageTransformer() {
            @Override
            public void transformPage(@NonNull View page, float position) {
                // 根据 position 变换页面效果
            }
        });

相关方法

  private void startAutoScroll() {
        // 确保停止之前的轮播任务
        stopAutoScroll();
        // 开始自动轮播
        handler.postDelayed(runnable = new Runnable() {
            @Override
            public void run() {
                int currentItem = viewPager2.getCurrentItem();
                int nextItem = (currentItem + 1) % pagerAdapter.getItemCount();
                viewPager2.setCurrentItem(nextItem, true);
                // 2秒后继续轮播
                startAutoScroll();
            }
        }, 2000);
    }

    private void stopAutoScroll() {
        if (runnable != null) {
            handler.removeCallbacks(runnable);
        }
    }
    public class ImagePagerAdapter extends RecyclerView.Adapter<ImagePagerAdapter.ViewPager2ViewHolder> {
        private List<String> imageUrls;

        public ImagePagerAdapter(List<String> imageUrls) {
            this.imageUrls = imageUrls;
        }

        @NonNull
        @Override
        public ViewPager2ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.view_pager_item, parent, false);
            return new ViewPager2ViewHolder(view);
        }

        @Override
        public void onBindViewHolder(@NonNull ViewPager2ViewHolder holder, int position) {
            String imageUrl = imageUrls.get(position);
            // 使用 Glide 加载图片
            Glide.with(holder.itemView.getContext()).load(imageUrl).into(holder.imageView);
        }

        @Override
        public int getItemCount() {
            return imageUrls.size();
        }

        public class ViewPager2ViewHolder extends RecyclerView.ViewHolder {
            ImageView imageView;

            public ViewPager2ViewHolder(@NonNull View itemView) {
                super(itemView);
                imageView = itemView.findViewById(R.id.imageView);
            }
        }
    }

完整代码和XML

package com.hnucm.lunbo;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.RecyclerView;
import androidx.viewpager2.widget.ViewPager2;

import android.os.Bundle;
import android.os.Handler;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

import java.util.ArrayList;
import java.util.List;


public class MainActivity extends AppCompatActivity {
    private ViewPager2 viewPager2;
    private List<String> imageUrls; // 图片URL列表
    private ImagePagerAdapter pagerAdapter;
    private Handler handler = new Handler();
    private Runnable runnable;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager2 = findViewById(R.id.viewPager2);
        imageUrls = new ArrayList<>();
        // 填充图片URLs到 imageUrls 列表
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c38755763e.png");
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c387f1ef92.png");
        imageUrls.add("https://pic.lingdianshiren.xyz/i/2024/06/14/666c3e3377837.png");
        startAutoScroll();
        pagerAdapter = new ImagePagerAdapter(imageUrls);
        viewPager2.setAdapter(pagerAdapter);
        viewPager2.setPageTransformer(new ViewPager2.PageTransformer() {
            @Override
            public void transformPage(@NonNull View page, float position) {
                // 根据 position 变换页面效果
            }
        });
    }
    private void startAutoScroll() {
        // 确保停止之前的轮播任务
        stopAutoScroll();
        // 开始自动轮播
        handler.postDelayed(runnable = new Runnable() {
            @Override
            public void run() {
                int currentItem = viewPager2.getCurrentItem();
                int nextItem = (currentItem + 1) % pagerAdapter.getItemCount();
                viewPager2.setCurrentItem(nextItem, true);
                // 2秒后继续轮播
                startAutoScroll();
            }
        }, 2000);
    }

    private void stopAutoScroll() {
        if (runnable != null) {
            handler.removeCallbacks(runnable);
        }
    }
    public class ImagePagerAdapter extends RecyclerView.Adapter<ImagePagerAdapter.ViewPager2ViewHolder> {
        private List<String> imageUrls;

        public ImagePagerAdapter(List<String> imageUrls) {
            this.imageUrls = imageUrls;
        }

        @NonNull
        @Override
        public ViewPager2ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.view_pager_item, parent, false);
            return new ViewPager2ViewHolder(view);
        }

        @Override
        public void onBindViewHolder(@NonNull ViewPager2ViewHolder holder, int position) {
            String imageUrl = imageUrls.get(position);
            // 使用 Glide 加载图片
            Glide.with(holder.itemView.getContext()).load(imageUrl).into(holder.imageView);
        }

        @Override
        public int getItemCount() {
            return imageUrls.size();
        }

        public class ViewPager2ViewHolder extends RecyclerView.ViewHolder {
            ImageView imageView;

            public ViewPager2ViewHolder(@NonNull View itemView) {
                super(itemView);
                imageView = itemView.findViewById(R.id.imageView);
            }
        }
    }
}
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

    <TextView
        android:id="@+id/textView2"
        android:layout_width="126dp"
        android:layout_height="48dp"
        android:layout_marginTop="8dp"
        android:text="图片轮播"
        android:textSize="30dp"
        android:textStyle="bold"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager2"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_marginTop="8dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2" />
</androidx.constraintlayout.widget.ConstraintLayout>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:scaleType="centerCrop" />
</FrameLayout>

注:新手小白,有错误请帮忙指出,我会继续努力修改的。共同进步

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值