阿里VLayout学习笔记(Kotlin)

阿里VLayout学习笔记(Kotlin)

---

VLayout中LayoutHelper分类（辅助Adapter实现RecyclerView的Item各种类型的布局方式）

LinearLayoutHelper: 线性布局
GridLayoutHelper: Grid布局， 支持横向的colspan
FixLayoutHelper: 固定布局，始终在屏幕固定位置显示
ScrollFixLayoutHelper: 固定布局，但之后当页面滑动到该图片区域才显示, 可以用来做返回顶部或其他书签等
FloatLayoutHelper: 浮动布局，可以固定显示在屏幕上，但用户可以拖拽其位置
ColumnLayoutHelper: 栏格布局，都布局在一排，可以配置不同列之间的宽度比值
SingleLayoutHelper: 通栏布局，只会显示一个组件View
OnePlusNLayoutHelper: 一拖N布局，可以配置1-5个子元素
StickyLayoutHelper: stikcy布局， 可以配置吸顶或者吸底
StaggeredGridLayoutHelper: 瀑布流布局，可配置间隔高度/宽度
新建Helper的方法详见VLayout

第一步：设置依赖

在项目app->build.gradle->dependencies中添加如下依赖
注意：使用过程中可能存在AnimatorCompatHelper.java找不到的情况,原因可能是当前编译使用的support-v4包中不存在该类(例如26.0.1)
解决方案一：在项目中新建android.support.v4.animation包，并将…\sdk\sources\android-25\android\support\v4\animation路径(在SDK安装路径下搜索AnimatorCompatHelper.java得到的路径)下的AnimatorCompatHelper.java复制到新建的包中
解决方案二：使用com.android.support:recyclerview-v7和com.android.support:support-v4最新的依赖包

compile ('com.alibaba.android:vlayout:1.2.8@aar') {
	transitive = true
}

第二步: 为RecyclerView设置回收复用池大小

如果一屏内相同类型的 ItemView 个数比较多，需要设置一个合适的大小，防止来回滚动时重新创建 ItemView

        val viewPool = RecyclerView.RecycledViewPool()
        rv.setRecycledViewPool(viewPool)
        //参数一：itemView类型ID  参数二：最大回收复用ItemView数(设置1：全部重建，设置10：屏幕最多保留10个相同ItemView不重建)
        viewPool.setMaxRecycledViews(0, 10)

第二步: 初始化RecyclerView

方法一：通过DelegateAdapter初始化RecyclerView

        //参数一：上下文   参数二：布局方向
        val layoutManager = VirtualLayoutManager(mContext, VirtualLayoutManager.VERTICAL)
        rv.setLayoutManager(layoutManager)
        //参数一：布局管理器  参数二：是否所有子adapter共享Item布局(当hasConsistItemType=true的时候，不论是不是属于同一个子adapter，相同类型的item都能复用。表示它们共享一个类型。 当hasConsistItemType=false的时候，不同子adapter之间的类型不共享)
        val delegateAdapter = DelegateAdapter(layoutManager, true)
        val adapters = ArrayList<DelegateAdapter.Adapter<RecyclerView.ViewHolder>>
        //MyAdapter是继承DelegateAdapter.Adapter的实例适配器，详见BaseVLayoutDelegateAdapter
        adapters.add(MyAdapter(floatLayoutHelper))
         ...
        adapters.add(MyAdapter(stickyLayoutHelper))
        //设置子adapter集合
        delegateAdapter.setAdapters(adapters)
        //为RecyclerView设置adapter
        rv.adapter = delegateAdapter

方法二：通过VirtualLayoutAdapter初始化RecyclerView

 //参数一：上下文   参数二：布局方向
val layoutManager = VirtualLayoutManager(mContext, VirtualLayoutManager.VERTICAL) rv.setLayoutManager(layoutManager)
val helpers = LinkedList<LayoutHelper>()
helpers.add(stickyLayoutHelper)
...
helpers.add(linearLayoutHelper)
//Adapter是继承VirtualLayoutAdapter的实例适配器 详见 BaseVLayoutVirtualLayoutAdapter
val adapter = Adapter(layoutManager, helpers)
rv.adapter = adapter

