按照惯例,先看效果:
该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}")
})