Question

我正在开发一个类似于9gag正在做的应用程序。 https://play.google.com/store/apps/details?id=com.ninegag.android.app&hl=en

我已经实现了大部分内容，但是当我运行应用程序时，从互联网上加载的图像不会加载到ImageView中，直到它出现在屏幕上。我知道这是ListView如何与回收工作，但它似乎并不顺利，因为我必须等待每个列表项每次加载其图像在屏幕上显示。

你有什么建议我可以改善这个问题？

我的CustomAdapter类：

public class CustomAdapter extends BaseAdapter implements ResultsListener{
Context context;
Holder holder;
int postItemsLength=0;
ArrayList<PostItem> postItems;
PlaceholderFragment activity;

private static LayoutInflater inflater=null;
public CustomAdapter(PlaceholderFragment activity, ArrayList<PostItem> postItems) {
    // TODO Auto-generated constructor stub
    this.activity=activity;
    this.context=activity.getContext();
    this.postItems = postItems;
    inflater = ( LayoutInflater )context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    Log.d("FOUND","entered constructor");


}

@Override
public int getCount() {
    // TODO Auto-generated method stub
    return postItems.size();
}

@Override
public Object getItem(int position) {
    // TODO Auto-generated method stub
    return position;
}

@Override
public long getItemId(int position) {
    // TODO Auto-generated method stub
    return position;
}

@Override
public void onResultsSucceeded(Bitmap image, int position) {
    holder.img.setImageBitmap(image);
    CustomAdapter.this.notifyDataSetChanged();
    holder.progressBar.setVisibility(View.GONE);
}

public class Holder
{
    TextView tv;
    TextView imgName;
    ImageView img;
    WebView wView;
    TextView likes;
    TextView comments;
    TextView op;
    ProgressBar progressBar;
    FrameLayout webViewLayout;
}



@Override
public View getView(final int position, View convertView, ViewGroup parent) {
    final Holder holder;
    Log.d("FOUND","entered GetView");
    // Check if the item's view is recycled
    if(convertView == null)
    {
        Log.d("FOUND","convertView is not null");
        // The item's view doesn't exist
        // Create the item's view
        LayoutInflater inflater = ((Activity) context).getLayoutInflater();
        convertView = inflater.inflate(R.layout.list_item, parent, false);

        holder = new Holder(); // Create the holder

        holder.tv=(TextView) convertView.findViewById(R.id.titleTextView);
        holder.img=(ImageView) convertView.findViewById(R.id.imageView);
        holder.likes=(TextView) convertView.findViewById(R.id.likeNumTextView);
        holder.comments=(TextView) convertView.findViewById(R.id.commentNumTextView);
        holder.imgName = (TextView) convertView.findViewById(R.id.imageNameTextView);
        holder.op=(TextView) convertView.findViewById(R.id.opTextView);
        holder.webViewLayout = (FrameLayout) convertView.findViewById(R.id.webViewLayout);
        holder.progressBar = (ProgressBar) convertView.findViewById(R.id.progressBar);

        // Store the holder with the view.
        convertView.setTag(holder);
    }
    else
    {
        // The item's view already exist
        // Retrieve the older
        holder = (Holder) convertView.getTag();
        Log.d("FOUND","alreay exists");
    }

    holder.img.setImageResource(R.drawable.empty_img);
    holder.tv.setText(postItems.get(position).getTitle());
    holder.imgName.setText(postItems.get(position).getImageName());
    holder.op.setText(postItems.get(position).getUploader());
    holder.likes.setText(postItems.get(position).getLikeNum()+"");
    holder.comments.setText(postItems.get(position).getCommentNum()+"");

    LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(getDpWidth(), adjustHeight(postItems.get(position).getWidth(), postItems.get(position).getHeight()));
    holder.webViewLayout.setLayoutParams(lp);


    DownloadImageTask dTask = new DownloadImageTask(holder.img);
    dTask.setOnResultsListener(CustomAdapter.this);
    dTask.execute("http://torifi.net/images/" + postItems.get(position).getImageName());

    Log.d("FOUND","entered");
    //holder.likes.setText(likeNum.get(position));
     //    holder.comments.setText(commentNum.get(position));

    /*
    convertView.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO impl

        }
    });
*/
    return convertView;
}

public int getDpWidth()
{
    DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();
    return Math.round(displayMetrics.widthPixels);// / displayMetrics.density);
}

public int adjustHeight (float imageWidth, float imageHeight)
{
    DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();
    float dpHeight = displayMetrics.heightPixels;// / displayMetrics.density;
    float dpWidth = displayMetrics.widthPixels;// / displayMetrics.density;

    return Math.round((imageHeight/imageWidth)*dpWidth);
}

}

Answer 1

使用Glide加载图片，将图片缓存到uri更改之前，并提供非常快速和流畅的加载体验。

您可以像下面的示例一样简单地加载图像。

ImageView imageView = (ImageView) findViewById(R.id.my_image_view);

Glide.with(this).load("image url").into(imageView);

Answer 2

我认为最好的解决方案是分离下载和查看创建。

您知道要在 ListView 中显示的数据，因此请将图像下载到设备上（例如，如此answer中所示的app cache-dir）。您不必急于下载所有 ListView 条目的图像。只需跟踪用户滚动状态并开始下载下几张图片。

初始化ImageView时，将Image-Source设置为本地文件，如answer所示。

在ListView中将图像加载到ListView中，然后它们出现在屏幕上

2 个答案: