Using Fresco with StaggeredGridLayoutManager cause moving items

Question

Here is the issues on github

I want to make a gallery with using Fresco and recyclerview.

But when I notifyDataSetChange() and then scroll to the top of the list that I can see the items are moving. Like this.

What I have tried:

• I have tried to solve it by using recyclerview.setItemAnimator(null) and holder.pic.setLayoutParams(). None of them have worked.

• I found an issue which is similar to mine, but I still have no idea of the problem.

Here is my key code: MyAdapter

public class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.ViewHolder> {


private List<ImageModel> mItems;
Context mContext;
private WindowManager windowManager;
private int itemWidth;

public MyRecyclerAdapter(Context context,List<ImageModel> objects,int gap) {
    mContext = context;
    mItems = objects;
    windowManager=(WindowManager)context.getSystemService(Context.WINDOW_SERVICE);
    itemWidth=(windowManager.getDefaultDisplay().getWidth()-gaps*2)/2
}

static class ViewHolder extends RecyclerView.ViewHolder{
    private  ImageView picture;
    private  TextView mTextView;
    private  View rootView;
    public ViewHolder(View itemView) {
        super(itemView);
        rootView = itemView;
        picture =(ImageView)itemView.findViewById(R.id.image);
        mTextView =(TextView)itemView.findViewById(R.id.title);
    }
}

@Override
public int getItemCount() {

    return mItems.size();
}



 @Override
public void onBindViewHolder(ViewHolder holder, int position,Picture picture) {
    holder.mTextView.setText(picture.getTitle());
    ViewGroup.LayoutParams params = (ViewGroup.LayoutParams)holder.picture.getLayoutParams();
    float ratio = picture.getHeight()/picture.getWidth();
    int width=itemWidth;
    int height=(int)(width * ratio);
    params.height = height;
    holder.picture.setLayoutParams(params);
    ImageRequest request = ImageRequestBuilder.newBuilderWithSource(Uri.parse(picture.getPath()))
        .setResizeOptions(new ResizeOptions(width, height))
        .build();

    PipelineDraweeController controller = Fresco.newDraweeControllerBuilder()
        .setOldController(holder.picture.getController())
        .setImageRequest(request)
        .build();
    holder.picture.setController(controller);
}


@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int arg1) {
    LayoutInflater inflater =    
            (LayoutInflater) mContext.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
    View convertView = inflater.inflate(R.layout.item, parent, false);
    return new ViewHolder(convertView);

}

}

My item layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fresco="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.facebook.drawee.view.SimpleDraweeView
            android:id="@+id/image"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            fresco:actualImageScaleType="fitXY"
            fresco:placeholderImage="@mipmap/default_image"
            fresco:actualImageScaleType="fitXY"
            fresco:roundAsCircle="false"
            fresco:roundedCornerRadius="1dp"
            fresco:roundTopLeft="true"
            fresco:roundTopRight="false"
            fresco:roundBottomLeft="false"
            fresco:roundBottomRight="true"
            fresco:roundingBorderWidth="2dp"
            />
        <TextView
            android:id="@+id/title"
            android:layout_width="match_parent"
            android:layout_height="28dp"
            android:textSize="14dp"
            android:textColor="#ffffff"
            android:layout_below="@+id/fresco_image"
            android:gravity="center"
            android:background="#ffffff"/>
    </RelativeLayout>
</RelativeLayout>

The above is inflated into the following:

<android.support.v7.widget.RecyclerView
    android:id="@+id/view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="none">
</RelativeLayout>

I want to get help:

1. Why does the item of recyclerview always move when I scroll to the top or am loading more?

2. How to solve this problem? Can you show me the keycode or sample here?