I want to display pictures with variable width and sizes from picasso in android using staggered Grid Layout like below picture

Question

I have used normal staggered gridview like this:

recyclerView.setLayoutManager(new StaggeredGridLayoutManager(3, 1));

And my layout file is:

    android:id="@+id/card_view"

    android:layout_gravity="center"
    android:layout_margin="10dp"
    android:elevation="3dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardUseCompatPadding="true"
    card_view:cardCornerRadius="8dp"
    android:layout_marginBottom="16dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

        <ImageView
            android:id="@+id/bookImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:clickable="true"
            android:scaleType="centerCrop"
             />
       </RelativeLayout>
    </android.support.v7.widget.CardView>

But I am not able to achieve the design given can anyone suggest me some methods where I can resize my image to variable height and width images are coming from web services only. I have used Picasso dependency to display images in recyclerview for that

Thanks