Build a WIFI Connected Clock Using Meadow

Project updated to beta 6.4 (released on May 30th, 2022)

In this Meadow project we'll learn how to build a clock that shows you the time and date on a LED Matrix using google's NTP service and room temperature with an LM35 analog temperature sensor. We will see how easy is to connect your Meadow board to your home wireless network with its onboard WIFI capabilities, and we'll use Meadow.Foundation to drive the peripherals and MicroGraphics to draw text and lines on the display.

Meadow.Foundation a platform for quickly and easily building connected things using.NET on Meadow. Created by Wilderness Labs, it's completely open source and maintained by the Wilderness Labs community.

If you're new working with Meadow, I suggest you go to the Getting Started w/ Meadow by Controlling the Onboard RGB LED project to properly set up your development environment.

Step 1 - Assemble the circuit

Wire your project like this:

Step 2 - Create a Meadow Application project

Create a new Meadow Application project in Visual Studio 2019 for Windows or macOS and name it WifiClock.

Step 3 - Add the required NuGet packages

For this project, search and install the following NuGet packages:

• Meadow.Foundation.Displays.Max7219

Step 4 - Add Configuration Files (if missing)

In your project, create and add the following configuration files:

meadow.config.yaml

# Acceptable values for true: true, 1, yes
# Acceptable values for false: false, 0, no

#===============================================================================
# main device config

Device:
    # Name of the device on the network.
    Name: WifiClock

#===============================================================================

# Network configuration.
Network:

    # Automatically attempt to get the time at startup?
    GetNetworkTimeAtStartup: true

    # Time synchronization period in seconds.
    NtpRefreshPeriod: 600

    # Name of the NTP servers.
    NtpServers:
        - time.google.com
        - time1.google.com
        - time2.google.com
        - time3.google.com

    # IP addresses of the DNS servers.
    DnsServers:
        - 142.103.1.1
        - 65.39.139.53

This configuration file is used for when Meadow is powered on, it looks for these values here and takes action depending on what's defined, like GetNetworkTimeAtStartup set to true, to get the UTC date and time using the NtpServers and DnsServers listed.

IMPORTANT: Right click on the config file and go to the Properties, and make sure the Build Action is set to Content and Copy to Output Directory to Copy Always or Copy If Newer.

Step 5 - Write the code for WifiClock

Secrets.cs

We'll use this class to store the WIFI credentials.

public class Secrets
{
    /// <summary>
    /// Name of the WiFi network to use.
    /// </summary>
    public const string WIFI_NAME = "[SSID]";

    /// <summary>
    /// Password for the WiFi network names in WIFI_NAME.
    /// </summary>
    public const string WIFI_PASSWORD = "[PASSWORD]";
}

MeadowApp.cs

In our main class, copy the following code:

public class MeadowApp : App<F7Micro, MeadowApp>
{
    PushButton pushButton;
    Max7219 display;
    GraphicsLibrary graphics;
    AnalogTemperature analogTemperature;

    bool showDate;

    public MeadowApp()
    {
        Initialize();

        Start();
    }

    void Initialize()
    {
        var onboardLed = new RgbPwmLed(
            device: Device,
            redPwmPin: Device.Pins.OnboardLedRed,
            greenPwmPin: Device.Pins.OnboardLedGreen,
            bluePwmPin: Device.Pins.OnboardLedBlue);
        onboardLed.SetColor(Color.Red);

        display = new Max7219(
            device: Device, 
            spiBus: Device.CreateSpiBus(), 
            csPin: Device.Pins.D01, 
            deviceCount: 4, 
            maxMode: Max7219.Max7219Type.Display);
        graphics = new GraphicsLibrary(display);
        graphics.CurrentFont = new Font4x8();
        graphics.Rotation = GraphicsLibrary.RotationType._180Degrees;

        graphics.Clear();
        graphics.DrawText(0, 1,  "WI");
        graphics.DrawText(0, 9,  "FI");
        graphics.DrawText(0, 17, "TI");
        graphics.DrawText(0, 25, "ME");
        graphics.Show();

        pushButton = new PushButton(Device, Device.Pins.D04, ResistorMode.InternalPullUp);
        pushButton.Clicked += PushButtonClicked;

        analogTemperature = new AnalogTemperature(
            device: Device,
            analogPin: Device.Pins.A00,
            sensorType: AnalogTemperature.KnownSensorType.LM35
        );            

        Device.InitWiFiAdapter().Wait();

        onboardLed.StartPulse(Color.Blue);

        var result = Device.WiFiAdapter.Connect(
            Secrets.WIFI_NAME, Secrets.WIFI_PASSWORD);
        if (connectionResult.ConnectionStatus != ConnectionStatus.Success)
        {
            throw new Exception($"Cannot connect to network: {connectionResult.ConnectionStatus}");
        }

        onboardLed.StartPulse(Color.Green);
    }

    void PushButtonClicked(object sender, EventArgs e)
    {
        showDate = true;
        Thread.Sleep(5000);
        showDate = false;
    }

    async Task Start() 
    {
        while (true)
        {
            DateTime clock = DateTime.Now.AddHours(-8);

            graphics.Clear();

            graphics.DrawText(0, 1, $"{clock:hh}");
            graphics.DrawText(0, 9, $"{clock:mm}");
            graphics.DrawText(0, 17, $"{clock:ss}");
            graphics.DrawText(0, 25, $"{clock:tt}");

            if (showDate)
            {
                graphics.Clear();

                graphics.DrawText(0, 1, $"{clock:dd}");
                graphics.DrawText(0, 9, $"{clock:MM}");
                graphics.DrawText(0, 17, $"{clock:yy}");
                    
                graphics.DrawHorizontalLine(0, 24, 7, true);

                var temperature = await analogTemperature.Read();

                graphics.DrawText(0, 26, $"{(int) temperature.Celsius}");
            }
                
            graphics.Show();
            Thread.Sleep(1000);
        }
    }
}

We can split the logic here in two main methods:

Initialize()

Here we're initializing all the peripherals connected to Meadow, and the WIFI connection to your network. You'll see the onboard LED turning red when the app starts, and it will turn blue after initializing the AnalogTemperature sensor, the push button and the MAX7219 dot matrix (which will greet you with a WIFI TIME in the display). When the LED is pulsing blue, it will now initialize the WIFI module and it will turn green once its successfully connected to your network.

We also have a Clicked event handler (PushButtonClicked) for the push button, which sets a boolean field (showDate) true for five seconds, and assigning it back to false.

Start()

Inside the While loop we show the time, updating every second. Notice that we use the showDate boolean field to show today's date and room temperature in the bottom, separated by a horizonal line. This will only be drawn for five seconds whenever we push the button.

Step 6 - Run the project

Click the Run button in Visual Studio. It should look like to the following GIF:

Check out Meadow.Foundation!

This project is only the tip of the iceberg in terms of the extensive exciting things you can do with Meadow.Foundation.

• It comes with a huge peripheral driver library with drivers for the most common sensors and peripherals.
• The peripheral drivers encapsulate the core logic and expose a simple, clean, modern API.
• This project is backed by a growing community that is constantly working on building cool connected things and are always excited to help new-comers and discuss new projects.

References

• Meadow Guides
• Meadow.Foundation
• Meadow.Foundation.Sensors.Temperature.AnalogTemperature
• Meadow.Foundation.Sensors.Buttons.PushButton
• Meadow.Foundation.Displays.Max7219