Universal image Loader The problem and solution of repeatedly loading pictures when scrolling in Listview/gridview

Source: Internet
Author: User

Use UIL in Listview/gridview to display each item's picture, when the number of pictures need to slide to scroll when the lag will appear, and the loaded image will still be repeated after the reload (display the settings of the loaded picture)

Recently in the use of UIL encountered this problem, believe that the problem many people who use UIL have met

Now put out the solution to the same problem of friends to do reference

Let's take a look at the UIL workflow.

under the premise of allowing memory card cache , when a picture is asked to display, the first thing is to determine whether the picture is slow to exist in memory, if False then try to read from the card, if it still does not exist last downloaded from the network address

Read from memory the fastest, memory card second, when we scroll the ListView, if it is loaded from memory image will be very smooth, if it is a memory card will first appear loaded in the picture and then display the actual picture

We usually think that a picture that has been read will naturally be added to the memory cache, then the next read will be read directly from memory, but the actual loaded image will still be read from the card after it has been slid out of the screen and then slid back, which is primarily a "suspected bug" caused by UIL's caching strategy.

View UIL's source code, DisplayImage function

     Public void displayimage (String uri, ImageView ImageView, displayimageoptions options) {        newnull NULL );    }

There will be an instantiation of the Imageaware interface, this default instantiation has an important parameter: Checkactualviewsize specific instructions are as follows

     Publicviewaware (view view) { This(View,true); }    /*** Constructor * *@paramView {@linkAndroid.view.View View} to work with *@paramcheckactualviewsize <b>true</b>-then {@link#getWidth ()} and {@link#getHeight ()} would check actual * size of View. It can cause known issues like * <a href= "https://github.com/nostra13/Android-Universal-Image-Loader/issues/376">THIS</A>                            * But it helps to save memory because memory cache keeps bitmaps of actual     General) size. * <p/> * <b>false</b>-then {@link#getWidth ()} and {@link#getHeight ()} 'll <b>NOT</b> * Consider actual size of View, just layout Parameters. <br/> If You set ' false ' * it ' s recommended ' android:layout_width ' and ' Android:layo Ut_height ' (or * ' android:maxwidth ' and ' Android:maxheight ') is set with concrete values.     It helps to * save memory. */     PublicViewaware (View view,Booleancheckactualviewsize) {        if(View = =NULL)Throw NewIllegalArgumentException ("View must not is null");  This. Viewref =NewWeakreference<view>(view);  This. checkactualviewsize =checkactualviewsize; }

This parameter will affect the key name when the cache, when the picture was first cached, when the picture is not downloaded, naturally cannot get the image of the long-width size, then UIL will use the configuration preset maxwidth and maxheight for the length of the width, the cache key name is similar: Url_ Widthxheight

When Checkactualviewsize is set to True, the second load of the picture's view will read the view's length and width, then the width will be the actual size of the picture, the corresponding generated cache key name will also become url_realwidthxrealheight, This name is different from the previous cache, so of course it cannot be hit in the cache query

So finally you need to load the image again from the store and save a copy in memory with the new KeyName

There are two solutions:

1) Set the ImageView layout_width and layout_height as the actual picture length (if your pictures are fixed size, this will be OK)

2) Display method modified, not directly display ImageView changed to Imageaware, similar

New false ); Imageloader.displayimage (Imageuri, imageaware);

Explicitly set the checkactualviewsize to false, so that the image's cache will only save a copy, ensuring that the second query can be directly hit

After the above method is generally set in the Listview/gridview slide when the picture effect is basically no big problem, but there are some additional settings may also be people need to pay attention to

First is the initialization of the Config

File Cachedir = Storageutils.getowncachedirectory (Getapplicationcontext (), "Imageloader/cache");//storage address of the cache fileimageloaderconfiguration config =Newimageloaderconfiguration. Builder (Getapplicationcontext ()). Memorycacheextraoptions (480, 800)//Max width, max height. ThreadPoolSize (3)//number of lines Cheng Chinega loaded. ThreadPriority (Thread.norm_priority-2)//reduce thread priority to ensure that the main UI thread is not affected too much. Denycacheimagemultiplesizesinmemory (). MemoryCache (NewLrumemorycache (5 * 1024 * 1024))//recommended memory is located in the 5-10m, can have a better performance. memorycachesize (5 * 1024 * 1024). Disccachesize (50 * 1024 * 1024). Disccachefilenamegenerator (NewMd5filenamegenerator ()). Tasksprocessingorder (Queueprocessingtype.lifo). Disccachefilecount (100)//number of cached files. Disccache (NewUnlimiteddisccache (Cachedir)). Defaultdisplayimageoptions (Displayimageoptions.createsimple ()). Imagedownloader (NewBaseimagedownloader (Getapplicationcontext (), 5 * 1000, 30 * 1000))//ConnectTimeout (5 s), ReadTimeout (s). Writedebuglogs ()//Remove for release app. build ();

Then the option is set

New Displayimageoptions.builder (). Showstubimage (R.drawable.default_cover). Showimageforemptyuri ( R.drawable.default_cover). Showimageonfail (R.drawable.default_cover). Cacheinmemory (true). Cacheondisc (true). Imagescaletype (Imagescaletype.none). Bitmapconfig (Bitmap.Config.RGB_565)  // set to RGB565 save a lot of memory than the default argb_8888 . delaybeforeloading (+)//  A little delay before loading the picture will improve the smoothness of the overall slide . Build ();

Non-loading while sliding can also effectively improve performance

Setonscrolllistener (newtruetrue)); // two respectively to drag the drop-down bar and pause the load during the slide

The last is in the GetView, the routine viewholder save state, the URL is stored in the ImageView tag, by comparing the URL value to reduce the number of UIL display to improve performance

UIL is a very good picture loading class third-party library, can help us in the development process of saving a lot of things, but if you want to use good also need to really study under

Resources:

https://github.com/nostra13/Android-Universal-Image-Loader/issues/376

Https://github.com/nostra13/Android-Universal-Image-Loader/wiki/Task-flow

Universal image Loader The problem and solution of repeatedly loading pictures when scrolling in Listview/gridview

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.