最后一步添加忽略

-keepattributes InnerClasses
-keep class com.alibaba.android.vlayout.ExposeLinearLayoutManagerEx { *; }
-keep class android.support.v7.widget.RecyclerView$LayoutParams { *; }
-keep class android.support.v7.widget.RecyclerView$ViewHolder { *; }
-keep class android.support.v7.widget.ChildHelper { *; }
-keep class android.support.v7.widget.ChildHelper$Bucket { *; }
-keep class android.support.v7.widget.RecyclerView$LayoutManager { *; }

VLayout工具类

object VLayoutHelper {

    fun initRecyclerView(rv: RecyclerView,
                         @OrientationMode orientation: Int,
                         hasConsistItemType: Boolean,
                         adapters: List<DelegateAdapter.Adapter<RecyclerView.ViewHolder>>) {
        val layoutManager = VirtualLayoutManager(MyAPP.getInstance(), orientation)
        rv.setLayoutManager(layoutManager)
        val delegateAdapter = DelegateAdapter(layoutManager, hasConsistItemType)
        delegateAdapter.setAdapters(adapters as List<DelegateAdapter.Adapter<RecyclerView.ViewHolder>>?)
        rv.adapter = delegateAdapter
    }

    fun initRecyclerView(rv: RecyclerView, @OrientationMode orientation: Int, hasConsistItemType: Boolean, adapter: VirtualLayoutAdapter<RecyclerView.ViewHolder>) {
        val layoutManager = VirtualLayoutManager(MyAPP.getInstance(), orientation)
        rv.setLayoutManager(layoutManager)
        rv.adapter = adapter
    }

    fun setViewPool(rv: RecyclerView, viewType: Int, max: Int) {
        val viewPool = RecyclerView.RecycledViewPool()
        rv.setRecycledViewPool(viewPool)
        viewPool.setMaxRecycledViews(viewType, max)
    }

    /**
     * 获取线性布局Helper
     */
    fun getLinearLayoutHelper(count: Int, dividerHeight: Int): LinearLayoutHelper {
        val linearLayoutHelper = LinearLayoutHelper()
        //线性布局的Item条目数
        linearLayoutHelper.itemCount = count
        linearLayoutHelper.setDividerHeight(dividerHeight)
        return linearLayoutHelper
    }

    fun getLinearLayoutHelper(@DimenRes dividerHeightID: Int): LinearLayoutHelper {
        return getLinearLayoutHelper(0, Resources.getSystem().getDimensionPixelOffset(dividerHeightID))
    }

    /**
     * 获取网格布局
     */
    fun getGridLayoutHelper(spanCount: Int, isAutoExpand: Boolean): GridLayoutHelper {
        return getGridLayoutHelper(spanCount, isAutoExpand, 0, null, null)
    }

    fun getGridLayoutHelper(spanCount: Int, position: ((Int) -> Int)?): GridLayoutHelper {
        return getGridLayoutHelper(spanCount, false, 0, null, position)
    }

    fun getGridLayoutHelper(spanCount: Int, itemCount: Int, position: ((Int) -> Int)?): GridLayoutHelper {
        return VLayoutHelper.getGridLayoutHelper(spanCount, false, itemCount, null, 0, 0, position)
    }

    fun getGridLayoutHelper(spanCount: Int, isAutoExpand: Boolean, itemCount: Int, weights: FloatArray?,
                            position: ((Int) -> Int)?): GridLayoutHelper {
        return VLayoutHelper.getGridLayoutHelper(spanCount, isAutoExpand, itemCount, weights, 0, 0, position)
    }

    fun getGridLayoutHelper(spanCount: Int, isAutoExpand: Boolean, itemCount: Int, weights: FloatArray?, gap: Int,
                            position: ((Int) -> Int)?): GridLayoutHelper {
        return VLayoutHelper.getGridLayoutHelper(spanCount, isAutoExpand, itemCount, weights, gap, gap, position)
    }

