1.创建viewmodel,其中BindAdapter的方法需要是静态方法,因此需要加@JvmStatic,"app:img"相当于一个自定义属性,后面xml中会用到,当app:img设置的值发生改变的时候会触发这里的setImage方法,这里的BR要使用baseAdapter包里的BR
class ViewPagerItemModel : BaseObservable() { @get:Bindable var imageUrl: String = "" set(value) { field = value notifyPropertyChanged(BR.imageUrl) } companion object { @BindingAdapter("app:img") @JvmStatic fun setImage(view: ImageView, img: String) { Glide.with(view.context).load(img).into(view) } } }
2.创建ViewPager每个Item的布局文件,使用Databinding
<layout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <data> <import type="com.example.databindingdemo.viewpager.viewmodel.ViewPagerItemModel" /> <variable name="itemModel" type="ViewPagerItemModel" /> </data> <ImageView android:id="@+id/iv" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="fitXY" app:img="@{itemModel.imageUrl}" /> </layout>
3.创建Viewpager的适配器,使用databingding后直接在 instantiateItem 中返回binding即可,在isViewFromObject通过binding可以获取根布局
class CommonViewPager<T> : PagerAdapter { var context: Context? = null var list: List<T>? = null var variableId: Int? = null var layoutId: Int? = null var inflater: LayoutInflater? = null constructor( context: Context?, list: List<T>?, variableId: Int?, layoutId: Int?, inflater: LayoutInflater? ) : super() { this.context = context this.list = list this.variableId = variableId this.layoutId = layoutId this.inflater = inflater } override fun isViewFromObject(view: View, `object`: Any): Boolean { val binding: ViewDataBinding = `object` as ViewDataBinding return view == binding.root } override fun getCount(): Int { return list!!.size } override fun instantiateItem(container: ViewGroup, position: Int): Any { //返回databingding绑定的view var binding: ViewDataBinding = DataBindingUtil.inflate(inflater!!, layoutId!!, container, true) binding.setVariable(variableId!!, list!![position]) //这里我们返回binding对象 这个binding对象是isViewFromObject 和destoryItem方法中的引用 return binding } override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) { //移除binding 对应的view var binding: ViewDataBinding = `object` as ViewDataBinding container.removeView(binding.root) } }
4.测试,创建布局,Activity中传入测试数据,通过DataBinding设置adapter
<?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android"> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"> <androidx.viewpager.widget.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="12345" /> </FrameLayout> </layout>
class ViewPagerActivity : AppCompatActivity() { private lateinit var viewpager: ViewPager private val guide = arrayOf( "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576663390033&di=730d0a924db46019357729ad3962ec63&imgtype=jpg&src=http%3A%2F%2Fimg3.imgtn.bdimg.com%2Fit%2Fu%3D3992817968%2C1397776076%26fm%3D214%26gp%3D0.jpg", "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576663366853&di=8cf4396b2368802337fe5a6536bbb009&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F0175cd58b77c62a801219c77391932.png%401280w_1l_2o_100sh.png", "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576663366853&di=62406d7412779ddfabf9690ba2647edc&imgtype=0&src=http%3A%2F%2Fhbimg.b0.upaiyun.com%2Fbc608c9430155517e6fd15f3cc950f625cdb774b16a09-dZ7fZC_fw658", "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576663551403&di=52c6783c3745a97a7aa689e29951c6d0&imgtype=jpg&src=http%3A%2F%2Fimg1.imgtn.bdimg.com%2Fit%2Fu%3D2597631641%2C1350168820%26fm%3D214%26gp%3D0.jpg" ) lateinit var lists: MutableList<ViewPagerItemModel> override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) val binding = DataBindingUtil.setContentView<ActivityViewPagerBinding>(this, R.layout.activity_view_pager) viewpager = binding.viewpager lists = ArrayList() initData() val adapter = CommonViewPager<ViewPagerItemModel>( this, lists, BR.itemModel, R.layout.view_pager_item, layoutInflater ) viewpager.adapter = adapter } private fun initData() { for (i in guide) { val v = ViewPagerItemModel() v.imageUrl = i lists.add(v) } } }
使用Glide加载,因此在Manifest中注册好网络权限,即可测试
效果图如下: