Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
2.8k views
in Technique[技术] by (71.8m points)

android - ViewPager2 "scrolling" from edges of the screen while left and right Views are visible

I am implementing ViewPager2 with displaying left and right Views on screen edges (which I did) and resizing them while scrolling (which I also did). What I am trying to do is make possible to scroll to the next/previous item by dragging from the edge of the screen. What I've done by now looks like this:

screen

When I swipe left/right while holding my finger on main image everything works great, but when I try to do the same on one of those two peeking images it doesn't work. I understand why it might not work, but how to fix it?
Here's my code:

private fun setupViewPager() {
        viewPager2 = findViewById(R.id.viewPagerImageSlider)

        val compositePageTransformer = CompositePageTransformer()
        compositePageTransformer.apply {
            addTransformer(MarginPageTransformer(40))
            addTransformer(ViewPager2.PageTransformer {page, position ->
                val r = 1 - Math.abs(position)
                page.scaleY = 0.85f + r * 0.15f
            })
        }

        viewPager2.apply {

            adapter = SliderAdapter(sliderItems)
            clipToPadding = false
            clipChildren = false
            setPadding(200, 0,200 ,0)
            offscreenPageLimit = adapter!!.itemCount
            getChildAt(0).overScrollMode = RecyclerView.OVER_SCROLL_ALWAYS
            setPageTransformer(compositePageTransformer)
        }
    }

I call it inside onCreate(). List is hardcoded with data before.

These are the Views activity_main and single item for ViewPager:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPagerImageSlider"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
         />
</androidx.constraintlayout.widget.ConstraintLayout>
<?xml version="1.0" encoding="utf-8"?>
<com.makeramen.roundedimageview.RoundedImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/itemSlide"
    android:adjustViewBounds="true"
    app:riv_corner_radius="12dp">

</com.makeramen.roundedimageview.RoundedImageView>

And finally my adapter but I think it is not important:

class SliderAdapter(sliderItems: List<SliderItem>) : RecyclerView.Adapter<SliderViewHolder>() {

    private lateinit var sliderItems: List<SliderItem>


    init {
        this.sliderItems = sliderItems
    }

    inner class SliderViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
        private lateinit var roundedImageView: RoundedImageView

        init {
            roundedImageView = itemView.findViewById(R.id.itemSlide)
        }

        fun setImage(sliderItem: SliderItem) {
            Glide.with(itemView)
                .load(ContextCompat.getDrawable(itemView.context, sliderItem.image))
                .into(roundedImageView)
        }
    }

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

    override fun onBindViewHolder(holder: SliderViewHolder, position: Int) {
        holder.setImage(sliderItems[position])
    }

    override fun getItemCount() = sliderItems.size
}

I've seen somewhere idea of using NestedScrollView, but I don't know how to do this for my case.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
等待大神答复

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...