添加依赖包
通过 Banner 和 Glide 实现轮播图。引入第三方库:
dependencies {
implementation 'io.github.youth5201314:banner:2.2.2'
implementation 'com.github.bumptech.glide:glide:4.14.2'
annotationProcessor 'com.github.bumptech.glide:compiler:4.14.2'
}
Banner 视图
<?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"
android:background="#EAEAEA"
android:padding="5dp">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="5dp"
android:layout_marginTop="5dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="5dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="SpeakableTextPresentCheck">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.youth.banner.Banner
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="150dp"
app:banner_radius="8dp" />
</RelativeLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
图片实体类
class SlideShowItem() {
var url: String = ""
constructor(url: String) : this() {
this.url = url
}
override fun toString(): String {
return "SlideShowItem(url='$url')"
}
}
轮播图适配器
class SlideShowAdapter(
banners: List<SlideShowItem>,
private var fragment: Fragment
) : BannerAdapter<SlideShowItem, SlideShowAdapter.SlideShowViewHolder>(banners) {
override fun onCreateHolder(parent: ViewGroup?, viewType: Int): SlideShowViewHolder {
val imageView = ImageView(parent!!.context)
imageView.layoutParams = ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)
imageView.scaleType = ImageView.ScaleType.CENTER_CROP
return SlideShowViewHolder(imageView)
}
override fun onBindView(holder: SlideShowViewHolder?, data: SlideShowItem?, position: Int, size: Int) {
Glide.with(fragment).load(mDatas[position].url).into(holder!!.imageView)
}
class SlideShowViewHolder(var imageView: ImageView) : RecyclerView.ViewHolder(imageView) {
init {
imageView.scaleType = ImageView.ScaleType.CENTER_CROP
}
}
}
Fragment 中使用
class NavFindFragment : Fragment() {
private lateinit var binding: FragmentNavFindBinding
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
binding = FragmentNavFindBinding.inflate(layoutInflater, container, false)
if (savedInstanceState == null) {
createBanner()
}
return binding.root
}
private fun createBanner() {
binding.banner.addBannerLifecycleObserver(this).setAdapter(
SlideShowAdapter(
listOf(
SlideShowItem("https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/1f28377c4236841c7294ae68c88e5af6.jpg?w=2452&h=920"),
SlideShowItem("https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e89200db5385ff3d99fb45cc342fcd14.jpg?thumb=1&w=1533&h=575&f=webp&q=90")
), this
)
).indicator = CircleIndicator(context);
}
}
效果图
![](/i/l/?n=23&i=blog/2271881/202212/2271881-20221212022353717-1478644551.png)