懒惰的图像下载到GridView控件(Lazy download images into gridV

2019-06-18 23:05发布

在我的应用程序需要从网址下载大量的图片,并在GridView显示出来。 (它可以是1-200图片之间)。 我不想下载所有的图片一次。 我读到懒惰下载和我的问题是:我可以得到的JSON只是其中的一部分,下载图片在不同的线程, 并且只有当用户向下滚动 GridView的,我会继续将JSON的其他部分,等等?

编辑:你好再次。 我想实现这个GridView的多选择,我有困难,以实现适配器的getView()方法的代码。 这是我使用的例子: 例 。 我怎么能在我的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:

这是我在我的活动获取多张照片。 你可以使用它的零件适合你的逻辑。 我用它来从相册中获取的Facebook图片。 所以我需要是(我假设),从您的需求不同。 但同样,逻辑可能是使用你的。

注意:这将是漫长的。 ;-)

这些是通过行为使用全局声明:

// 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;
    }

}

这是辅助类来SETGET从上面的查询收集的数据:

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;
    }
}

如果你也想的adapter代码,让我知道。 我用的费多尔的 延迟加载方法的适配器。

唷。 希望所有的这有助于。 如果您还有其他问题,随时问。 :-)

编辑:适配器代码添加:

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;

    }
}

编辑:添加步骤来显示,而加载进度:

一个进度条添加到您的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作为全球然后将其丢在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);


Answer 2:

你可以去看一下使用适配器视图和GridView控件从Android文档。 最重要的是,适配器调用方法getView只通过在屏幕上显示的条目的位置,并要求在不同位置的用户滚动。

最简单的方式做的就是下载上所需要的图像getView适配器与和方法的AsyncTask 。

有一个例子



Answer 3:

从经验谈起,它的棘手实现平滑滚动(和整体响应),同时合理消耗内存。

这将是寻找第一个现有的解决方案,例如一个好主意,从这里开始: ListView中的图像延迟加载

我们结束了一个定制的专有解决方案。 这是一个后台线程队列上的外部存储只有那些仍然可见图像的下载请求,并下载和高速缓存。 当一个新的图像到达时,认为得到通知,并决定何时通知适配器更新。

这也节省了带宽,这在某些情况下非常重要。



Answer 4:

我发现冰人的答案是非常有用的,但我也建议避免使用两个AsyncTasks并且可以让这个容易。

您需要创建一个通用的方法来获取所需的数据,在那里你可以做一个if / else条件(为例):

        movies = fetchMovie.execute(sort).get();
        if (movies == null) {
            movieList = new ArrayList<>();
        } else if (addMovies) {
            movieList.addAll(movies);
        } else {
            movieList = movies;
        }

addMovies是你onScroll方法的布尔值。 在的AsyncTask提供查询网址,瞧当前页面 - 你让你的代码更小:)



文章来源: Lazy download images into gridView