android - एंड्रॉइड में ListView में छवियों की एक सूची कैसे प्रदर्शित करें?




android-image (6)

मैं ListView का उपयोग कर छवियों की एक सूची कैसे प्रदर्शित करूं? मैं रन टाइम पर छवियों को dowloading हूँ। छवियों की कुल संख्या तय नहीं है।


छह साल, यह अभी भी कुछ खोजों के लिए शीर्ष पर है। तब से चीजें बहुत बदल गई हैं। अब डिफैक्टो मानक Volley और नेटवर्क इमेज व्यू का उपयोग करने के लिए कम या ज्यादा है जो आपके लिए भारी उठाने का ख्याल रखता है।

यह मानते हुए कि आपके पास पहले से ही आपके Apaters, Loaders और ListFragments सेटअप ठीक से हैं, यह आधिकारिक Google ट्यूटोरियल बताता है कि छवियों को लोड करने के लिए NetworkImageView का उपयोग कैसे करें। छवियों को पृष्ठभूमि थ्रेड में स्वचालित रूप से लोड किया जाता है और यूआई थ्रेड पर अपडेट किया जाता है। यह कैशिंग का भी समर्थन करता है।


डेटाबेस से डेटा प्राप्त करने के लिए, आप एक SimpleCursorAdapter उपयोग SimpleCursorAdapter

मुझे लगता है कि आप सीधे SimpleCursorAdapter में SimpleCursorAdapter को बाध्य कर सकते हैं - यदि नहीं, तो आप एक कस्टम एडाप्टर क्लास बना सकते हैं जो SimpleCursorAdapter को कस्टम ViewBinder साथ ViewBinder जो ViewBinder को ओवरराइड setViewValue

SimpleCursorAdapter का उपयोग करने के तरीके को देखने के लिए Notepad ट्यूटोरियल देखें।


मैं इस तरह से कुछ शुरू करूंगा (और यदि मेरे कोड में कुछ गड़बड़ है, तो मैं निश्चित रूप से किसी भी टिप्पणी की सराहना करता हूं):

public class ItemsList extends ListActivity {

private ItemsAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.items_list);

    this.adapter = new ItemsAdapter(this, R.layout.items_list_item, ItemManager.getLoadedItems());
    setListAdapter(this.adapter);
}

private class ItemsAdapter extends ArrayAdapter<Item> {

    private Item[] items;

    public ItemsAdapter(Context context, int textViewResourceId, Item[] items) {
        super(context, textViewResourceId, items);
        this.items = items;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View v = convertView;
        if (v == null) {
            LayoutInflater vi = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = vi.inflate(R.layout.items_list_item, null);
        }

        Item it = items[position];
        if (it != null) {
            ImageView iv = (ImageView) v.findViewById(R.id.list_item_image);
            if (iv != null) {
                iv.setImageDrawable(it.getImage());
            }
        }

        return v;
    }
}

@Override
protected void onListItemClick(ListView l, View v, int position, long id) {
    this.adapter.getItem(position).click(this.getApplicationContext());
}
}

जैसे ArrayAdapter को अपने प्रकार के आइटम (अपनी तस्वीरों के बारे में जानकारी रखने) और overriden getView() विधि के साथ getView() , जो सूची के भीतर वस्तुओं के लिए दृश्य तैयार करता है। सूची के अंत में आइटम जोड़ने के लिए ArrayAdapter पर विधि add() भी है।

R.layout.items_list ListView साथ सरल लेआउट है

R.layout.items_list_item सूची में एक आइटम का प्रतिनिधित्व लेआउट है


मैं एक समाधान के साथ आया कि मैं "बैच इमेजडाउनलोडर" कहता हूं जिसने अच्छी तरह से सेवा की है। यहां इसका एक त्वरित सारांश दिया गया है कि इसका उपयोग कैसे किया जाता है:

  • ग्लोबल हैश मैप रखें (आदर्श रूप से आपके एप्लिकेशन ऑब्जेक्ट में) जो ड्रॉइंग ऑब्जेक्ट्स के कैश के रूप में कार्य करता है

  • अपनी सूची एडाप्टर की getView () विधि में, अपनी सूची आइटम में ImageView को पॉप्युलेट करने के लिए कैश से ड्रॉ करने योग्य का उपयोग करें।

  • अपने ListView एडाप्टर में गुजरने, बैचइमेजडाउनलोडर का एक उदाहरण बनाएं

  • प्रत्येक छवि के लिए addUrl () को कॉल करें जिसे लाने / प्रदर्शित करने की आवश्यकता है

  • पूरा होने पर, निष्पादित करें ()। यह एक AsyncTask को निकालता है जो सभी छवियों को प्राप्त करता है, और जैसे ही प्रत्येक छवि को कैश में लाया जाता है और जोड़ा जाता है, यह आपके ListView को रीफ्रेश करता है (NotataDataSetChanged () को सूचित करके)

