Setting an image in ListView item using SimpleCursorAdapter and ViewBinder

Question

Is there a way I could set an image to an ImageView inside a ListView? In this, I am using a SimpleCursorAdapter to display all the fields and using a ViewBinder to set the image bitmap to the ImageView. The image is downloaded using an AsyncTask. The code that I have written is provided below:

    private void updateTimelineUI() {
        Cursor data = dbHelper.query(Constants.TABLE_NAME, null, null);
        if (data.moveToFirst()) {
            adapter = new SimpleCursorAdapter(this, R.layout.tweet_row, data, new String[] {Constants.CREATED_TIME, Constants.USERNAME, Constants.PROFILE_IMAGE, Constants.TWEET}, new int[] {R.id.time, R.id.username, R.id.userImageView, R.id.tweetMessage});
            SimpleCursorAdapter.ViewBinder viewBinder = new SimpleCursorAdapter.ViewBinder() {
                public boolean setViewValue(View view, Cursor cursor, int columnIndex) {
                    if(view != null && view.getId() != R.id.userImageView) {
                        return false;
                    }
                String imageUrlString = cursor.getString(columnIndex);
                String username = cursor.getString(cursor.getColumnIndex(Constants.USERNAME));
                String path = getDir("images", MODE_PRIVATE).getAbsolutePath() + "/" + username + ".png";
                ImageDownloader downloader = new ImageDownloader();
                downloader.setImageUrlString(imageUrlString);
                downloader.setImageView(view);
                downloader.setFilePath(path);
                downloader.execute(imageUrlString);
                return true;
                }
            };
            int index = data.getColumnIndex(Constants.PROFILE_IMAGE);
            //Log.d(Constants.TAG, "" + index);
            adapter.setViewBinder(viewBinder);
            viewBinder.setViewValue(userImageView, data, index);
            timelineList.setAdapter(adapter);
        }
    }

Is there a way to set the image to the correct row with this method?

With the code that I currently have, the images are downloaded successfully. However, the images are being set randomly.

score 2 · Answer 1 · answered Nov 26 '13 at 19:29

I created a custom class that inherits from SimpleCursorAdapter, like Serdar Dogruyol mentions. Inside this custom class I @Override bindView. Inside bindView I call the super, then get a handle to my ImageView using view.findViewById, with view being one of the parameters passed into bindView.

score 2 · Accepted Answer · answered Nov 14 '11 at 09:54

2

You should make your own adapter which shall inherit from SimpleCursorAdapter and therefore you can make your own ListView item with your custom design and set a custom layout for it in which you can add whatever Ui element that you want including ImageView

answered Nov 14 '11 at 09:54

Serdar Dogruyol

5,147
3
24
32

So there is no other way other than writing my own adapter? I am able to set the image to the imageView but the image keeps randomly changing so I was wondering if anything could be done with the current code. – Vivek Nov 14 '11 at 10:05
1

The point is that if you dont make your own adapter while you are scrolling the list the listItem wouldnt know what and which picture to render and that's why it'll render different images thus leading to changing images for every scrolling.That is why you need to implement your own adapter and keep track of your items in every ListItem. – Serdar Dogruyol Nov 14 '11 at 10:09

Setting an image in ListView item using SimpleCursorAdapter and ViewBinder

2 Answers2