ImageView height too large in recyclerview with use of StaggeredGridLayoutManager [Android/Kotlin]

Question

It Working in fine in old project which is written in java

When same things written in kotlin its not working...

Problem RecyclerView Item Height Too Large

lateinit var mImageProcessedRecyclerViewAdapater:ImageProcessedRecyclerViewAdapater
lateinit var mImageContainerAfterProcess: RecyclerView

//initializing adapter and itemdecoration

    mImageContainerAfterProcess= findViewById(R.id.ImageContainerAfterProcess)

    mImageContainerAfterProcess.addItemDecoration(RecyclerViewItemDecoration(16))

    mImageContainerAfterProcess.layoutManager=StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL)

    mImageContainerAfterProcess.adapter=mImageProcessedRecyclerViewAdapater

item view xml file

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

<ImageView
    android:id="@+id/processedImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="2dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Activity Layout File which contains recyclerview

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".activitis.ImageProcess">

    // layout height and width is match_constraint 
    <android.support.v7.widget.RecyclerView
        android:id="@+id/ImageContainerAfterProcess"
        android:layout_width="0dp"
        android:layout_height="0dp"
        tools:listitem="@layout/processd_image_item_view"
        app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>
</android.support.constraint.ConstraintLayout>

i cant find out what i am doing wrong

output capture via layout inspector

My Old Project output

Answer 1

wrap_content does not behave in a similar way with constraint layout. To achieve what you want you will need to add below code to your ImageView and set its width and height to 0dp

app:layout_constraintWidth_default="wrap"
app:layout_constraintHeight_default="wrap"

Answer 2

your image view should be like this

   <ImageView
    android:id="@+id/processedImage"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:padding="2dp"
    android:scaleType="fitXY"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

Answer 3

Try to adding this to your processedImage ImageView.

android:scaleType="centerCrop"
android:adjustViewBounds="true"
//use centerCrop to fill staggered view or centerInside to avoid cropping.

Answer 4

My Out put is

  android:scaleType="fitXY"

All Code is Here Layout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp">

<com.google.android.material.card.MaterialCardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    app:cardCornerRadius="4dp"
    app:cardElevation="2dp">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="5dp">

        <ImageView
            android:id="@+id/image_preview"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="fitXY"
            android:src="@mipmap/ic_launcher" />

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/image_preview"
            android:layout_marginTop="10dp"
            android:text="Name"
            android:textColor="#000" />
    </RelativeLayout>
</com.google.android.material.card.MaterialCardView>

and Code is

recyclerView = (RecyclerView) view.findViewById(R.id.recycler_view);
    StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL);
    layoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
    layoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_MOVE_ITEMS_BETWEEN_SPANS);
    recyclerView.setLayoutManager(layoutManager);
    recyclerView.setHasFixedSize(true);