Develop Reference

ImageView inside Gridview repeating image when scrolling (using ImageDownloader)

As the title says, I have this problem.
Because I need to retrieve images from the network, I have implemented a solution which is explained here
I will post the Adapter and ImageDownloader code (I have taken the liberty to modify the downloader in order to make the functionality more appropriate to my program).
Adapter method:
#Override
public View getView(int position, View view, ViewGroup parent) {
ViewHolder holder;
if (view == null) {
view = inflater.inflate(R.layout.grid_adapter_camera_layout, parent, false);
holder = new ViewHolder();
holder.progress = (ProgressBar) view.findViewById(R.id.progressBar);
holder.image = (ImageView) view.findViewById(R.id.camera_image);
holder.text = (TextView) view.findViewById(R.id.camera_name);
holder.text.setEllipsize(TextUtils.TruncateAt.END);
holder.text.setLines(2);
view.setTag(holder);
} else {
holder = (ViewHolder) view.getTag();
}
imgDownloader.download(values.get(position).getUrl(), holder.image, holder.progress);
}
And here is the ImageDownloader (I post just the most proper part of the code, if you need further don't hesitate to ask for it).
public void download(String url, ImageView imageView, ProgressBar progress) {
Bitmap bitmap = getBitmapFromCache(url);
if (bitmap != null) {
cancelPotentialDownload(url, imageView);
imageView.setImageBitmap(bitmap);
} else if(cancelPotentialDownload(url, imageView)){
BitmapDownloaderTask task = new BitmapDownloaderTask(imageView, progress);
imageView.setTag(new WeakReference<BitmapDownloaderTask>(task));
task.execute(url);
}
}
private boolean cancelPotentialDownload(String url, ImageView imageView) {
BitmapDownloaderTask bitmapDownloaderTask = getBitmapDownloaderTask(imageView);
if (bitmapDownloaderTask != null) {
String bitmapUrl = bitmapDownloaderTask.url;
if ((bitmapUrl == null) || (!bitmapUrl.equals(url))) {
bitmapDownloaderTask.cancel(true);
} else {
// The same URL is already being downloaded.
return false;
}
}
return true;
}
#SuppressWarnings("unchecked")
private BitmapDownloaderTask getBitmapDownloaderTask(ImageView imageView) {
if (imageView != null && imageView.getTag() != null) {
return ((WeakReference<BitmapDownloaderTask>) imageView.getTag()).get();
}
return null;
}
public class BitmapDownloaderTask extends AsyncTask<String, Void, Bitmap> {
String url;
WeakReference<ImageView> viewReference;
WeakReference<ProgressBar> progressReference;
public BitmapDownloaderTask(ImageView view, ProgressBar progress) {
view.setTag(false);
viewReference = new WeakReference<ImageView>(view);
progressReference = new WeakReference<ProgressBar>(progress);
}
#Override
protected Bitmap doInBackground(String... params) {
url=params[0];
Log.e("DOWNLOAD URL", url);
return downloadBitmap(params[0]);
}
#Override
protected void onPostExecute(Bitmap result) {
if (isCancelled())
result = null;
addBitmapToCache(url, result);
if (viewReference != null) {
ImageView imgView = viewReference.get();
BitmapDownloaderTask bitmapDownloaderTask = getBitmapDownloaderTask(imgView);
if (this == bitmapDownloaderTask) {
if (result != null)
imgView.setImageBitmap(result);
else
imgView.setImageResource(R.drawable.no_signal);
}
}
if (progressReference != null) {
ProgressBar prog = progressReference.get();
if (prog != null)
prog.setVisibility(View.GONE);
}
}
}

I would suggest for u to use a library for the image downloading, picasso does a great job for it. Another thing take a look at this video from dev-bytes. Its about animations but the trick should be the same for downloading images. Those two steps should work, I've done that a few times and it worked perfcetly.

updating of Image Thumbnails using AsyncTask for Android ListView not coming proper

I am getting a big response from the server with data and image url. I need to display them on the List View. Images should be like thumbnails. To make it proper i have customized my Adapter and getting the images using Async Task. Here is my Adapter and Asynctask Code:
public class TalkofTownAdapter extends BaseAdapter{
private LayoutInflater inflater = null;
private Context context = null;
ImageView thumb_image = null;
private ProgressDialog progressbar = null;
ArrayList<String> items;
ArrayList<String> thumb_url;
public TalkofTownAdapter(Context c, ArrayList<String> list, ArrayList<String> thumb)
{
this.context = c;
this.items = list;
this.thumb_url = thumb;
progressbar = new ProgressDialog(c);
Log.d("Testing", "talk of town adapter constructor "+items.size());
inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public int getCount() {
// TODO Auto-generated method stub
return items.size();
}
#Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return position;
}
#Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if (convertView == null) {
convertView = inflater.inflate(R.layout.talkoftown, null);
Log.d("Testing", "before creating holder object");
holder = new ViewHolder();
holder.headlineView = (TextView) convertView.findViewById(R.id.list_title);
holder.duration = (TextView)convertView.findViewById(R.id.duration);
holder.imageView = (ImageView) convertView.findViewById(R.id.list_image_playlist);
Log.d("Testing", "image view created :::::::: ");
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
Log.d("Testing", "text::: "+items.get(position));
holder.headlineView.setText(items.get(position));
Log.d("Testing", "settting the text ");
holder.duration.setText("22/09/1987");
if (holder.imageView != null) {
Log.d("Testing", "getting the image "+thumb_url.get(position));
new ImageDownloaderTask(holder.imageView).execute(thumb_url.get(position));
}
return convertView;
}
static class ViewHolder {
TextView headlineView;
TextView duration;
ImageView imageView;
}
public static Bitmap getBitmapFromURL(String src) {
try {
URL url = new URL(src);
HttpURLConnection connection = (HttpURLConnection) url.openConnection();
connection.setDoInput(true);
connection.connect();
InputStream input = connection.getInputStream();
Bitmap myBitmap = BitmapFactory.decodeStream(input);
Log.d("Testing", "image loaded "+myBitmap);
// myBitmap = Bitmap.createBitmap(100, 50, Config.ARGB_8888);
myBitmap = Bitmap.createScaledBitmap(myBitmap,(int)(myBitmap.getWidth()), (int)(myBitmap.getHeight()), true);
return myBitmap;
} catch (IOException e) {
Log.d("Testing", "exception is getting the image "+e.toString());
e.printStackTrace();
return null;
}
}
public void startProgress()
{
progressbar.setMessage("Please wait");
progressbar.show();
}
public void stopProgress()
{
progressbar.dismiss();
}
class ImageDownloaderTask extends AsyncTask<String, Void, Bitmap> {
private final WeakReference<ImageView> imageViewReference;
public ImageDownloaderTask(ImageView imageView) {
imageViewReference = new WeakReference<ImageView>(imageView);
}
#Override
// Actual download method, run in the task thread
protected Bitmap doInBackground(String... params) {
// params comes from the execute() call: params[0] is the url.
return getBitmapFromURL(params[0]);
}
#Override
// Once the image is downloaded, associates it to the imageView
protected void onPostExecute(Bitmap bitmap) {
if (isCancelled()) {
bitmap = null;
}
if (imageViewReference != null) {
ImageView imageView = imageViewReference.get();
if (imageView != null) {
if (bitmap != null) {
imageView.setImageBitmap(bitmap);
} else {
imageView.setImageDrawable(imageView.getContext().getResources()
.getDrawable(R.drawable.rihanna));
}
}
}
}
}
Now the thumbnails are showing with the default image and then changing with downloaded images. But if i am scrolling down the list view, images are keep on changing and coming duplicates of those that appeared in the rows above that were already scrolled up. So i mean to say here, the images are coming on proper order for the corresponding rows. I know there are lots of tutorials and QA here also. But i have tried lots of solutions and it did not work properly.
Can any one help me on this?

The problem is with you if condition. Just remove the if condition if (holder.imageView != null) { the problem is each and everytime getView will check for your view is null or not and based on that it will execute and inflate the image.
Change your if condition like
if(thumb_url.get(position) !=null)
{
Log.d("Testing", "getting the image "+thumb_url.get(position));
new ImageDownloaderTask(holder.imageView).execute(thumb_url.get(position));
}

Images are repeating in ListView

I have implemented android app which should download images from server and display them in ListView, but very interesting thing occures while images are downloading
As you can see in video pictures which haven't been downloaded yet are represented by those which have been already downloaded. How that can happen? I've thinking about it almost two days.
http://www.youtube.com/watch?v=lxY-HAuJO0o&feature=youtu.be
here is my code of ListView adapter.
public class MoviesAdapter extends ArrayAdapter<ParkCinema> {
private ArrayList<ParkCinema> movieDataItems;
private Activity context;
public MoviesAdapter(Activity context, int textViewResourceId, ArrayList<ParkCinema> movieDataItems) {
super(context, textViewResourceId, movieDataItems);
this.context = context;
this.movieDataItems = movieDataItems;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.movie_data_row, null);
}
ParkCinema movie = movieDataItems.get(position);
if (movie!=null){
ImageView imageView = (ImageView) convertView.findViewById(R.id.movie_thumb_icon);
String url = movie.poster();
if (url!=null) {
Bitmap bitmap = fetchBitmapFromCache(url);
if (bitmap==null) {
new BitmapDownloaderTask(imageView).execute(url);
}
else {
imageView.setImageBitmap(bitmap);
}
}
}
return convertView;
}
private LinkedHashMap<String, Bitmap> bitmapCache = new LinkedHashMap<String, Bitmap>();
private void addBitmapToCache(String url, Bitmap bitmap) {
if (bitmap != null) {
synchronized (bitmapCache) {
bitmapCache.put(url, bitmap);
}
}
}
private Bitmap fetchBitmapFromCache(String url) {
synchronized (bitmapCache) {
final Bitmap bitmap = bitmapCache.get(url);
if (bitmap != null) {
return bitmap;
}
}
return null;
}
private class BitmapDownloaderTask extends AsyncTask<String, Void, Bitmap> {
private String url;
private final WeakReference<ImageView> imageViewReference;
public BitmapDownloaderTask(ImageView imageView) {
imageViewReference = new WeakReference<ImageView>(imageView);
}
#Override
protected Bitmap doInBackground (String... source) {
url = source[0];
Bitmap image;
try{
image = BitmapFactory.decodeStream(new URL(url).openConnection().getInputStream());
return image;
}
catch(Exception e){Log.e("Error", e.getMessage()); e.printStackTrace();}
return null;
}
#Override
protected void onPostExecute(Bitmap bitmap) {
addBitmapToCache(url, bitmap);
imageViewReference.get().setImageBitmap(bitmap);
}
}
}
Edit 3:
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.movie_data_row, null);
}
ParkCinema movie = movieDataItems.get(position);
ImageView imageView = (ImageView) convertView.findViewById(R.id.movie_thumb_icon);
if (movie!=null){
String url = movie.poster();
if (url != null) {
Bitmap bitmap = fetchBitmapFromCache(url);
if (bitmap == null) {
imageView.setImageResource(R.drawable.no_image);
new BitmapDownloaderTask(imageView).execute(url);
}
else {
imageView.setImageBitmap(bitmap);
}
}
else {
imageView.setImageResource(R.drawable.no_image);
}
}
else {
imageView.setImageResource(R.drawable.no_image);
}
return convertView;
}

Aha! I think I may know the issue. Right now, your getView method sets your ImageView like this:
Gets movie object at position
Pulls out the movie's thumbnail url
Using that url, it tries to find the image in the cache
If it finds the image, it sets it
If it can't find the image, it starts an async network request to go get it, and sets it after it gets downloaded.
Your issus arises since ListView reuses its rows' Views. When the first View scrolls off the screen, rather than inflate a new one, ListView passes the now offscreen row's View in as convertView for you to reuse (this is for efficiency).
When your getView gets a convertView that is getting reused, its ImageView has already been set from the row that had it before, so you see the old image from the offscreen row's View. With your current getView process, you check for the new row's image, and it doesn't find it in the cache, it starts a request to download it. While it is downloading, you see the old image until you get the new image.
To fix this, you need to make sure you set every field in the row's View immediately, to make sure you don't have any Views showing stale data. I would suggest you set the ImageView to the default drawable resource (you have set in your R.layout.movie_data_row) while you wait for the network download to get the image.
#Override
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.movie_data_row, null);
}
ParkCinema movie = movieDataItems.get(position);
ImageView imageView = (ImageView) convertView.findViewById(R.id.movie_thumb_icon);
if (movie != null) {
String url = movie.poster();
if (url != null) {
Bitmap bitmap = fetchBitmapFromCache(url);
if (bitmap == null) {
// Set the movie thumbnail to the default icon while we load
// the real image
imageView.setImageResource(R.drawable.movie_thumb_icon);
new BitmapDownloaderTask(imageView).execute(url);
}
else {
// Set the image to the bitmap we get from the cache
imageView.setImageBitmap(bitmap);
}
}
else {
// Set the movie thumbnail to the default icon, since it doesn't
// have a thumbnail URL
imageView.setImageResource(R.drawable.movie_thumb_icon);
}
}
else {
// Set the movie thumbnail to the default icon, since there's no
// movie data for this row
imageView.setImageResource(R.drawable.movie_thumb_icon);
}
-Edit-
Updated to be even more robust, using your drawable. You also have an issue with your BitmapDownloaderTask, it does not handle errors/null. Try adding this as well.
#Override
protected void onPostExecute(Bitmap bitmap) {
addBitmapToCache(url, bitmap);
if (bitmap == null) {
// Set the movie thumbnail to the default icon, since an error occurred while downloading
imageViewReference.get().setImageResource(R.drawable.movie_thumb_icon);
}
else {
imageViewReference.get().setImageBitmap(bitmap);
}
}

