More beginner questions: UI

More beginner stuff here… I am trying to use the car wash example code on the portal to use for an interface for my well and water storage tank project. I’m modifying the UI interface code to display one main screen (for now), and I will add secondary screens to provide additional information about my deep wells and tanks for our house. Using 4-20ma sensors and digital in’s and out’s for the monitoring. I have successfully patched in networking through the Wi-Fi using the example coding, and have configured the RTC to update using internet time.

I am now trying to set up a timer to update the screen(s) every say 2-10 seconds to update the time and sensor status. Going to the UI tutorial, I have inserted the dispatcher code that is on there, but I don’t know how to modify that code to update the screen… I have never used the UI stuff before, nor have I used the WPF in general, so I’m a bit clueless about how the UI code works.

The screen so far:

If someone can help with where and how I need to insert the UI dispatcher code into the car wash project at least to update the main screen every 10 seconds or so that would get me going, Thanks!!!

Dispatcher code:

static void Counter(object o)
{
Application.Current.Dispatcher.Invoke(TimeSpan.FromMilliseconds(1), _ => {
Text txt = (Text)o;
txt.TextContent = DateTime.Now.ToString();
txt.Invalidate();
return null;
}, null);
}

    private static UIElement Elements()
    {

        var txt = new GHIElectronics.TinyCLR.UI.Controls.Text(Resources.GetFont(Resources.FontResources.NinaB), "Hello World!")
        {
            ForeColor = Colors.White,
            VerticalAlignment = VerticalAlignment.Center,
            HorizontalAlignment = HorizontalAlignment.Center,
        };

        Timer timer = new Timer(Counter, txt, 2000, 1000);
        return txt;
    }

John

Hi John, what I do is create a static class that contains all of the data for the sensors etc and then create a dispatcher timer in the Window class that fires every 500ms and this then allows me to update the display elements from the sensors class.

I’ll post some code tonight when I get home.

Thanks so much Dave you’re a godsend!! Working on a routine to gather up the sensor values in the meantime…

It’s good timing as I am just starting the SITcore port of my old G120 clock and weather display and having to figure out how to do this myself but now have a working solution.

Yah I’m going to start with just getting the sensor data to display and update, the red and green squares are the floats and well alarm digitals that will display when on. On the next stage, I want to record flow and well performance data as well, will probably stick that on the sd card but might use azure instead. I will be able to measure water consumption indirectly from the tank level data, and I want to be able to examine well level recovery graphs to see how the wells recover after each pumping session, so I can see if we are approaching the capacity of these two wells. One well has a capacity around 0.2GPM, and the other is around 0.6GPM, so they have to be managed carefully. From where you are Dave you’ll know all about that!

My good friend lives out in Narrogin, WA and runs 2 water storage tanks. I was thinking to make a similar system for him just for fun.

Hi John,

This is what I have in each windows class. I call Start() when I wish to display the window and Stop() when it closes, which is usually in the button handler that causes the close to happen.

In the timer handler you can update the elements. timer is a global variable in the class.

public void Start()
{
    if (timer == null)
    {
        timer = new DispatcherTimer();
        timer.Tick += Timer_Tick;
        timer.Interval = new TimeSpan(0, 0, 0, 0, 250);
        timer.Start();
    }
    else
    {
        timer.Start();
    }
}

public void Stop()
{
    if (timer != null)
    {
        timer.Stop();
    }
}

private void Timer_Tick(object sender, EventArgs e)
{
}

Dave are you using this code with the UI tools? If so, I’m curious as to where this code goes… the example Tutorial under Multimedia/UI uses a dispatcher. The problem I am having is that the timer never seems to run - I have tried putting the code in the main program, before the main screen gets called ( “DoTestWPF()”), and I have put it in the SelectServiceWindow code where the screen elements are being created, but the timer never fires. I can get “Hello World” on the main screen, but it never changes to the current date/time like the example code indicates should happen.

I guess what I need is some example code that displays the current time on the car wash main page, something like that.

Hi John,
I create a class for each Window, the same as GHI does for the carwash example. The timer is in each class. I start and stop this when each window is made visible.

Have a look on GITHUB for my clock project which is a work in progress. Have a look at the MainClockWindow. This has a timer that updates the clock and date.

https://github.com/davemclaughlin/43LCDclock

The link above is disabled. I didn’t realise I was linking some API keys!! Ooops. Need to work out how to host code on GITHUB without private keys in the source.!!

1 Like