दृष्टिकोण के निम्नलिखित फायदे हैं:

  • प्रत्येक छवि / दृश्य के लिए अलग थ्रेड की बजाय सभी छवियों को लाने के लिए एक एकल कार्यकर्ता थ्रेड का उपयोग किया जाता है
  • एक बार छवि प्राप्त होने के बाद, इसका उपयोग करने वाली सभी सूची आइटम तुरंत अपडेट हो जाते हैं
  • कोड सीधे आपकी सूची आइटम में छवि दृश्य तक नहीं पहुंचता है - इसके बजाय यह आपकी सूची एडाप्टर पर NotifyDataSetChanged () को कॉल करके एक सूचीदृश्य रीफ्रेश ट्रिगर करता है, और getView () कार्यान्वयन केवल कैश से ड्रॉबल खींचता है और इसे प्रदर्शित करता है। यह ListViews में उपयोग की गई पुनर्नवीनीकरण दृश्य वस्तुओं से जुड़ी समस्याओं से बचाता है।

बैचइमेजडाउनलोडर का स्रोत कोड यहां दिया गया है:

package com.mobrite.androidutils;

import java.io.IOException;
import java.io.InputStream;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import org.apache.http.HttpResponse;
import org.apache.http.client.ClientProtocolException;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.impl.client.DefaultHttpClient;

import android.graphics.drawable.Drawable;
import android.os.AsyncTask;
import android.widget.BaseAdapter;

public class BatchImageDownloader extends AsyncTask<Void, Void, Void> {

    List<String> imgUrls = new ArrayList<String>();
    BaseAdapter adapter;
    HashMap<String, Drawable> imageCache;

    public BatchImageDownloader(BaseAdapter adapter,
            HashMap<String, Drawable> imageCache) {
        this.adapter = adapter;
        this.imageCache = imageCache;
    }

    public void addUrl(String url) {
        imgUrls.add(url);
    }

    @Override
    protected Void doInBackground(Void... params) {
        for (String url : imgUrls) {
            if (!imageCache.containsKey(url)) {
                Drawable bm = downloadImage(url);
                if (null != bm) {
                    imageCache.put(url, bm);
                    publishProgress();
                }
            }
        }
        return null;
    }

    @Override
    protected void onProgressUpdate(Void... values) {
        adapter.notifyDataSetChanged();
    }

    @Override
    protected void onPostExecute(Void result) {
        adapter.notifyDataSetChanged();
    }

    public Drawable downloadImage(String url) {

        DefaultHttpClient httpClient = new DefaultHttpClient();
        HttpGet request = new HttpGet(url);
        try {
            HttpResponse response = httpClient.execute(request);
            InputStream stream = response.getEntity().getContent();
            Drawable drawable = Drawable.createFromStream(stream, "src");
            return drawable;
        } catch (ClientProtocolException e) {
            e.printStackTrace();
            return null;
        } catch (IllegalStateException e) {
            e.printStackTrace();
            return null;
        } catch (IOException e) {
            e.printStackTrace();
            return null;
        }

    }

}

हमें दो लेआउट लागू करने की जरूरत है। सूचीदृश्य की पंक्ति वस्तु रखने के लिए एक सूची सूची और दूसरा पकड़ने के लिए। अपने स्वयं के कस्टम एडाप्टर को लागू करें। आइडिया एक टेक्स्टव्यू और एक छविदृश्य शामिल करना है।

public View getView(int position, View convertView, ViewGroup parent) {
 // TODO Auto-generated method stub
 LayoutInflater inflater = (LayoutInflater) context
 .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 View single_row = inflater.inflate(R.layout.list_row, null,
 true);
 TextView textView = (TextView) single_row.findViewById(R.id.textView);
 ImageView imageView = (ImageView) single_row.findViewById(R.id.imageView);
 textView.setText(color_names[position]);
 imageView.setImageResource(image_id[position]);
 return single_row; 
 }

इसके बाद हम रनटाइम के दौरान गतिशील रूप से छवियों और टेक्स्ट डेटा को शामिल करने के लिए मुख्य गतिविधि में कार्यक्षमता लागू करते हैं। आप कस्टम एडाप्टर के निर्माता को गतिशील रूप से बनाए गए टेक्स्ट सरणी और छवि आईडी सरणी को पारित कर सकते हैं।

