Android ListView asynchronously loads image misplacement, repetition, blinking analysis, and solutions,

Android ListView asynchronously loads image misplacement, repetition, blinking analysis, and solutions,

When we use ListView to asynchronously load images, problems such as misplacement, repetition, and flickering may occur when the image is quickly slide or the network is poor. In fact, these problems are summarized as a problem, we need to optimize ListView for these problems.

For example, if the ListView contains 100 items and only 10 items are displayed on a screen, we know that convertView in getView () is used to reuse the View object because one Item corresponds to one View object, the ImageView control is obtained by the findViewById () of the View object. When we reuse the View object, the ImageView object is also reused. For example, if the View of 11th items reuse 1st Item View objects, the ImageView is reused at the same time. Therefore, when the image is not downloaded, this ImageView (11th items) the displayed data is reused (1st items) data.

1: The Item image is displayed repeatedly.

This duplicate display indicates that the Item in the current row displays the image of the Item in the previous row.

For example, if the ListView slides to 2nd rows, an image is asynchronously loaded, but loading is slow. During the loading process, the ListView slides to 14th rows, and the image loading ends. Rows 2nd are no longer on the screen. According to the cache principle described above, 2nd View objects may be reused by 14th rows, in this way, we can see that 14th rows show images that should belong to 2nd rows, resulting in repeated display.

2. The Item image is displayed incorrectly.
This display disorder means that a row of items displays images that do not belong to the row of items.
The reason is the same as above.

3. The Item image is flickering.
In another case described above, if 14th rows of images are soon loaded, we can see that 14th rows first display the reused 2nd rows of images, the system immediately showed that its image was overwritten, leading to flickering disorder.

Solution:

Through the above analysis, we know that the reason for confusion is asynchronous loading and Object reuse. If each getView operation can give an object an identifier, when the asynchronous loading is complete, whether the comparison mark is consistent with the ID of the Item in the current row is displayed. Otherwise, no processing is required.

Principle: First, set a Tag for the ImageView. the url of the image is set in the Tag. Then, compare the url obtained during loading with the url in the position to be loaded, if they are different, they will be loaded. If they are the same, they will not be loaded after reuse.