Xamarin Android UI with Timer isn't reacting to changes

Question

I am using Xamarin Studio, The app I have built is supposed to switch left and right columns in turns (like police lights). To do this I have used timer and with breakpoints I can see that code runs ColorFlip and values are being set however I cannot see any change in emulator UI.

Main.xml

<?xml version="1.0" encoding="utf-8"?>       
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TableLayout
        android:id="@+id/LightSignal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:layout_marginTop="23dp"
        android:stretchColumns="*" >

        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:weightSum="1" >

            <TextView
                android:id="@+id/Left"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:paddingLeft="8dp"
                android:textColor="#FFF000"
                android:background = "#000000"
                android:layout_column="0"
                />

            <TextView
                android:id="@+id/Right"
                android:paddingLeft="4dp"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:textColor="#FFF000"
                android:background = "#000000"
                android:layout_column="1"
                />
        </TableRow>
    </TableLayout>

</LinearLayout>

MainActivity.cs

using System;

using Android.App;
using Android.Content;
using Android.Content.PM;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
using System.Collections.Generic;
using Android.Graphics;

namespace Core.Droid
{
    [Activity (Label = "Core.Droid", Icon = "@drawable/icon", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsApplicationActivity
    {

        bool IsRed; 
        protected override void OnCreate (Bundle bundle)
        {
            base.OnCreate (bundle);

            global::Xamarin.Forms.Forms.Init (this, bundle);
            var app = new App ();
            LoadApplication(app);
            this.SetContentView(Resource.Layout.Main);

            System.Timers.Timer timer = new System.Timers.Timer();
            timer.Interval = 1000; 
            timer.Elapsed += ColorFlip;
            timer.Enabled = true;

        }

        private void ColorFlip(object sender, System.Timers.ElapsedEventArgs e)
        {
            var left = FindViewById<TextView> (Resource.Id.Left);
            var right = FindViewById<TextView> (Resource.Id.Right);

            if (IsRed) {
                left.SetBackgroundColor (Color.Black);
                right.SetBackgroundColor (Color.Blue);
                IsRed = false;
            }else {
                left.SetBackgroundColor (Color.Red);
                right.SetBackgroundColor (Color.Black);
                IsRed = true;
            }
        }
    }
}

I am assuming I need to force UI to update after I change colours, how do I fix this?

Answer 1

Use RunOnUiThread:

private void ColorFlip(object sender, System.Timers.ElapsedEventArgs e)
{
    RunOnUiThread (() => {
        var left = FindViewById<TextView> (Resource.Id.Left);
        var right = FindViewById<TextView> (Resource.Id.Right);

        if (IsRed) {
            left.SetBackgroundColor (Color.Black);
            right.SetBackgroundColor (Color.Blue);
            IsRed = false;
        } else {
            left.SetBackgroundColor (Color.Red);
            right.SetBackgroundColor (Color.Black);
            IsRed = true;
        }
    });
}