android - 延迟下载图片到 gridView

Question

在我的应用程序中，我需要从 url 下载大量图片并将它们显示在 gridView 中。 (可以在 1-200 张图片之间)。我不想一次下载所有图片。我读到了延迟下载，我的问题是:我可以只获取 Json 的一部分，在不同的线程中下载图片，并且只有当用户向下滚动 gridView 时，我才会继续Json 的其他部分，等等？

编辑:你好。我想在此 gridView 中实现多选，但我很难在适配器的 getView() 方法中实现代码。这是我正在使用的示例:example .如何将此代码组合到我的 getView() 方法中:

public View getView(int position, View convertView, ViewGroup parent) {
        CheckableLayout l;
        ImageView i;

        if (convertView == null) {
            i = new ImageView(Grid3.this);
            i.setScaleType(ImageView.ScaleType.FIT_CENTER);
            i.setLayoutParams(new ViewGroup.LayoutParams(50, 50));
            l = new CheckableLayout(Grid3.this);
            l.setLayoutParams(new GridView.LayoutParams(GridView.LayoutParams.WRAP_CONTENT,
                    GridView.LayoutParams.WRAP_CONTENT));
            l.addView(i);
        } else {
            l = (CheckableLayout) convertView;
            i = (ImageView) l.getChildAt(0);
        }

        ResolveInfo info = mApps.get(position);
        i.setImageDrawable(info.activityInfo.loadIcon(getPackageManager()));

        return l;
    }


public class CheckableLayout extends FrameLayout implements Checkable {
    private boolean mChecked;

    public CheckableLayout(Context context) {
        super(context);
    }

    public void setChecked(boolean checked) {
        mChecked = checked;
        setBackgroundDrawable(checked ?
                getResources().getDrawable(R.drawable.blue)
                : null);
    }

    public boolean isChecked() {
        return mChecked;
    }

    public void toggle() {
        setChecked(!mChecked);
    }

}

我的 getView() 代码:

public View getView(int position, View convertView, ViewGroup parent) {
    // TODO Auto-generated method stub
    ViewHolder holder;
    View vi = convertView;

    if(convertView == null) {
        vi = inflater.inflate(com.egedsoft.instaprint.R.layout.item_clickable, null);
        holder = new ViewHolder();
        holder.imgPhoto = (ImageView)vi.findViewById(com.egedsoft.instaprint.R.id.imageClickable);
        vi.setTag(holder);

    } else {
        holder = (ViewHolder) vi.getTag();
    }


    if (!arrayUrls.get(position).getThumbnailUrl().isEmpty()){
        imageLoader.DisplayImage(arrayUrls.get(position).getThumbnailUrl(), holder.imgPhoto);
    }


    return vi;
}

Answer 1

这就是我在 Activity 中获取多张照片的方式。您可以使用它的一部分来满足您的逻辑。我用它来从相册中获取 Facebook 图片。所以我的需求(我假设)与您的需求不同。但同样，该逻辑可能对您有用。

注意:这会很长。 ;-)

这些是通过 ACtivity 使用的全局声明:

// HOLD THE URL TO MAKE THE API CALL TO
private String URL;

// STORE THE PAGING URL
private String pagingURL;

// FLAG FOR CURRENT PAGE
int current_page = 1;

// BOOLEAN TO CHECK IF NEW FEEDS ARE LOADING
Boolean loadingMore = true;

Boolean stopLoadingData = false;

这是获取初始图像集的代码块:

private class getPhotosData extends AsyncTask<Void, Void, Void> {