i had this issue and implemented lruCache ...i believe you need api 12 and above or use the compatiblity v4 library. lurCache is fast memory but it also has a budget, so if your worried about that you can use a diskcache ...its all described here http://developer.android.com/training/displaying-bitmaps/cache-bitmap.html
I'll now provide my implementation which is a singleton i call from anywhere like this:
//where first is a string and other is a imageview to load
DownloadImageTask.getInstance().loadBitmap(avatarURL, iv_avatar);
here's the ideal code to cache and then call the above in getView of an adapter when retrieving the web image:
public class DownloadImageTask {
private LruCache<String, Bitmap> mMemoryCache;
/* create a singleton class to call this from multiple classes */
private static DownloadImageTask instance = null;
public static DownloadImageTask getInstance() {
if (instance == null) {
instance = new DownloadImageTask();
}
return instance;
}
//lock the constructor from public instances
private DownloadImageTask() {
// Get max available VM memory, exceeding this amount will throw an
// OutOfMemory exception. Stored in kilobytes as LruCache takes an
// int in its constructor.
final int maxMemory = (int) (Runtime.getRuntime().maxMemory() / 1024);
// Use 1/8th of the available memory for this memory cache.
final int cacheSize = maxMemory / 8;
mMemoryCache = new LruCache<String, Bitmap>(cacheSize) {
#Override
protected int sizeOf(String key, Bitmap bitmap) {
// The cache size will be measured in kilobytes rather than
// number of items.
return bitmap.getByteCount() / 1024;
}
};
}
public void loadBitmap(String avatarURL, ImageView imageView) {
final String imageKey = String.valueOf(avatarURL);
final Bitmap bitmap = getBitmapFromMemCache(imageKey);
if (bitmap != null) {
imageView.setImageBitmap(bitmap);
} else {
imageView.setImageResource(R.drawable.ic_launcher);
new DownloadImageTaskViaWeb(imageView).execute(avatarURL);
}
}
private void addBitmapToMemoryCache(String key, Bitmap bitmap) {
if (getBitmapFromMemCache(key) == null) {
mMemoryCache.put(key, bitmap);
}
}
private Bitmap getBitmapFromMemCache(String key) {
return mMemoryCache.get(key);
}
/* a background process that opens a http stream and decodes a web image. */
class DownloadImageTaskViaWeb extends AsyncTask<String, Void, Bitmap> {
ImageView bmImage;
public DownloadImageTaskViaWeb(ImageView bmImage) {
this.bmImage = bmImage;
}
protected Bitmap doInBackground(String... urls) {
String urldisplay = urls[0];
Bitmap mIcon = null;
try {
InputStream in = new java.net.URL(urldisplay).openStream();
mIcon = BitmapFactory.decodeStream(in);
} catch (Exception e) {
Log.e("Error", e.getMessage());
e.printStackTrace();
}
addBitmapToMemoryCache(String.valueOf(urldisplay), mIcon);
return mIcon;
}
/* after decoding we update the view on the mainUI */
protected void onPostExecute(Bitmap result) {
bmImage.setImageBitmap(result);
}
}
}

