Zapobieganie wyświetlaniu RecyclerView przy poprzedniej zawartości podczas przewijania

Question

Mam widok RecyclerView z opcją GridLinearLayout i niestandardową kartą. Zawartość każdego elementu to zdjęcie pobrane za pomocą json i przetwarzanie go.

Zasadniczo jest siatka zdjęć.

Wszystko działa prawie bez zarzutu, ale jednak podczas przewijania zawartości i ponownego wznawiania wyświetla poprzednie widoki każdego elementu przez mniej niż sekundę, a następnie ponownie wyświetla odpowiedni obraz.

Co mogę zrobić, aby temu zapobiec? Z góry dziękuję za wszelką pomoc i/lub wskazówki, które możesz podać.

Jest to kod adapter:

package jahirfiquitiva.project.adapters; 

import android.content.Context; 
import android.graphics.Bitmap; 
import android.support.v7.graphics.Palette; 
import android.support.v7.widget.RecyclerView; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.view.animation.Animation; 
import android.view.animation.AnimationUtils; 
import android.widget.ImageView; 
import android.widget.LinearLayout; 
import android.widget.ProgressBar; 
import android.widget.TextView; 

import jahirfiquitiva.project.activities.WallpapersActivity; 
import com.koushikdutta.async.future.FutureCallback; 
import com.koushikdutta.ion.Ion; 

import java.util.ArrayList; 
import java.util.HashMap; 
import java.util.Map; 
import java.util.WeakHashMap; 

import jahirfiquitiva.project.R; 

public class WallpapersAdapter extends RecyclerView.Adapter<WallpapersAdapter.WallsHolder> { 

    public interface ClickListener { 
     void onClick(WallsHolder view, int index, boolean longClick); 
    } 

    private ArrayList<HashMap<String, String>> data; 
    private final Context context; 
    private boolean usePalette = true; 
    private final ClickListener mCallback; 
    private final Map<String, Palette> mPaletteCache = new WeakHashMap<>(); 

    public WallpapersAdapter(Context context, ClickListener callback) { 
     this.context = context; 
     this.data = new ArrayList<>(); 
     this.mCallback = callback; 
    } 

    public void setData(ArrayList<HashMap<String, String>> data) { 
     this.data = data; 
     notifyDataSetChanged(); 
    } 

    @Override 
    public WallsHolder onCreateViewHolder(ViewGroup parent, int viewType) { 
     LayoutInflater inflater = LayoutInflater.from(context); 
     return new WallsHolder(inflater.inflate(R.layout.wallpaper_item, parent, false)); 
    } 

    @Override 
    public void onBindViewHolder(final WallsHolder holder, int position) { 
     Animation anim = AnimationUtils.loadAnimation(context, android.R.anim.fade_in); 
     HashMap<String, String> jsondata = data.get(position); 

     holder.name.setText(jsondata.get(WallpapersActivity.NAME)); 
     final String wallurl = jsondata.get(WallpapersActivity.WALL); 
     holder.wall.startAnimation(anim); 
     holder.wall.setTag(wallurl); 

     Ion.with(context) 
       .load(wallurl) 
       .asBitmap() 
       .setCallback(new FutureCallback<Bitmap>() { 
        @Override 
        public void onCompleted(Exception e, Bitmap result) { 
         holder.progressBar.setVisibility(View.GONE); 
         if (e != null) { 
          e.printStackTrace(); 
         } else if (holder.wall.getTag() != null && holder.wall.getTag().equals(wallurl)) { 
          holder.wall.setImageBitmap(result); 
          if (usePalette) { 
           Palette p; 
           if (mPaletteCache.containsKey(wallurl)) { 
            p = mPaletteCache.get(wallurl); 
           } else { 
            p = new Palette.Builder(result).generate(); 
            mPaletteCache.put(wallurl, p); 
           } 
           if (p != null) { 
            Palette.Swatch wallSwatch = p.getVibrantSwatch(); 
            if (wallSwatch != null) { 
             holder.titleBg.setBackgroundColor(wallSwatch.getRgb()); 
             holder.titleBg.setAlpha(1); 
             holder.name.setTextColor(wallSwatch.getTitleTextColor()); 
             holder.name.setAlpha(1); 
            } 
           } 
          } 
         } 
        } 
       }); 
    } 

    @Override 
    public int getItemCount() { 
     return data.size(); 
    } 

    public class WallsHolder extends RecyclerView.ViewHolder implements View.OnClickListener, View.OnLongClickListener { 

     public final View view; 
     public final ImageView wall; 
     public final TextView name; 
     public final ProgressBar progressBar; 
     public final LinearLayout titleBg; 

