Github: https://github.com/youth5201314/banner
一突琳、輪播組件進(jìn)行圖片的顯示(常用)
概述:輪播圖片
1蝉仇、創(chuàng)建布局
<com.youth.banner.Banner
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="181dp"
android:layout_marginHorizontal="11dp"
android:layout_marginTop="10dp"
//通過banner_radius屬性來實(shí)現(xiàn)圓角
app:banner_radius="10dp" />
2媳瞪、創(chuàng)建bean對象
class ImageBean(var imageStr: String?)
3、在activity中找到控件并進(jìn)行操作
//使用com.kongzue.baseframework來進(jìn)行快捷開發(fā)
@BindView(R.id.banner) //找到對應(yīng)組件
//定義且添加對應(yīng)的泛型,第一個為保存圖片路徑的類,第二個為自帶的輪播適配器
lateinit var mBannerView : Banner<ImageBean, BannerImageAdapter<ImageBean>>
//綁定輪播圖方法,傳入圖片鏈接數(shù)據(jù)
fun bindBannerData(homeBanner: MutableList<IndexData.Data.HomeBannerData>) {
//創(chuàng)建imgBean對象列表
val imageList = mutableListOf<ImageBean>()
//對列表進(jìn)行裝填
for (item in homeBanner) {
imageList.add(ImageBean(item.pic))
}
//通過setAdapter放置一個匿名內(nèi)部類,在onBindView方法中通過Glide進(jìn)行圖片綁定
mBannerView.setAdapter(object : BannerImageAdapter<ImageBean>(imageList) {
override fun onBindView(
holder: BannerImageHolder?,
data: ImageBean?,
position: Int,
size: Int
) {
Glide.with(holder!!.itemView)
.load(data?.imageStr)
.apply(RequestOptions.bitmapTransform(RoundedCorners(30)))
.into(holder.imageView)
}
}//setIndicator可以設(shè)置輪播組件的指示器形狀,這里是圓形。
).addBannerLifecycleObserver(this).setIndicator(CircleIndicator(me))
//設(shè)置輪播的點(diǎn)擊事件
.setOnBannerListener(object : OnBannerListener<ImageBean> {
override fun OnBannerClick(data: ImageBean?, position: Int) {
when (position) {
0 -> {
// jump(ProductsExhibitionActivity::class.java)
}
1 -> {
// jump(ProductsExhibitionActivity::class.java)
}
}
}
}).start()
}
4蚊逢、在頁面進(jìn)行請求數(shù)據(jù)時調(diào)用bindBannerData進(jìn)行輪播數(shù)據(jù)的綁定操作。
二靴庆、輪播組件使用自定義布局進(jìn)行顯示
概述:輪播的是自己定義的布局时捌,可以顯示各種控件。
1炉抒、同樣是創(chuàng)建布局
略
2奢讨、創(chuàng)建bean對象
//bean對象里的內(nèi)容可以根據(jù)需求進(jìn)行改變
class ProductDetailImgBean {
lateinit var img : String
constructor(img : String) {
this.img = img
}
}
3、創(chuàng)建自己的輪播適配器
class ProductDetailBannerAdapter : BannerAdapter<ProductDetailImgBean, ProductDetailBannerAdapter.BannerViewHolder> {
//定義屬性來存放使用該組件的activity對象,因?yàn)榭赡軙婕暗教D(zhuǎn)等操作
lateinit var click : PackagedProductActivity
//構(gòu)造方法
constructor(mDatas: MutableList<ProductDetailImgBean>, click: PackagedProductActivity) : super(mDatas) {
this.click = click
}
//返回一個viewHolder實(shí)例,構(gòu)建根布局焰薄。
override fun onCreateHolder(parent: ViewGroup?, viewType: Int): BannerViewHolder {
//創(chuàng)建一個相對布局,使用代碼編寫布局拿诸。
var rl = RelativeLayout(parent?.context)
var lp = RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.MATCH_PARENT
)
rl.layoutParams = lp
return ProductDetailBannerAdapter.BannerViewHolder(rl)
}
//綁定對象方法,把Bean對象的數(shù)據(jù)綁定到viewHolder的根布局中。
override fun onBindView(
holder: BannerViewHolder?,
data: ProductDetailImgBean?,
position: Int,
size: Int
) {
//父布局relativeLayout
var parent = holder?.rlView
//將bean中的圖片鏈接放入img然后填充滿relativeLayout
var imgView = ImageView(parent?.context)
var lp = ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT
)
imgView.layoutParams = lp
imgView.scaleType = ImageView.ScaleType.FIT_XY
//放入圖片
Glide.with(click).load(data?.img).into(imgView)
parent?.addView(imgView)
//輪播第一張圖片添加VR字樣
if(position == 0){
var vr = TextView(parent?.context)
var lp = RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT
)
lp.addRule(RelativeLayout.CENTER_IN_PARENT) //設(shè)置為布局居中位置
vr.layoutParams = lp
vr.text = "VR"
vr.textSize = 50f
vr.setTextColor(Color.parseColor("#FFFFFFFF"))
//將子布局添加到父布局
parent?.addView(vr)
//且給第一個imgView添加點(diǎn)擊事件塞茅。
imgView.setOnClickListener(View.OnClickListener {
click.jump(VRPageActivity::class.java, JumpParameter().put("url", click.currentDetail.vrUrl))
})
}
}
//內(nèi)部類,創(chuàng)建一個viewHolder,內(nèi)部可以定義自己想要的根布局,這里是一個相對布局亩码。
class BannerViewHolder : RecyclerView.ViewHolder {
lateinit var rlView: RelativeLayout
constructor(rlView: RelativeLayout) : super(rlView) {
this.rlView = rlView
}
}
}
4、在activity中進(jìn)行操作野瘦。
//綁定圖片輪播
fun bindFunctionBannerData(wholeBannerList : MutableList<String>) {
//創(chuàng)建Bean對象列表
var imageList = mutableListOf<ProductDetailImgBean>()
for(item in wholeBannerList){
imageList.add(ProductDetailImgBean(item))
} //通過setAdapter放入自己寫好的自定義適配器
banner.addBannerLifecycleObserver(this).setAdapter(ProductDetailBannerAdapter(imageList,this))
.setIndicator(RoundLinesIndicator(me),false).start()
}