    fun getGridLayoutHelper(spanCount: Int, isAutoExpand: Boolean, itemCount: Int, weights: FloatArray?,
                            vGap: Int, hGap: Int, position: ((Int) -> Int)?): GridLayoutHelper {
        var spanSL: GridLayoutHelper.SpanSizeLookup? = null
        if (null != position) {
            spanSL = object : GridLayoutHelper.SpanSizeLookup() {
                override fun getSpanSize(position: Int): Int {
                    return position(position)
                }
            }
        }
        //网格布局列数
        val gridLayoutHelper = GridLayoutHelper(spanCount)
        //是否自动补全布局(当其设置为true时，如果一行的Item总占用列数小于网格列数，那么Item两头的间距将均匀拉伸使之填满一行)
        gridLayoutHelper.setAutoExpand(isAutoExpand)
         //网格布局的Item条目数
        gridLayoutHelper.itemCount = itemCount
        //设置每列的权重(表示每列占一行的多大宽度，最大100f，weights的size不能大于网格列数，其值得和不能大于100f)
        gridLayoutHelper.setWeights(weights)
        //设置Item的水平间距
        gridLayoutHelper.hGap = hGap
        //设置Item的垂直间距
        gridLayoutHelper.vGap = vGap
          //指定条目占用一行的指定列数的规则（指定占用列数不能大于网格的列数）
        gridLayoutHelper.setSpanSizeLookup(spanSL)
        return gridLayoutHelper
    }

    const val TOP_LEFT = 0  //以RecyclerView内左上角为原点
    const val TOP_RIGHT = 1  //以RecyclerView内右上角为原点
    const val BOTTOM_LEFT = 2  //以RecyclerView内左下角为原点
    const val BOTTOM_RIGHT = 3  //以RecyclerView内右下角为原点

    /**
     * 以RecyclerView控件内部为基准
     */
    @IntDef(TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, BOTTOM_RIGHT)
    @Retention(AnnotationRetention.SOURCE)
    private annotation class LayoutHelperAlignType

    /**
     * 获取FixLayout固定布局
     */
  fun getFixLayoutHelper(@LayoutHelperAlignType alignType: Int): FixLayoutHelper {
        return getFixLayoutHelper(alignType, 0, 0)
    }
    
    fun getFixLayoutHelper(@LayoutHelperAlignType alignType: Int, offsetX: Int, offsetY: Int): FixLayoutHelper {
      //参数一：设置对齐方式（原点位置）  参数二：相对原点X轴偏移量  参数三：相对原点Y轴偏移量
        val fixLayoutHelper = FixLayoutHelper(alignType,offsetX, offsetY)
        fixLayoutHelper.itemCount = 1
        return fixLayoutHelper
    }
    
    const val SHOW_ALWAYS = 0
    const val SHOW_ON_ENTER = 1
    const val SHOW_ON_LEAVE = 2

    @IntDef(SHOW_ALWAYS, SHOW_ON_ENTER, SHOW_ON_LEAVE)
    @Retention(AnnotationRetention.SOURCE)
    private annotation class ScrollFixLayoutHelperShowType

    /**
     * 这个也是固定布局，而且使继承自FixLayoutHelper的,这个Helper存在一定bug,有可能设置showType无效
     *- SHOW_ALWAYS：与FixLayoutHelper的行为一致，固定在某个位置；
     *- SHOW_ON_ENTER：默认不显示视图，当页面滚动到这个视图的位置的时候，才显示；
     *- SHOW_ON_LEAVE：默认不显示视图，当页面滚出这个视图的位置的时候显示；
     */
    fun getScrollFixLayoutHelper(@LayoutHelperAlignType alignType: Int, @ScrollFixLayoutHelperShowType showType: Int): ScrollFixLayoutHelper {
        return getScrollFixLayoutHelper(alignType, showType, 0, 0)
    }

    fun getScrollFixLayoutHelper(@LayoutHelperAlignType alignType: Int, @ScrollFixLayoutHelperShowType showType: Int, offsetX: Int, offsetY: Int): ScrollFixLayoutHelper {
        val scrollFixLayoutHelper = ScrollFixLayoutHelper(alignType, offsetX, offsetY)
        scrollFixLayoutHelper.setShowType(showType)
        scrollFixLayoutHelper.itemCount = 1
        return scrollFixLayoutHelper
    }

    /**
     * 获取可拖动布局
     * 设置dragEnable = true可拖动时
     * 当其为adapter的第一个helper时可以直接拖动
     * 否则需要其上一个helper显示后才可以拖动
     */
     fun getFloatLayoutHelper(@LayoutHelperAlignType alignType: Int,dragEnable: Boolean): FloatLayoutHelper {
        return getFloatLayoutHelper(TOP_LEFT,0,0,dragEnable)
    }

    fun getFloatLayoutHelper(posX: Int, posY: Int, dragEnable: Boolean): FloatLayoutHelper {
        return getFloatLayoutHelper(TOP_LEFT,posX,posY,dragEnable)
    }
    
    fun getFloatLayoutHelper(@LayoutHelperAlignType alignType: Int,posX: Int, posY: Int, dragEnable: Boolean): FloatLayoutHelper {
        val floatLayoutHelper = FloatLayoutHelper()
        floatLayoutHelper.setAlignType(alignType)
        //参数一：相对原点X轴偏移量  参数二：相对原点Y轴偏移量
        floatLayoutHelper.setDefaultLocation(posX, posY)
        floatLayoutHelper.setDragEnable(dragEnable)
        floatLayoutHelper.itemCount = 1
        return floatLayoutHelper
    }

    /**
     * 获取栏格布局
     * 只有一行,可通过itemCount设置多列
     */
    fun getColumnLayoutHelper(count: Int, weights: FloatArray?): ColumnLayoutHelper {
        val columnLayoutHelper = ColumnLayoutHelper()
        columnLayoutHelper.setWeights(weights)
        columnLayoutHelper.itemCount = count
        return columnLayoutHelper
    }

    /**
     * 获取通栏布局
     * 只有一个Item
     */
    fun getSingleLayoutHelper(): SingleLayoutHelper {
        val singleLayoutHelper = SingleLayoutHelper()
        return singleLayoutHelper
    }

    /**
     * 获取一拖N布局(最多5个Item)
     * 布局方式详见[GitHub->OnePlusNLayoutHelper.java](https://github.com/alibaba/vlayout/blob/master/vlayout/src/main/java/com/alibaba/android/vlayout/layout/OnePlusNLayoutHelper.java)
     */
    fun getOnePlusNLayoutHelper(count: Int, colWeights: FloatArray?, rowWeight: Float): OnePlusNLayoutHelper {
        val onePlusNLayoutHelper = OnePlusNLayoutHelper()
        onePlusNLayoutHelper.itemCount = if (count > 5) 5 else count
        onePlusNLayoutHelper.setColWeights(colWeights)
        onePlusNLayoutHelper.setRowWeight(rowWeight)
        return onePlusNLayoutHelper
    }
    
    fun getOnePlusNLayoutHelper(count: Int): OnePlusNLayoutHelper {
        return getOnePlusNLayoutHelper(count, null, Float.NaN)
    }
    
    /**
     * 获取一拖N布局(最多7个Item)
     * 布局方式详见[GitHub->OnePlusNLayoutHelperEx.java](https://github.com/alibaba/vlayout/blob/master/vlayout/src/main/java/com/alibaba/android/vlayout/layout/OnePlusNLayoutHelperEx.java)
     */
    fun getOnePlusNLayoutHelperEx(count: Int): OnePlusNLayoutHelperEx {
        return getOnePlusNLayoutHelperEx(count,null, Float.NaN)
    }

    fun getOnePlusNLayoutHelperEx(count: Int, colWeights: FloatArray?, rowWeight: Float): OnePlusNLayoutHelperEx {
        val onePlusNLayoutHelperEx = OnePlusNLayoutHelperEx ()
        onePlusNLayoutHelperEx.itemCount = if (count > 7) 7 else count
        onePlusNLayoutHelperEx.setColWeights(colWeights)
        onePlusNLayoutHelperEx.setRowWeight(rowWeight)
        return onePlusNLayoutHelperEx
    }