Views are reused for performance with Adapters. You should use another approch .
You have to have a class holder which reuse your views. In your case you class should be something like this:
public class MoviesAdapter extends ArrayAdapter<ParkCinema> {
private ArrayList<ParkCinema> movieDataItems;
private Activity context;
public MoviesAdapter(Activity context, int textViewResourceId, ArrayList<ParkCinema> movieDataItems) {
super(context, textViewResourceId, movieDataItems);
this.context = context;
this.movieDataItems = movieDataItems;
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
if (convertView == null) {
LayoutInflater vi = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = vi.inflate(R.layout.movie_data_row, null);
holder = new ViewHolder();
holder.imageView = (BarImageView) convertView.findViewById(R.id.movie_thumb_icon);
} else {
holder = (ViewHolder) convertView.getTag();
}
ParkCinema movie = movieDataItems.get(position);
if (movie!=null){
String url = movie.poster();
if (url!=null) {
Bitmap bitmap = fetchBitmapFromCache(url);
if (bitmap==null) {
new BitmapDownloaderTask(imageView).execute(url);
}
else {
imageView.setImageBitmap(bitmap);
}
}
}
return convertView;
}
private LinkedHashMap<String, Bitmap> bitmapCache = new LinkedHashMap<String, Bitmap>();
private void addBitmapToCache(String url, Bitmap bitmap) {
if (bitmap != null) {
synchronized (bitmapCache) {
bitmapCache.put(url, bitmap);
}
}
}
private Bitmap fetchBitmapFromCache(String url) {
synchronized (bitmapCache) {
final Bitmap bitmap = bitmapCache.get(url);
if (bitmap != null) {
return bitmap;
}
}
return null;
public static class ViewHolder {
ImageView imageView;
}
}

I have spent hours trying to figure this one out as well...Thanks to Steven Byle's solution...
Here is my solution to something similar when a user selects an item from a list:
adapter.setSelectedIndex(position);
then in the custom adapter:
public void setSelectedIndex(int ind)
{
selectedIndex = ind;
notifyDataSetChanged();
}
and then finally in the getView method of the adapter:
if(selectedIndex!= -1 && position == selectedIndex)
{
holder.tab.setBackgroundColor(Color.BLACK);
}
else{
holder.tab.setBackgroundColor(Color.DKGRAY);
}
So in conclusion make sure you assign default values

In my case i used Picasso library instead of AsyncTask for downloading image.
enter link description here
Also write if else condition, that is set null to image if url is not available

instead of using the convertview object create a new view each time.
View localView = ((LayoutInflater)parentscreen.getSystemService("layout_inflater")).inflate(R.layout.activity_list_row, null);
By inflating as above.

progress bar freezes for few seconds and then grid view shows

ok im fetching images from server and showing them in a gridview with title ... im using baseadapter for gridview ... everything is working good and fine ... i have just one problem that i need to show a progressdialog when data is fetched from server and populated on the gridview ...
im using AsyncTask right now for showing progress dialog but it freezes for few (like 10) seconds and then gridview shows...
this is my baseadapter class:
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
if (convertView == null) {
convertView = listInflater.inflate(R.layout.grid_adapter_view, null);
holder = new ViewHolder();
holder.gridImg = (ImageView) convertView
.findViewById(R.id.grid_item_image);
holder.gridTitle = (TextView) convertView
.findViewById(R.id.grid_item_label);
convertView.setTag(holder);
} else {
holder = (ViewHolder) convertView.getTag();
}
holder.gridTitle.setText(catItems.get(position).getName());
try {
URL url = new URL(catItems.get(position).getImg());
Bitmap img = BitmapFactory.decodeStream(url.openConnection()
.getInputStream());
holder.gridImg.setImageBitmap(img);
} catch (Exception e) {
// TODO Auto-generated catch block
holder.gridImg.setImageResource(R.drawable.no_image);
e.printStackTrace();
}
return convertView;
}
public class ViewHolder {
ImageView gridImg;
TextView gridTitle;
}
and here is asynctask im using:
mytask = new AsyncTask<Void, Void, Boolean>() {
#Override
protected void onPostExecute(Boolean result) {
// TODO Auto-generated method stub
super.onPostExecute(result);
main_grid.setAdapter(adater);
if (progress.isShowing()) {
progress.dismiss();
}
}
#Override
protected void onPreExecute() {
// TODO Auto-generated method stub
progress.show();
}
#Override
protected Boolean doInBackground(Void... params) {
JSONArray jArray = request.getCategories();
try {
for (int i = 0; i < jArray.length(); i++) {
CategoriesDetail catDetail = new CategoriesDetail();
JSONObject jobj = jArray.getJSONObject(i);
catDetail.setId(jobj.getString("id").toString());
catDetail.setName(jobj.getString("name").toString());
catDetail.setImg(jobj.getString("img").toString());
catDetail.setOrder(jobj.getString("order").toString());
items.add(catDetail);
}
adater = new CatGridAdapter(MainActivity.this, items);
return true;
} catch (Exception e) {
e.printStackTrace();
progress.dismiss();
Toast.makeText(MainActivity.this,
"Error: " + e.getMessage(), Toast.LENGTH_LONG)
.show();
return false;
}
}
};
please tell me where and what im doing wrong ...