     WallsHolder(View v) { 
      super(v); 
      view = v; 
      wall = (ImageView) v.findViewById(R.id.wall); 
      name = (TextView) v.findViewById(R.id.name); 
      progressBar = (ProgressBar) v.findViewById(R.id.progress); 
      titleBg = (LinearLayout) v.findViewById(R.id.titlebg); 

      view.setOnClickListener(this); 
      view.setOnLongClickListener(this); 
     } 

     @Override 
     public void onClick(View v) { 
      int index = getLayoutPosition(); 
      if (mCallback != null) 
       mCallback.onClick(this, index, false); 
     } 

     @Override 
     public boolean onLongClick(View v) { 
      int index = getLayoutPosition(); 
      if (mCallback != null) 
       mCallback.onClick(this, index, true); 
      return false; 
     } 
    } 
} 

Answer 1

Jak sama nazwa wskazuje RecyclerView przetwarza poglądy do optymalizacji pamięci tak wyświetla zawartość poprzedniego widoku. Ponieważ ładujesz obraz z Internetu, wczytanie obrazu zajmuje niewiele czasu, aby można było zobaczyć zawartość poprzedniego obrazu. Możesz wykonać jedną z następujących czynności.

1) Ustawianie domyślnego obrazu z zasobu lokalnego przed załadowaniem rzeczywisty obraz, korzystnie mały rozmiar obrazu w celu zachowania memory.something jak ten

//load default image first     
holder.wall.setImageResource(R.id.your_default_image_resource); 
//load actual image 
Ion.with(context) 
      .load(wallurl) 
    .asBitmap() 
    .setCallback(new FutureCallback<Bitmap>() { 
     @Override 
     public void onCompleted(Exception e, Bitmap result) { 
      holder.progressBar.setVisibility(View.GONE); 
      if (e != null) { 
       e.printStackTrace(); 
      } else if (holder.wall.getTag() != null && holder.wall.getTag().equals(wallurl)) { 
       holder.wall.setImageBitmap(result); 
       if (usePalette) { 
        Palette p; 
        if (mPaletteCache.containsKey(wallurl)) { 
         p = mPaletteCache.get(wallurl); 
        } else { 
         p = new Palette.Builder(result).generate(); 
         mPaletteCache.put(wallurl, p); 
        } 
        if (p != null) { 
         Palette.Swatch wallSwatch = p.getVibrantSwatch(); 
         if (wallSwatch != null) { 
          holder.titleBg.setBackgroundColor(wallSwatch.getRgb()); 
          holder.titleBg.setAlpha(1); 
          holder.name.setTextColor(wallSwatch.getTitleTextColor()); 
          holder.name.setAlpha(1); 
         } 
        } 
       } 
      } 
     } 
    }); 

2) Ustaw widoczność GONE/INVISIBLE ImageView przed załadowaniem i spraw, aby był ponownie WIDOCZNY po załadowaniu obrazu.

//hide the imageview 
holder.wall.setVisibility(View.INVISIBLE); 
Ion.with(context) 
      .load(wallurl) 
    .asBitmap() 
    .setCallback(new FutureCallback<Bitmap>() { 
     @Override 
     public void onCompleted(Exception e, Bitmap result) { 
      holder.progressBar.setVisibility(View.GONE); 
      if (e != null) { 
       e.printStackTrace(); 
      } else if (holder.wall.getTag() != null && holder.wall.getTag().equals(wallurl)) { 
       //show the imageview and set bitmap 
       holder.wall.setVisibility(View.VISIBLE); 
       holder.wall.setImageBitmap(result); 
       if (usePalette) { 
        Palette p; 
        if (mPaletteCache.containsKey(wallurl)) { 
         p = mPaletteCache.get(wallurl); 
        } else { 
         p = new Palette.Builder(result).generate(); 
         mPaletteCache.put(wallurl, p); 
        } 
        if (p != null) { 
         Palette.Swatch wallSwatch = p.getVibrantSwatch(); 
         if (wallSwatch != null) { 
          holder.titleBg.setBackgroundColor(wallSwatch.getRgb()); 
          holder.titleBg.setAlpha(1); 
          holder.name.setTextColor(wallSwatch.getTitleTextColor()); 
          holder.name.setAlpha(1); 
         } 
        } 
       } 
      } 
     } 
    }); 

Answer 2

myślę, że należy dodać uchwyt miejsce tak:

Ion.with(context).load("http://example.com/image.png") 
    .withBitmap() 
    .placeholder(R.drawable.placeholder_image) 
    .error(R.drawable.error_image) 
    .intoImageView(imageView); 

lub ustawić domyślny obraz na początku.

holder.wall.setImageResource(R.drawable.placeholder_image); 

Answer 3

Zastąpić onViewRecycled (VH holder), aby ustawić obraz na wartość null.

Jak to:

public void onViewRecycled (VH holder) { 

    holder.wall.setImageBitmap(null); 
}