Changes images on ImageView in Xamarin

Question

I'm developing a multiplatform app with Xamarin which is a sort of photo frame. I read the files from SDCARD and i want to display it every 2 seconds. As result of the following code i just can display the first image, not the rest, and i don't know why. I use an ImageView to display each image, and a Timer event.

using System;
using System.IO;
using System.Collections;
using System.Timers;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
using Android.Graphics;

namespace TestSpeedWithXamarin
{
    [Activity(Label = "TestBattteryWithXamarin", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {
        Timer t;
        ArrayList imagesArray;
        int actualImage;
        ImageView imageView;
        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            SetContentView(Resource.Layout.Main);
            string rutaInicial = "sdcard/DCIM/Camera";
            imagesArray = new ArrayList();
            try
            {
                DirectoryInfo di = new DirectoryInfo(rutaInicial);
                foreach (var item in di.GetFileSystemInfos())
                {
                    if (item.Extension == ".jpg" || item.Extension == ".png")
                        imagesArray.Add(item.FullName);
                }

            }
            catch (Exception ex)
            {
                Toast.MakeText(this, "problem ", ToastLength.Long).Show();
            }
            if (imagesArray.Count > 0)
            {
                t = new Timer(2000);
                t.Elapsed += OnTimedEvent;
                actualImage = 0;
                t.Enabled = true;
                mostrarImagen((String)imagesArray[0]);
            }
        }
        private void OnTimedEvent(Object source,ElapsedEventArgs e) {
            if (actualImage < imagesArray.Count-1)
            {
                actualImage++;
                //imageView = FindViewById<ImageView>(Resource.Id.imageView1);
                Bitmap imageBitmap = BitmapFactory.DecodeFile((String)imagesArray[actualImage]);
                imageView.SetImageBitmap(imageBitmap);
                t.Start();
            }
        }

        private void mostrarImagen(string imagePath) {
            imageView = FindViewById<ImageView>(Resource.Id.imageView1);
            Bitmap imageBitmap = BitmapFactory.DecodeFile(imagePath);
            imageView.SetImageBitmap(imageBitmap);
        }

    }
}

I'm not sure if using TimerTask will great because I want a multiplatform app.

Answer 1

Make sure, that you run the updates on the UI Thread.

private void OnTimedEvent(Object source,ElapsedEventArgs e) 
{
    if (actualImage < imagesArray.Count-1)
    {
        actualImage++;
        //imageView = FindViewById<ImageView>(Resource.Id.imageView1);
        RunOnUiThread(() => {
            Bitmap imageBitmap = BitmapFactory.DecodeFile((String)imagesArray[actualImage]);
            imageView.SetImageBitmap(imageBitmap);
        });         
        t.Start();
    }
}

Note: Loading Images is always a pain on Android. You might run into OutOfMemory exceptions after a couple of images. You have to use FFImageLoading or UniversalImageLoader if you don't want to handle image loading yourself :D