Android listview only loads images on the current screen (solve the problem of loading choppy items when the list slides)

Source: Internet
Author: User

Recently, the listview page displays images and text (the parsed text content is downloaded first, and the image is loaded asynchronously). After you click the next page, the text is loaded and slide down immediately, at this time, the background uses the thread pool to asynchronously download images. I have 20 images on each page, that is, 20 images. This will cause the listview to slide and slow down!

This is what users don't want to see. I have referred to Netease news and e-market applications and found that they only load images on the screen, but it is unrealistic not to load, so I also made one. I'm a cainiao, and I admit that although I don't necessarily have the same experience with them, it does solve the choppy phenomenon at the moment of page turning.

Because I have not found any related articles on the internet, I hope it will be useful to my friends ~

The following is the relevant code (the page is not displayed ):

Java code

  1. /**
  2. * List rolling listener
  3. */
  4. Listview. setonscrolllistener (New onscrolllistener (){
  5. @ Override
  6. Public void onscrollstatechanged (abslistview view,
    Int scrollstate ){
  7. // Todo auto-generated method stub
  8. // Asynchronously load the image
  9. If (scrollstate = onscrolllistener. scroll_state_idle) {// The image is loaded when the list stops scrolling.
  10. Pageimgload (_ start_index, _ end_index );
  11. }
  12. }
  13. @ Override
  14. Public void onscroll (abslistview view,
    Int firstvisibleitem,
  15. Int visibleitemcount,
    Int totalitemcount ){
  16. // Todo auto-generated method stub
  17. // Set the start index and end index displayed on the current screen
  18. _ Start_index = firstvisibleitem;
  19. _ End_index = firstvisibleitem + visibleitemcount;
  20. If (_ end_index> = totalitemcount ){
  21. _ End_index = totalitemcount-1;
  22. }
  23. }
  24. });
