viewpage2 实现中间大两边小

viewpage.png

思路 运用viewpage2 加transformer实现的
首先依赖

    implementation "androidx.viewpager2:viewpager2:1.0.0"

需要注意两个点 一个xml里面的

 android:clipChildren="false"

还有一个是viewpage的setpageMargin在viewpage2里面也要通过transform来实现 但是设置两个transform会被覆盖 所以我把MarginPageTransformer的源码复制出来到自己的Transformer

代码如下:
activity

package com.gtxc.viewpagedemo

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.core.view.marginLeft
import androidx.viewpager2.widget.MarginPageTransformer
import kotlinx.android.synthetic.main.activity_main.*

/**
 * https://stackoverflow.com/questions/56114430/android-viewpager2-setpagemargin-unresolved
 */
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        viewPage.adapter=ViewpageAdapter(this)
        viewPage.setClipChildren(false);
        viewPage.setOffscreenPageLimit(3)
      //  viewPage.setPageTransformer(MarginPageTransformer(40))
        viewPage.setPageTransformer(ViewPageTransform(viewPage))

    }


 fun dip2px(value :Int):Int{
     val scale=resources.displayMetrics.density
     return (value*scale+0.5f).toInt()
 }
}

adapter

package com.gtxc.viewpagedemo

import android.content.Context
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView
import androidx.recyclerview.widget.RecyclerView

class ViewpageAdapter(val context: Context) : RecyclerView.Adapter() {


    override fun getItemCount(): Int {
      return Int.MAX_VALUE
    }


    class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val imageView = itemView.findViewById(R.id.image)
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {

    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        return ViewHolder(LayoutInflater.from(context).inflate(R.layout.item_viewpage,parent,false))
    }

}

xml

item





    

transform

package com.gtxc.viewpagedemo

import android.util.Log
import android.view.View
import androidx.viewpager2.widget.ViewPager2
import kotlin.math.abs

/**
 * https://blog.csdn.net/chen930724/article/details/50466199
 */
class ViewPageTransform(val viewpae2: ViewPager2) : ViewPager2.PageTransformer {
    val default =14/15f
    val default_trans = 3.6f
    override fun transformPage(page: View, position: Float) {
        // MarginPageTransformer的源码
        val offset: Float = 40 * position
        if (viewpae2.getOrientation() == ViewPager2.ORIENTATION_HORIZONTAL) {
            page.translationX = if (isRtl1()) -offset else offset
        } else {
            page.translationY = offset
        }
//        [-∞ , -1)  :
//             表示左边 的View 且已经看不到了
//        [-1 ,   0]  :
//             表示左边的 View ,且可以看见
//        ( 0 ,   1]  :
//             表示右边的VIew , 且可以看见了
//        ( 1 , -∞)  :     
//             表示右边的 View 且已经看不见了

        when {
            position<=-1 -> {
                Log.e(" ViewPageTransform","11111")
                page.scaleX =default
                page.scaleY =default
                page.translationX=default_trans
            }
            position<=0 -> {
                Log.e("ViewPageTransform","22222222")

                page.scaleX = 1+position/15
                page.scaleY = 1+position/15
                page.translationX=(0-position)*default
             //   page.translationY=(0-position)*default

            }
            position<=1 -> {
                Log.e("ViewPageTransform","33333333")

                page.scaleX = 1-position/15
                page.scaleY =  1-position/15
                page.translationX= (0-position)*default

            }
            else -> {
                Log.e("ViewPageTransform","4444444444444")
                page.scaleX = default
                page.scaleY = default
                page.translationX=default_trans

            }
        }

    }


    fun isRtl1(): Boolean {
        return viewpae2.getLayoutDirection() == 1
    }
}