    @Override
    protected Void doInBackground(Void... arg0) {

        // CHANGE THE LOADING MORE STATUS TO PREVENT DUPLICATE CALLS FOR
        // MORE DATA WHILE LOADING A BATCH
        loadingMore = true;

        // SET THE INITIAL URL TO GET THE FIRST LOT OF ALBUMS
        URL = "https://graph.facebook.com/" + initialAlbumID
                + "/photos&access_token="
                + Utility.mFacebook.getAccessToken() + "?limit=10";

        try {

            HttpClient hc = new DefaultHttpClient();
            HttpGet get = new HttpGet(URL);
            HttpResponse rp = hc.execute(get);

            if (rp.getStatusLine().getStatusCode() == HttpStatus.SC_OK) {
                String queryAlbums = EntityUtils.toString(rp.getEntity());

                JSONObject JOTemp = new JSONObject(queryAlbums);

                JSONArray JAPhotos = JOTemp.getJSONArray("data");

                // IN MY CODE, I GET THE NEXT PAGE LINK HERE

                getPhotos photos;

                for (int i = 0; i < JAPhotos.length(); i++) {
                    JSONObject JOPhotos = JAPhotos.getJSONObject(i);
                    // Log.e("INDIVIDUAL ALBUMS", JOPhotos.toString());

                    if (JOPhotos.has("link")) {

                        photos = new getPhotos();

                        // GET THE ALBUM ID
                        if (JOPhotos.has("id")) {
                            photos.setPhotoID(JOPhotos.getString("id"));
                        } else {
                            photos.setPhotoID(null);
                        }

                        // GET THE ALBUM NAME
                        if (JOPhotos.has("name")) {
                            photos.setPhotoName(JOPhotos.getString("name"));
                        } else {
                            photos.setPhotoName(null);
                        }

                        // GET THE ALBUM COVER PHOTO
                        if (JOPhotos.has("picture")) {
                            photos.setPhotoPicture(JOPhotos
                                    .getString("picture"));
                        } else {
                            photos.setPhotoPicture(null);
                        }

                        // GET THE PHOTO'S SOURCE
                        if (JOPhotos.has("source")) {
                            photos.setPhotoSource(JOPhotos
                                    .getString("source"));
                        } else {
                            photos.setPhotoSource(null);
                        }

                        arrPhotos.add(photos);
                    }
                }
            }
        } catch (Exception e) {
            e.printStackTrace();
        }

        return null;
    }

    @Override
    protected void onPostExecute(Void result) {

        // SET THE ADAPTER TO THE GRIDVIEW
        gridOfPhotos.setAdapter(adapter);

        // CHANGE THE LOADING MORE STATUS
        loadingMore = false;
    }

}

这是为了检测用户何时滚动到末尾并获取一组新图像:

// ONSCROLLLISTENER
gridOfPhotos.setOnScrollListener(new OnScrollListener() {

    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {

    }

    @Override
    public void onScroll(AbsListView view, int firstVisibleItem,
            int visibleItemCount, int totalItemCount) {
        int lastInScreen = firstVisibleItem + visibleItemCount;
        if ((lastInScreen == totalItemCount) && !(loadingMore)) {

            if (stopLoadingData == false) {
                // FETCH THE NEXT BATCH OF FEEDS
                new loadMorePhotos().execute();
            }

        }
    }
});

最后，这就是我获取下一组图像的方式:

private class loadMorePhotos extends AsyncTask<Void, Void, Void> {

    @Override
    protected Void doInBackground(Void... arg0) {

        // SET LOADING MORE "TRUE"
        loadingMore = true;

        // INCREMENT CURRENT PAGE
        current_page += 1;

        // Next page request
        URL = pagingURL;

        try {

            HttpClient hc = new DefaultHttpClient();
            HttpGet get = new HttpGet(URL);
            HttpResponse rp = hc.execute(get);

            if (rp.getStatusLine().getStatusCode() == HttpStatus.SC_OK) {
                String queryAlbums = EntityUtils.toString(rp.getEntity());
                // Log.e("PAGED RESULT", queryAlbums);

                JSONObject JOTemp = new JSONObject(queryAlbums);

                JSONArray JAPhotos = JOTemp.getJSONArray("data");

                // IN MY CODE, I GET THE NEXT PAGE LINK HERE

                getPhotos photos;

                for (int i = 0; i < JAPhotos.length(); i++) {
                    JSONObject JOPhotos = JAPhotos.getJSONObject(i);
                    // Log.e("INDIVIDUAL ALBUMS", JOPhotos.toString());

                    if (JOPhotos.has("link")) {

                        photos = new getPhotos();

                        // GET THE ALBUM ID
                        if (JOPhotos.has("id")) {
                            photos.setPhotoID(JOPhotos.getString("id"));
                        } else {
                            photos.setPhotoID(null);
                        }

                        // GET THE ALBUM NAME
                        if (JOPhotos.has("name")) {
                            photos.setPhotoName(JOPhotos.getString("name"));
                        } else {
                            photos.setPhotoName(null);
                        }

                        // GET THE ALBUM COVER PHOTO
                        if (JOPhotos.has("picture")) {
                            photos.setPhotoPicture(JOPhotos
                                    .getString("picture"));
                        } else {
                            photos.setPhotoPicture(null);
                        }

                        // GET THE ALBUM'S PHOTO COUNT
                        if (JOPhotos.has("source")) {
                            photos.setPhotoSource(JOPhotos
                                    .getString("source"));
                        } else {
                            photos.setPhotoSource(null);
                        }

                        arrPhotos.add(photos);
                    }
                }
            }
        } catch (Exception e) {
            e.printStackTrace();
        }

        return null;
    }

    @Override
    protected void onPostExecute(Void result) {

        // get listview current position - used to maintain scroll position
        int currentPosition = gridOfPhotos.getFirstVisiblePosition();

        // APPEND NEW DATA TO THE ARRAYLIST AND SET THE ADAPTER TO THE
        // LISTVIEW
        adapter = new PhotosAdapter(Photos.this, arrPhotos);
        gridOfPhotos.setAdapter(adapter);

        // Setting new scroll position
        gridOfPhotos.setSelection(currentPosition + 1);

        // SET LOADINGMORE "FALSE" AFTER ADDING NEW FEEDS TO THE EXISTING
        // LIST
        loadingMore = false;
    }

}

这是SET 和GET 从上述查询中收集的数据的辅助类:

public class getPhotos {

    String PhotoID;

    String PhotoName;

    String PhotoPicture;

    String PhotoSource;

    // SET THE PHOTO ID
    public void setPhotoID(String PhotoID)  {
        this.PhotoID = PhotoID;
    }

    // GET THE PHOTO ID
    public String getPhotoID()  {
        return PhotoID;
    }

    // SET THE PHOTO NAME
    public void setPhotoName(String PhotoName)  {
        this.PhotoName = PhotoName;
    }

    // GET THE PHOTO NAME
    public String getPhotoName()    {
        return PhotoName;
    }

    // SET THE PHOTO PICTURE
    public void setPhotoPicture(String PhotoPicture)    {
        this.PhotoPicture = PhotoPicture;
    }

    // GET THE PHOTO PICTURE
    public String getPhotoPicture() {
        return PhotoPicture;
    }

    // SET THE PHOTO SOURCE
    public void setPhotoSource(String PhotoSource)  {
        this.PhotoSource = PhotoSource;
    }

    // GET THE PHOTO SOURCE
    public String getPhotoSource()  {
        return PhotoSource;
    }
}

如果您还需要适配器代码，请告诉我。我用 Fedor's Lazy Loading适配器中的方法。

呸。希望这有帮助。如果您有进一步的问题，请随时提问。 :-)

编辑:添加适配器代码:

public class PhotosAdapter extends BaseAdapter {

    private Activity activity;

    ArrayList<getPhotos> arrayPhotos;

    private static LayoutInflater inflater = null;
    ImageLoader imageLoader; 

    public PhotosAdapter(Activity a, ArrayList<getPhotos> arrPhotos) {

        activity = a;

        arrayPhotos = arrPhotos;

        inflater = (LayoutInflater)activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        imageLoader = new ImageLoader(activity.getApplicationContext());
    }

    public int getCount() {
        return arrayPhotos.size();
    }

    public Object getItem(int position) {
        return arrayPhotos.get(position);
    }

    public long getItemId(int position) {
        return position;
    }

    public View getView(final int position, View convertView, ViewGroup parent) {

        ViewHolder holder;

        View vi = convertView;
        if(convertView == null) {
            vi = inflater.inflate(R.layout.photos_item, null);

            holder = new ViewHolder();

            holder.imgPhoto = (ImageView)vi.findViewById(R.id.grid_item_image);

            vi.setTag(holder);
          } else {
            holder = (ViewHolder) vi.getTag();
        }


        if (arrayPhotos.get(position).getPhotoPicture() != null){
            imageLoader.DisplayImage(arrayPhotos.get(position).getPhotoPicture(), holder.imgPhoto);
        }
        return vi;
    }

    static class ViewHolder {
        ImageView imgPhoto;

    }
}

编辑:添加了加载时显示进度的步骤:

将 ProgressBar 添加到您的 XML，其中 GridView 就在它的正下方。如果它引起任何问题，请尝试使用重量。

<LinearLayout
    android:id="@+id/linlaProgressBar"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="horizontal" >

    <ProgressBar
        style="@style/Spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="2dp" />
</LinearLayout>

在您的 Java 中，将 Linearlayout linlaProgressBar 声明为 Global 并将其转换到 onCreate() 并将其可见性设置为 linlaProgressBar.setVisibility(View.GONE );

然后在 onPreExecute() 中像这样使用它:

@Override
protected void onPreExecute() {
    // SHOW THE BOTTOM PROGRESS BAR (SPINNER) WHILE LOADING MORE PHOTOS
    linlaProgressBar.setVisibility(View.VISIBLE);
}

最后在 onPostExecute()

中添加

// HIDE THE BOTTOM PROGRESS BAR (SPINNER) AFTER LOADING MORE ALBUMS
linlaProgressBar.setVisibility(View.GONE);