Xamarin Tips and Tricks #1 – UriImageSource

Sometimes I come across (small) tips and tricks, gotchas or gems while working on Xamarin projects, so I thought let’s put those in a Xamarin Tips and Tricks series. I’ll kick off the series with some info on UriImageSource.

As you probably know you can set the Source of an Image from several locations, i.e. File, Resource, Stream or Uri. The UriImageSource loads an image from a Uri and then caches the results.

At one time I had to troubleshoot the performance of image loading in a list. Performance was so bad that it seemed as if the images weren’t cached but loaded from the Uri every time. Digging a bit in the Xamarin.Forms assemblies shows that the images are cached in a subfolder called ImageLoaderCache in the folder returned from the IsolatedStorageFile.GetUserStoreForApplication method.

On Android the GetUserStoreForApplication for an app called net.iwomm.imagetest returns the following folder: /data/data/net.iwomm.imagetest/files/.config/.isolated-storage

You can inspect the folder using the adb shell command. Keep in mind that folders starting with a dot (.) are hidden and can only be seen using the ls -a command in the shell. Personally, I use ls -la because that gives me a bit more info on the files and folders, such as the size.

So execute these commands to get to the cache folder and display the files:

adb shell

cd data/data/net.iwomm.imagetest/files/.config/.isolated-storage/ImageLoaderCache

ls -la

Keep in mind that the Android file system is case-sensitive when navigating through folders!

This will give you a list of cached images. Note that they are stored with a GUID file name, not with the original file name.

imageloadercache

Turns out that some of the images were quite large for thumbnail images in a list and that hurt performance, even when loading the images from the cache.

So here you go, if you ever need to inspect the UriImageSource cache, you know where to find it.

  • Iulia Stana

    Nice post! 🙂
    After running adb shell you can also do a run-as “net.iwomm.imagetest” and it will take you directly to the root folder of your app.

    Option 2 is to run the Android Device Monitor from under android-sdk-folder/tools. Xamarin Studio has a shortcut via Tools->Open Android Device Monitor for it. With it you can use File Explorer to browse the entire file system

    • Awesome, that’s a convenient shortcut! Lots to learn about adb 🙂

      I tried the Android Device Monitor, however it didn’t show hidden folders. Maybe there’s an option for that?

      • Iulia Stana

        No, indeed, you are right. AFAIK there is no option for it. The command ls -la is still the best option for hidden things. Try adding R to your options, see what happens 🙂

  • Pingback: Adam J Wolf: Weekly Xamarin Newsletter Issue #34 | XamGeek.com()