/*** List rolling listener */listview. setonscrolllistener (New onscrolllistener () {@ overridepublic void onscrollstatechanged (abslistview view, int scrollstate) {// todo auto-generated method stub // asynchronously load image if (scrollstate = onscrolllistener. objects) {// when the list stops scrolling, The pageimgload (_ start_index, _ end_index) ;}@ overridepublic void onscroll (abslistview view, int firstvisibleitem, int visibleitemcount, int totalitemcount) {// todo auto-generated method stub // set the start index and end index_start_index = firstvisibleitem; _ end_index = firstvisibleitem + visibleitemcount; If (_ end_index> = totalitemcount) {_ end_index = totalitemcount-1 ;}}});
Java code

  1. /**
  2. * Only images from start_index to end_index are loaded.
  3. * @ Param start_index
  4. * @ Param end_index
  5. */
  6. Private void pageimgload (INT start_index,
    Int end_index ){
  7. For (; start_index <end_index; start_index ++ ){
  8. Hashmap <string, Object> curr_item = Adapter. getitem (start_index );
  9. If (curr_item.get (constant. news_icon_url )! =
    Null
  10. & Curr_item.get (constant. news_icon) = NULL ){
  11. LoadImage (curr_item );
  12. }
  13. }
  14. }
/*** Load only images from start_index to end_index * @ Param start_index * @ Param end_index */private void pageimgload (INT start_index, int end_index) {for (; start_index <end_index; start_index ++) {hashmap <string, Object> curr_item = adapter. getitem (start_index); If (curr_item.get (constant. news_icon_url )! = NULL & curr_item.get (constant. news_icon) = NULL) {LoadImage (curr_item );}}}

I used asynctask to load the Image Code asynchronously. However, after inheriting asynctask, it cannot be executed multiple times. Therefore, I used a thread to call handler to update the UI:

Java code

  1. /**
  2. * Asynchronously load images
  3. * @ Param curr_item
  4. */
  5. Private void LoadImage (final hashmap <string, Object> curr_item ){
  6. Executorservice. Submit (New runnable (){
  7. Public void run (){
  8. Try {
  9. Drawable curr_icon = NULL;
  10. String icon_url = (string) curr_item
  11. . Get (constant. news_icon_url );
  12. String newsid = (string) curr_item.get (constant. news_id );
  13. If (imagecache. containskey (icon_url) {// soft reference
  14. Softreference <drawable> softreference = imagecache
  15. . Get (icon_url );
  16. Curr_icon = softreference. Get ();
  17. System. Out. println ("case using softreference !!!!!!!!!!!!!!!!!!!! ");
  18. }
  19. If (curr_icon = NULL ){
  20. Httputils Hu = new httputils ();
  21. Fileutils Fu = new fileutils ();
  22. If (Hu. is_intent (home_activity.this )){
  23. Fu. write2localfromis (home_activity.this, newsid
  24. + Constant. save_news_icon_name
  25. + Constant. save_img_suffix,
  26. Hu. getisfromurl (icon_url ));
  27. }
  28. // Load images from the local machine. If there is no network, load the local image directly.
  29. Curr_icon = Fu. readdrawablefromlocal (
  30. Home_activity.this, newsid
  31. + Constant. save_news_icon_name
  32. + Constant. save_img_suffix );
  33. Imagecache. Put (icon_url, new softreference <drawable> (
  34. Curr_icon ));
  35. }
  36. Curr_item.put (constant. news_icon, curr_icon );
  37. // Send the UI to handler for update
  38. Message MSG = _ viewhandler. obtainmessage ();
  39. MSG. arg1 = constant. msg_list_img_ OK;
  40. MSG. sendtotarget ();
  41. } Catch (exception e ){
  42. Throw new runtimeexception (E );
  43. }
  44. }
  45. });
  46. }
/*** Asynchronously load the image * @ Param curr_item */private void LoadImage (final hashmap <string, Object> curr_item) {executorservice. submit (New runnable () {public void run () {try {drawable curr_icon = NULL; string icon_url = (string) curr_item.get (constant. news_icon_url); string newsid = (string) curr_item.get (constant. news_id); If (imagecache. containskey (icon_url) {// soft reference softreference <drawable> softreference = imageca Che. get (icon_url); curr_icon = softreference. get (); system. out. println ("case using softreference !!!!!!!!!!!!!!!!!!!! ");} If (curr_icon = NULL) {httputils Hu = new httputils (); fileutils Fu = new fileutils (); If (Hu. is_intent (home_activity.this) {Fu. write2localfromis (home_activity.this, newsid + constant. save_news_icon_name + constant. save_img_suffix, Hu. getisfromurl (icon_url);} // load the image locally. If no network is available, load the local image curr_icon = Fu. readdrawablefromlocal (home_activity.this, newsid + constant. save_news_icon_name + constant. save_img_suffix); imagecache. put (icon_url, new softreference <drawable> (curr_icon);} curr_item.put (constant. news_icon, curr_icon); // send the UI to handler to update message MSG = _ viewhandler. obtainmessage (); MSG. arg1 = constant. msg_list_img_ OK; MSG. sendtotarget ();} catch (exception e) {Throw new runtimeexception (e );}}});}

Java code

  1. Handler code:
Handler code:
Java code

  1. Handler _ viewhandler = new handler (){
Handler _ viewhandler = new handler (){
Java code

  1. @ Override
  2. Public void handlemessage (Message MSG ){
  3. Switch (msg. arg1 ){
  4. Case constant. msg_list_img_ OK:
  5. // Update the UI
  6. Adapter. notifydatasetchanged ();
  7. Break;
  8. }
  9. Super. handlemessage (MSG );
  10. }
  11. };
@ Overridepublic void handlemessage (Message MSG) {Switch (MSG. arg1) {Case constant. msg_list_img_ OK: // update uiadapter. yydatasetchanged (); break;} super. handlemessage (MSG );}};

The previous figure:

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.