RecyclerView and Glide messing up the layout
<p>I am running into a strange issue with the RecyclerView loading images dynamically with Glide. Looks like race condition and I looked at this thread but it did not solve the problem:</p>

<p><a href="https://stackoverflow.com/questions/32706246/recyclerview-adapter-and-glide-same-image-every-4-5-rows">Recyclerview Adapter and Glide - same image every 4-5 rows</a></p>

<p>Here's how it looks like screenshot and the red arrows shows the image glitch, notice that the user name text ALWAYS exist.</p>

<p><a href="https://i.stack.imgur.com/DGPRq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DGPRq.png" alt="enter image description here"></a></p>

<p>The code itself looks pretty straight forward:</p>

<p>RV Adapter:</p>

<pre><code>@Override
public void onBindViewHolder(RecyclerView.ViewHolder viewHolder, int position) {
    int viewType = getItemViewType(position);
    bindSubscribersCell((SubscribersListViewHolder) viewHolder, position);
}
</code></pre>

<p>binding view:</p>

<pre><code>private void bindSubscribersCell(SubscribersListViewHolder holder, int position) {
    SubscribersListRowTypeUser subscriberRow = (SubscribersListRowTypeUser) mItems.get(position);
    String userFullName = SDKUserHelper.MakeFullName(subscriberRow.getUser());
    holder.getUsername().setText(userFullName);
    holder.getUsername().setVisibility(View.VISIBLE);

    CircleImageView userImageView = holder.getAvatarImage();
    Drawable defaultIcon = ContextCompat.getDrawable(
            userImageView.getContext(),
            R.drawable.avatar_guest);
    RecylerViewHelper.loadImageView(
            subscriberRow.getUser().getPhotoUrl(),
            userImageView,
            defaultIcon,
            true);
}
</code></pre>

<p>the image load helper using the same technique described on the thread I mentioned above:</p>

<pre><code>public static void loadImageView(
        String imageUrl,
        ImageView imageView,
        Drawable drawable,
        boolean icon) {
    Context context = imageView.getContext();
    if (imageUrl != null &amp;&amp; !imageUrl.isEmpty()) {
        if (icon) {
            Glide.with(context).using(CloudinaryHelper.getUrlLoaderPresetPOIIcon(context)).
                    load(imageUrl).
                    centerCrop().
                    crossFade().
                    into(imageView);
        } else {
            Glide.with(context).
                    load(imageUrl).
                    crossFade().
                    into(imageView);
        }
    } else {
        Glide.clear(imageView);
        imageView.setImageDrawable(drawable);
    }
}
</code></pre>

<p>the inner layout of the cell:</p>

<pre><code>&lt;RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"&gt;

    &lt;de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/user_avatar"
        android:layout_width="wrap_content"
        android:layout_height="@dimen/splash_icon_height"
        android:layout_centerVertical="true"
        android:src="@drawable/avatar_guest" /&gt;

    &lt;TextView
        android:id="@+id/user_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginEnd="40dp"
        android:layout_toEndOf="@+id/user_avatar"
        android:ellipsize="end"
        android:gravity="center"
        android:visibility="gone"
        android:maxLines="1"
        android:text=""
        android:textSize="14sp" /&gt;

    &lt;ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_centerVertical="true"
        android:layout_marginEnd="20dp"
        android:src="@drawable/arrow_forward_gray" /&gt;

&lt;/RelativeLayout&gt;
</code></pre>

<p>the wrapper class to fetch the layout controls:</p>

<pre><code>public class SubscribersListViewHolder extends RecyclerView.ViewHolder {
    final private CircleImageView mAvatarImage;
    final private TextView mUsername;
    final private View mViewHolder;

    public SubscribersListViewHolder(View itemView) {
        super(itemView);
        mViewHolder = itemView;
        mUsername = (TextView) itemView.findViewById(R.id.user_name);
        assert mUsername != null;
        mAvatarImage = (CircleImageView) itemView.findViewById(R.id.user_avatar);
        assert mAvatarImage != null;
    }

    public TextView getUsername() { return mUsername; }
    public CircleImageView getAvatarImage() { return mAvatarImage; }
    public View getViewHolder() { return mViewHolder; }
}
</code></pre>

<p>If anyone can spot the race condition, I really appreciate.</p>

<p>thank you!</p>