B4J Question ZoomImageView panning performance problem!

[agraham]

My main interest nowadays is mapping and I have programs written for Android and Windows Desktop. The maps are big, at the limit of what Windows can decode, typically 20,00 pixels on each side. For display on Android I use my ScaleImageView which performs very well. On the desktop I have been using my desktop optimised version of Basic4ppc and my own C# library which implements a Windows Form with a WinForms PictureBox on a Panel to display a bitmap decoded from jpg by the GDI+ image decoder. Panning is implemented by moving the PictureBox location on the Panel which works well and quickly.

For various reasons I would like to try using B4J for my next mapping program but I have run into performance problems with ZoomImageView. Zooming performance seems a little slower than my WinForms solution and is acceptable but the panning performance is dire, a quick look inside ZoomImageView seems to indicate the the problem is with ImageView.SetLayoutAnimated.

Before I start to try digging into the various B4X classes is there something that I am unaware of that could be done to improve the panning performance or is there another solution to this problem?

​

 

[Erel]

I've updated HugeImageView to support B4J as well.

[B4X] HugeImageView - show very large images

Q: I want to load a 10,000 x 10,000 image? A: That's impossible!!! The memory required is: width * height * 4 = 400MB. A: You will need to scale down the image. A: Sure. Use HugeImageView: (image source: https://images4.alphacoders.com/655/655004.jpg) How does it work? It uses two layers -...

www.b4x.com

The B4J implementation crops the large image and only adds the required tiles (the B4A / B4i implementations are more sophisticated).
It crops the tiles when needed. It might be too slow for a 20k x 20k image. You can modify it to crop all tiles as the beginning.
Panning should be fast enough.

 

[agraham]

Thanks very much Erel. A huge improvement, especially once the image is tiled. ?

I haven't looked at how it works but, as storage is no issue on a desktop, maybe I can look at saving the images pre-tiled, or maybe tile them on a background thread. I now also need to look at programmatically panning and zooming the image to position the maps to any specified location. If I implement anything respectable I 'll post it.

 

[Erel]

BTW, play with the TileSize field. It can make a big difference. I set it to 2000 for B4J. Test it with larger values.

 

[kimstudio]

Just some rough thoughts...

• if the map or image is too big to load at once due to mem problem, and if jpg or png can't be loaded rect by rect, I will try to define a unique format and convert the map to this format, better with compression but must be able to random-access any pixels I need. It also kind of encrypts the map for protection.
• use canvas to draw the map instead of a view, or build a view with canvas. For zoom or pan based on mouse input to calculate the rect of the map to be needed to show in real-time, random-access the corresponding pixels and draw it on the canvas. so the speed is only limited to file access performance. If the map can be loaded in mem at once then I assume there will be no speed issue, and the format conversion is also not needed.

 

[agraham]

I note the neat use of Wait For in FillImages to effectively loop in the background forever ?

I see that the image is in fact decoded twice from storage in SetBitmap. The image is loaded twice, once to FullImage and again, reduced, to ZoomOutImageView. This doubles the waiting time for large images. I would have thought that ZoomOutImageView could be generated from FullImageView but I'm not well practiced at graphics at the best of times and XUI is an unknown quantity to me. I have tried unsuccessfully to draw a reduced size version of FullImageView but am failing dismally. Can anyone show me how?

 

[Erel]

Try it with this change (B4J only):

XUIViewsUtils.SetBitmapAndFill(ZoomOutImageView, FullImage)

 

[agraham]

I tried that but, while it cuts the loading time by half, for reasons that I don''t understand it dramatically slows panning and zooming to an unacceptable extent. I assume its because it's manipulating the full size bitmap somewhere. It seems to need the smaller bitmap produced by LoadBitmapResize which I thought could be done by drawing a smaller resolution one from the full size one - but my attempts to do so have all failed so far

 

[Erel]

Save a scaled down version of the image and load it, instead of resizing the full image.

 

[agraham]

Crude but it works! However I have lots of maps to reduce so showing my total ignorance of XUI how could I save the bitmap, to use next time, from ZoomOutImageView once it is loaded the first time using LoadBitmapResize.

 

[Erel]

Look for bmp.WriteToStream.

 

[agraham]

Yup, got it working and saving a reduced size image for next time. I can work with this for the time being but I'd still like to know if it possible to draw a reduced size bitmap from Fullimage to ZoomOutImageView to save cluttering my existing map image folders with duplicate files just for this one application.