You are doing a network operation on the UI thread.
BitmapFactory.decodeStream(url.openConnection().getInputStream());
Take a look at this: http://developer.android.com/training/displaying-bitmaps/process-bitmap.html
EDIT:
Instead of decoding the stream in getView() only set the default image to the gridImg and trigger loadBitmap(catItems.get(position).getImg(), holder.gridImg).
public void loadBitmap(String url, ImageView imageView) {
new BitmapWorkerTask(imageView).execute(url);
}
class BitmapWorkerTask extends AsyncTask<String, Void, Bitmap> {
private final WeakReference<ImageView> imageViewReference;
public BitmapWorkerTask(ImageView imageView) {
// Use a WeakReference to ensure the ImageView can be garbage collected
imageViewReference = new WeakReference<ImageView>(imageView);
}
// Decode image in background.
#Override
protected Bitmap doInBackground(String... params) {
return BitmapFactory.decodeStream(params[0].openConnection().getInputStream());
}
// Once complete, see if ImageView is still around and set bitmap.
#Override
protected void onPostExecute(Bitmap bitmap) {
if (imageViewReference != null && bitmap != null) {
final ImageView imageView = imageViewReference.get();
if (imageView != null) {
imageView.setImageBitmap(bitmap);
}
}
}
}
This is all described in the link above. You should really read it to get a better understanding of threading in android.

GridView + CursorAdapter + AsyncTask load image shifting randomly

I use SimpleCursorAdapter and GridActivity (extended Activity written by me based on ListActivity) to load music albums from MediaStore, and use AsyncTask load each album art .
I tried this in bindView or getView, like this:
new AsyncAlbumArtLoader(viewholder.album_art, mShowFadeAnimation).execute(aid, width, height);
class AsyncAlbumArtLoader:
private class AsyncAlbumArtLoader extends AsyncTask<Object, Void, Bitmap> {
boolean enable_animation = false;
private ImageView imageview;
public AsyncAlbumArtLoader(ImageView imageview, Boolean animation) {
enable_animation = animation;
this.imageview = imageview;
}
#Override
protected void onPreExecute() {
if (enable_animation) {
imageview.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(),
android.R.anim.fade_out));
imageview.setVisibility(View.INVISIBLE);
}
}
#Override
protected Bitmap doInBackground(Object... params) {
return MusicUtils.getCachedArtwork(getApplicationContext(), (Long) params[0],
(Integer) params[1], (Integer) params[2]);
}
#Override
protected void onPostExecute(Bitmap result) {
if (result != null) {
imageview.setImageBitmap(result);
} else {
imageview.setImageResource(R.drawable.albumart_mp_unknown_list);
}
if (enable_animation) {
imageview.setVisibility(View.VISIBLE);
imageview.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(),
android.R.anim.fade_in));
}
}
}
But images shifting between gridview items randomly.
You can see screen record video here.
edited prevent this error by setTag() and getTag() is also no effect.
#Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = super.getView(position, convertView, parent);
mAlbumCursor.moveToPosition(position);
ViewHolder viewholder = (ViewHolder) view.getTag();
String album_name = mAlbumCursor.getString(mAlbumIndex);
if (album_name == null || MediaStore.UNKNOWN_STRING.equals(album_name)) {
viewholder.album_name.setText(R.string.unknown_album_name);
} else {
viewholder.album_name.setText(album_name);
}
String artist_name = mAlbumCursor.getString(mArtistIndex);
if (album_name == null || MediaStore.UNKNOWN_STRING.equals(album_name)) {
viewholder.artist_name.setText(R.string.unknown_artist_name);
} else {
viewholder.artist_name.setText(artist_name);
}
// We don't actually need the path to the thumbnail file,
// we just use it to see if there is album art or not
long aid = mAlbumCursor.getLong(mAlbumIdIndex);
int width = getResources().getDimensionPixelSize(R.dimen.gridview_bitmap_width);
int height = getResources().getDimensionPixelSize(R.dimen.gridview_bitmap_height);
viewholder.album_art.setTag(aid);
new AsyncAlbumArtLoader(viewholder.album_art, mShowFadeAnimation, aid, width, height).execute();
long currentalbumid = MusicUtils.getCurrentAlbumId();
if (currentalbumid == aid) {
viewholder.album_name.setCompoundDrawablesWithIntrinsicBounds(0, 0,
R.drawable.ic_indicator_nowplaying_small, 0);
} else {
viewholder.album_name.setCompoundDrawablesWithIntrinsicBounds(0, 0, 0, 0);
}
return view;
}
// FIXME image loaded some times incorrect
private class AsyncAlbumArtLoader extends AsyncTask<Object, Void, Bitmap> {
boolean enable_animation = false;
private ImageView imageview;
private long album_id;
private int width,height;
public AsyncAlbumArtLoader(ImageView imageview, Boolean animation, long album_id, int width, int height) {
enable_animation = animation;
this.imageview = imageview;
this.album_id = album_id;
this.width = width;
this.height = height;
}
#Override
protected void onPreExecute() {
if (imageview.getTag() == null || (Long)imageview.getTag() != album_id) {
return;
}
if (enable_animation) {
imageview.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(),
android.R.anim.fade_out));
imageview.setVisibility(View.INVISIBLE);
}
}
#Override
protected Bitmap doInBackground(Object... params) {
if (imageview.getTag() == null || (Long)imageview.getTag() != album_id) {
return null;
}
return MusicUtils.getCachedArtwork(getApplicationContext(), album_id,
width, height);
}
#Override
protected void onPostExecute(Bitmap result) {
if (imageview.getTag() == null || (Long)imageview.getTag() != album_id) {
return;
}
if (result != null) {
imageview.setImageBitmap(result);
} else {
imageview.setImageResource(R.drawable.albumart_mp_unknown_list);
}
if (enable_animation) {
imageview.setVisibility(View.VISIBLE);
imageview.startAnimation(AnimationUtils.loadAnimation(getApplicationContext(),
android.R.anim.fade_in));
}
}
}

The Problem is, that the AsyncTask don't know für which ImageView they where started, respectivley they overlap.
To prevent this you need to do the following:
In your getView Method (before calling the AsyncTask-Constructor you need so set a Tag to your ImageView: myImageView.setTag(object). The best choice is, if you use the object from which getView gets its information. In you case i think it is the ArrayList with the Album-Information. Let' say myImageView.setTag(myAlbumArray.get(position)) THE TAG MUST BE UNIQUE
Now add a new String 'tag' to your AsyncTask class and add this.tag = imageview.getTag().toString().
Now finally add the test in your onPostExecute:
if (imageview.getTag().toString().equals(tag)) {
// you got the right imageView, *your PostExecute Code* }
else {// wrong one, do nothing
}