    /**
     * 获取吸边布局
     * stickyStart是否吸顶 true = 组件吸在顶部 false = 组件吸在底部
     */
    fun getStickyLayoutHelper(stickyStart: Boolean, offset: Int): StickyLayoutHelper {
        val stickyLayoutHelper = StickyLayoutHelper()
        stickyLayoutHelper.setStickyStart(stickyStart)
        stickyLayoutHelper.setOffset(offset)
        return stickyLayoutHelper
    }

    /**
     * 获取瀑布流布局
     * count item数
     * lane  列数(每行条目数)
     */
    fun getStaggeredGridLayoutHelper(count: Int, lane: Int, gap: Int): StaggeredGridLayoutHelper {
        return getStaggeredGridLayoutHelper(count, lane, gap, 0, 0)
    }

    fun getStaggeredGridLayoutHelper(count: Int, lane: Int, gap: Int, vGap: Int, hGap: Int): StaggeredGridLayoutHelper {
        val staggeredGridLayoutHelper = StaggeredGridLayoutHelper(lane)
        staggeredGridLayoutHelper.itemCount = count
        if (gap > 0) {
            //设置Item的间距
            staggeredGridLayoutHelper.setGap(gap)
        } else {
            //设置Item水平间距
            staggeredGridLayoutHelper.hGap = hGap
            //设置Item垂直间距
            staggeredGridLayoutHelper.vGap = vGap
        }
        return staggeredGridLayoutHelper
    }
}

abstract class BaseVLayoutVirtualLayoutAdapter(private val layoutManager: VirtualLayoutManager, helpers: List<LayoutHelper>) : VirtualLayoutAdapter<BaseVLayoutVirtualLayoutAdapter.BaseViewHolder>(layoutManager) {
    init {
        layoutHelpers = helpers
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): BaseViewHolder {
        return BaseViewHolder(LayoutInflater.from(parent.context).inflate(getCustomHelperLayout(viewType), parent, false))
    }

    abstract fun getCustomHelperLayout(viewType: Int): Int

   /**
     *获取指定布局位置的LayoutHelper
     */
    fun getLayoutHelper(position: Int): LayoutHelper? {
        return layoutManager.findLayoutHelperByPosition(position)
    }
    
    /**
     *获取指定位置的ItemView
     */
    fun getItemView(position: Int): View? {
        return layoutManager.findViewByPosition(position)
    }

    override fun getItemCount(): Int {
        var count = 0
        for (layoutHelper in layoutHelpers){
            count += layoutHelper.itemCount
        }
        return count
    }

    override fun getItemViewType(position: Int): Int {
        return getItemViewType(getLayoutHelper(position)!!, position)
    }

    fun getItemViewType(@Nullable layoutHelper: LayoutHelper, position: Int): Int {
        return super.getItemViewType(position)
    }

    inner class BaseViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView)
}

abstract class BaseVLayoutDelegateAdapter(private val layoutHelper: LayoutHelper) : DelegateAdapter.Adapter<BaseVLayoutDelegateAdapter.BaseViewHolder>() {

    override fun onCreateLayoutHelper(): LayoutHelper {
        return layoutHelper
    }

    fun getLayoutHelper(): LayoutHelper {
        return layoutHelper
    }

    override fun getItemCount(): Int {
        return layoutHelper.itemCount
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): BaseViewHolder {
        @LayoutRes var layoutID = getCustomHelperLayout(layoutHelper, viewType)
        return BaseViewHolder(LayoutInflater.from(parent.context).inflate(layoutID, parent, false))
    }

    fun getCustomHelperLayout(layoutHelper: LayoutHelper, viewType: Int): Int {
        return 0
    }
    
    override fun getItemViewType(position: Int): Int {
        return getViewType(position, layoutHelper)
    }

    fun getViewType(position: Int, layoutHelper: LayoutHelper): Int {
        return super.getItemViewType(position)
    }

    inner class BaseViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView)
}

参考

alibaba/vlayout：https://github.com/alibaba/vlayout