Customlistadapter adapter = new Customlistadapter(this, image_id, text_name);

 package studRecords.one;

 import java.util.List;
 import java.util.Vector;

 import android.app.Activity;
 import android.app.ListActivity;
 import android.content.Context;
 import android.content.Intent;
 import android.net.ParseException;
 import android.os.Bundle;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.ArrayAdapter;
 import android.widget.ImageView;
 import android.widget.ListView;
 import android.widget.TextView;



public class studRecords extends ListActivity 
{
static String listName = "";
static String listUsn = "";
static Integer images;
private LayoutInflater layoutx;
private Vector<RowData> listValue;
RowData rd;

static final String[] names = new String[]
{
      "Name (Stud1)", "Name (Stud2)",   
      "Name (Stud3)","Name (Stud4)" 
};

static final String[] usn = new String[]
{
      "1PI08CS016","1PI08CS007","1PI08CS017","1PI08CS047"
};

private Integer[] imgid = 
{
  R.drawable.stud1,R.drawable.stud2,R.drawable.stud3,
  R.drawable.stud4
};

public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.mainlist);

    layoutx = (LayoutInflater) getSystemService(
    Activity.LAYOUT_INFLATER_SERVICE);
    listValue = new Vector<RowData>();
    for(int i=0;i<names.length;i++)
    {
        try
        {
            rd = new RowData(names[i],usn[i],i);
        } 
        catch (ParseException e) 
        {
            e.printStackTrace();
        }
        listValue.add(rd);
    }


   CustomAdapter adapter = new CustomAdapter(this, R.layout.list,
                                     R.id.detail, listValue);
   setListAdapter(adapter);
   getListView().setTextFilterEnabled(true);
}
   public void onListItemClick(ListView parent, View v, int position,long id)
   {            


       listName = names[position];
       listUsn = usn[position];
       images = imgid[position];




       Intent myIntent = new Intent();
       Intent setClassName = myIntent.setClassName("studRecords.one","studRecords.one.nextList");
       startActivity(myIntent);

   }
   private class RowData
   {

       protected String mNames;
       protected String mUsn;
       protected int mId;
       RowData(String title,String detail,int id){
       mId=id;
       mNames = title;
       mUsn = detail;
    }
       @Override
    public String toString()
       {
               return mNames+" "+mUsn+" "+mId;
       }
  }

              private class CustomAdapter extends ArrayAdapter<RowData> 
          {
      public CustomAdapter(Context context, int resource,
      int textViewResourceId, List<RowData> objects)
      {               
            super(context, resource, textViewResourceId, objects);
      }
      @Override
      public View getView(int position, View convertView, ViewGroup parent)
      {   
           ViewHolder holder = null;
           TextView title = null;
           TextView detail = null;
           ImageView i11=null;
           RowData rowData= getItem(position);
           if(null == convertView)
           {
                convertView = layoutx.inflate(R.layout.list, null);
                holder = new ViewHolder(convertView);
                convertView.setTag(holder);
           }
         holder = (ViewHolder) convertView.getTag();
         i11=holder.getImage();
         i11.setImageResource(imgid[rowData.mId]);
         title = holder.gettitle();
         title.setText(rowData.mNames);
         detail = holder.getdetail();
         detail.setText(rowData.mUsn);                                                     

         return convertView;
      }

        private class ViewHolder 
        {
            private View mRow;
            private TextView title = null;
            private TextView detail = null;
            private ImageView i11=null; 
            public ViewHolder(View row)
            {
                    mRow = row;
            }
            public TextView gettitle()
            {
                 if(null == title)
                 {
                     title = (TextView) mRow.findViewById(R.id.title);
                 }
                 return title;
            }     
            public TextView getdetail()
            {
                if(null == detail)
                {
                    detail = (TextView) mRow.findViewById(R.id.detail);
                }
                return detail;
            }
            public ImageView getImage()
            {
                    if(null == i11)
                    {
                        i11 = (ImageView) mRow.findViewById(R.id.img);
                    }
                    return i11;
            }   
        }
   } 
 }

//mainlist.xml

     <?xml version="1.0" encoding="utf-8"?>
             <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                 android:orientation="horizontal"
                 android:layout_width="fill_parent"
                 android:layout_height="fill_parent"
             >
             <ListView
                 android:id="@android:id/list"
                 android:layout_width="fill_parent"
                 android:layout_height="wrap_content"
              />
             </LinearLayout>




android-image