2

Estou tentando exibir imagens da web em uma ListView, mas elas aparecem fora de ordem, nas linhas erradas e mudam de posição a cada atualização da Activity.

Activity:

public class ListarProdutosActivity extends Activity {
    DataBaseHandler db = new DataBaseHandler(this);
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        String[] from = new String[] {
            DataBaseHandler.KEY_PRODUTOS_DESCRICAO, DataBaseHandler.KEY_PRODUTOS_VALOR, DataBaseHandler.KEY_PRODUTOS_IMAGE
        };
        int[] to = {
            R.id.txtDescricao, R.id.txtValor, R.id.logo
        };
        Cursor cursor = db.listarProdutos();

        @SuppressWarnings("deprecation")
        SimpleCursorAdapter adapter = new SimpleCursorAdapter(this, R.layout.list_produtos, cursor, from, to);

        ListView dataList = (ListView) findViewById(R.id.list);
        dataList.setAdapter(adapter);

        adapter.setViewBinder(new SimpleCursorAdapter.ViewBinder() {
            /** Binds the Cursor column defined by the specified index to the specified view */
            public boolean setViewValue(View view, final Cursor cursor, final int columnIndex) {
                final ImageView imgView = (ImageView) view.findViewById(R.id.logo);

                if (view.getId() == R.id.logo) {
                    new Thread(new Runnable() {
                        @Override
                        public void run() {
                            try {
                                Log.v("aviso", "image");
                                Drawable image = getImagem(cursor.getString(columnIndex));

                                imgView.setImageDrawable(image);
                            } catch (Exception e) {
                                // TODO Auto-generated catch block
                                e.printStackTrace();
                            }
                        }
                    }).start();

                    return true;
                }
                return false;
            }
        });
    }

    public Drawable getImagem(String image) throws Exception {
        URL url = new URL(image);

        InputStream is = (InputStream) getObjeto(url);
        Drawable d = Drawable.createFromStream(is, "src");

        return d;
    }

    private Object getObjeto(URL url) throws MalformedURLException, IOException {
        Object content = url.getContent();
        return content;
    }
}

Ou se alguém souber um jeito melhor de fazer isso, eu agradeço as sugestões.

1
  • Opa, siga esse exemplo: androidexample.com/… Aqui ele cria um holder que salva o estado da view naquela posição, e ainda garante a fluidez da lista. Commented 21/10/2014 às 14:25

1 Resposta 1

4

Existem bibliotecas que fazem o load de imagens síncrona ou assincronamente,salvam a imagem em cache e/ou em disco para economizar a banda e abstraem essa parte da codificação.

Dê uma olhada nesse Projeto:

https://github.com/nostra13/Android-Universal-Image-Loader

EDIT

Melhorando um pouco a resposta:

O Android Universal Image Loader é uma biblioteca que abstrai toda a parte de download de imagem, pode ser realizada de forma síncrona e assíncrona. No seu código, ficaria algo do tipo:

public class ListarProdutosActivity extends Activity {
    DataBaseHandler db = new DataBaseHandler(this);
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        // Configuração default do Image Loader
        ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(this).build();
        ImageLoader.getInstance().init(config);

        String[] from = new String[] {
            DataBaseHandler.KEY_PRODUTOS_DESCRICAO, DataBaseHandler.KEY_PRODUTOS_VALOR, DataBaseHandler.KEY_PRODUTOS_IMAGE
        };
        int[] to = {
            R.id.txtDescricao, R.id.txtValor, R.id.logo
        };
        Cursor cursor = db.listarProdutos();

        @SuppressWarnings("deprecation")
        SimpleCursorAdapter adapter = new SimpleCursorAdapter(this, R.layout.list_produtos, cursor, from, to);

        ListView dataList = (ListView) findViewById(R.id.list);
        dataList.setAdapter(adapter);

        adapter.setViewBinder(new SimpleCursorAdapter.ViewBinder() {
            /** Binds the Cursor column defined by the specified index to the specified view */
            public boolean setViewValue(View view, final Cursor cursor, final int columnIndex) {
                final ImageView imgView = (ImageView) view.findViewById(R.id.logo);

                if (view.getId() == R.id.logo) {
                   //Acredito que a URL seja obtida assim e a mesma deve ser enviada como string
                   URL url = new URL(cursor.getString(columnIndex));
                   //Aqui o ImageLoader fica responsável por obter a imagem na internet
                   ImageLoader.displayImage(url.toString() , imgView);
                    return true;
                }
                return false;
            }
        });
    }

    public Drawable getImagem(String image) throws Exception {
        URL url = new URL(image);

        InputStream is = (InputStream) getObjeto(url);
        Drawable d = Drawable.createFromStream(is, "src");

        return d;
    }

    private Object getObjeto(URL url) throws MalformedURLException, IOException {
        Object content = url.getContent();
        return content;
    }
}

Acredito que esse exemplo básico funcione para o seu caso, depois que você importar a biblioteca para o seu projeto. Se você acessar o link do Universal ImageLoader, verá que existem diversas configurações úteis para sua aplicação! Espero que ajude!

1
  • Sergio, editei minha resposta, espero que ajude! Commented 23/10/2014 às 10:36

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .