Fragment中利用banner实现轮播图(Banner2.2.2)

准备工作

1. 在AndroidManifest中开启网络权限（省略）

2. 在gradle中添加依赖

implementation 'io.github.youth5201314:banner:2.2.2'

第一步:

1.新建空白Fragment

2.在fragment布局文件中添加banner

！！注意有的时候添加进去后布局文件不可预览，左上角File->Invalidate Caches等待重启即可。

！！如果重启后还是不可预览可将banner版本调低后使用。

 <com.youth.banner.Banner
        android:id="@+id/banner"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        app:banner_radius="8dp" />

第二步

1. 新建一个实体类，用于实例化。

public class infoBean {
   public int picture;

    public infoBean(int picture) {
        this.picture = picture;
    }

    public int getPicture() {
        return picture;
    }

    public void setPicture(int picture) {
        this.picture = picture;
    }
}

2. 创建轮播适配器

这里涉及到RecyclerView的知识，不懂的同学可以去仔细查查。

public class BannerViewAdapter extends BannerAdapter<infoBean, BannerViewAdapter.BannerViewHodler> {
    private Fragment fragment;
    
    public BannerViewAdapter(List<infoBean> banners, Fragment fragment) {
        super(banners);
        this.fragment = fragment;
    }
    
    @Override
    public BannerViewAdapter.BannerViewHodler onCreateHolder(ViewGroup parent, int viewType) {
        ImageView imageView = new ImageView(parent.getContext());
        imageView.setLayoutParams(new ViewGroup.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.MATCH_PARENT
        ));
        //setScaleType对图片进行大小处理 CENTER_CROP对原图居中显示后进行等比放缩处理，使最小边等于ImageView的相应边
        imageView.setScaleType(ImageView.ScaleType.CENTER);
        return new BannerViewHodler(imageView);

    }
    //用于绑定图片资源文件
    @Override
    public void onBindView(BannerViewAdapter.BannerViewHodler holder, infoBean data, int position, int size) {
        holder.imageView.setImageResource(data.picture);
    }
    //ViewHolder主要用于容纳view视图
    public class BannerViewHodler extends RecyclerView.ViewHolder {
        ImageView imageView;

        public BannerViewHodler(@NonNull ImageView itemView) {
            super(itemView);
            this.imageView = itemView;
        }
    }
}

3.在Fragment中实现轮播

public class HomeFragment extends Fragment {
    
    private final ArrayList<infoBean> banners;

    public HomeFragment() {
        //v1,v2这些是轮播图片，可用自己本地的替换掉。
        banners = new ArrayList<>();
        banners.add(new infoBean(R.drawable.v1));
        banners.add(new infoBean(R.drawable.v2));
        banners.add(new infoBean(R.drawable.v3));
        banners.add(new infoBean(R.drawable.v4));
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View inflate = inflater.inflate(R.layout.fragment_home2, container, false);
        Banner banner = inflate.findViewById(R.id.banner);
        //添加生命周期
        banner.addBannerLifecycleObserver(this)
                .setAdapter(new BannerViewApapter(banners, this))
                //添加指示器
                .setIndicator(new CircleIndicator(getContext()));
        return inflate;
    }
}

实现预览图

如需自定义轮播时间和其他更详细功能，可以在Github中找到更详细用法。

初学者一个，如有写的不好的，请见谅。

GitHub - youth5201314/banner: 🔥🔥🔥Banner 2.0 来了！Android广告图片轮播控件，内部基于ViewPager2实现，Indicator和UI都可以自定义。