ViewPager2 when set height then swipe not work

Question

Android Studio 3.6

I want to use ViewPager2 to swipe images:

here xml layout:

<androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/waitressCallMainContainer"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include
            android:id="@+id/toolBarContainer"
            layout="@layout/tool_bar"
            android:title='@{@string/articles}'
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/viewPager2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="#bbccaa"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/toolBarContainer" />

here adapter item layout (article_item_tour.xml):

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/imageTourPageMainContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/tourArticleImageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:scaleType="centerCrop"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

here my custom adapter:

class MyAdapter : RecyclerView.Adapter<MyAdapter .ArticleViewHolder>() {
    var articleList: List<Article> = listOf()



    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ArticleViewHolder {
        return ArticleViewHolder(parent)
    }

    override fun onBindViewHolder(holder: MyViewHolder, position: Int) {
        holder.bind(articleList[position], position)
    }

    fun setList(articleList: List<Article>) {
        this.articleList = articleList
        notifyDataSetChanged()
    }

    override fun getItemCount(): Int = articleList.size

    class MyViewHolderconstructor(itemView: View) : RecyclerView.ViewHolder(itemView) {
        constructor(parent: ViewGroup) :
                this(
                    LayoutInflater.from(parent.context).inflate(
                        R.layout.article_item_tour,
                        parent,
                        false
                    )
                )

        fun bind(article: Article, number: Int) {
            Glide.with(itemView.tourArticleImageView.getContext())
                .load("http://www.gravatar.com/avatar/$number?s=200x200&d=identicon")
                .apply(RequestOptions().error(R.drawable.default_image))
                .into(itemView.tourArticleImageView)
        }
    }
}

And here result:

As you can see the ViewPager2 success swipe 2 images. Nice.

but I want to set height of viewpager = 300 dp. I'm not need to show image at whole screen.

So here changes:

 <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/viewPager2"
            android:layout_width="0dp"
            android:layout_height="300dp"
            android:background="#bbccaa"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/toolBarContainer" />

But now images not show. Show only ViewPager2 (green background). And as result no swipe.

remove this line: `app:layout_constraintBottom_toBottomOf="parent"` — Rahul, Nov 25 '19 at 11:47
you need to give only one vertical constraint if you are providing height to some specific value. — Rahul, Nov 25 '19 at 11:48
no way, can you see in the preview pane how much hight is given to ViewPager2? — Rahul, Nov 25 '19 at 11:51
@user6327816 yes in preview pane success show height of ViewPager2 — Alexei, Nov 25 '19 at 11:52
did you gave height to article_item_tour.xml ? android:layout_height="300dp" — Jai Khambhayta, Nov 25 '19 at 12:07
@jaikhambhayta No. But if I set (in xml) height=300 to "imageTourPageMainContainer" then I get error: java.lang.IllegalStateException: Pages must fill the whole ViewPager2 (use match_parent) — Alexei, Nov 25 '19 at 12:13

score 1 · Answer 1 · answered Nov 25 '19 at 12:19

I found solution:

 <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/viewPager2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="#bbccaa"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/toolBarContainer" />

and in article_item_tour_xml

xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/imageTourPageMainContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/tourArticleImageView"
        android:layout_width="0dp"
        android:layout_height="300dp"
        android:scaleType="centerCrop"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

And here result:

ViewPager2 when set height then swipe not work

1 Answers1