Manage cookies

We use cookies to improve our services. Read more about how we use cookies and how you can refuse them.

The necessary cookies help to make the website work properly.

Anonymous statistical cookies help to understand how visitors use the website.

  • Cloud Platforms, M5Stack
    2 min | 6729

    #M5Stack: Widgets on your Smartphone help you to stay safe from #COVID-19

    Cloud Platforms, M5Stack | 2 min | 6729

    Table of contentHideShow

    This is the last follow-up of the tutorials:

    in which I explained how to build a CO2 measuring device using a M5Stack and an SG30 sensor, send the data to GCP, and offer it using HTTPS.

    CO2 reporting widgets on Android and iOS.
    Fig. 1: CO2 reporting widgets on Android and iOS.

    These sensors can help to prevent Covid-19 spread in a room. If you want to implement the complete pipeline, check out the links above. This tutorial connects the data to your Android or iOS phone to see that in a Widget (see Fig. 1).


    On Android, you can use the Gauge Widget application. In Fig. 2, you can see an example of how to configure the Widget to see the data published by the sensor and it results in Fig. 3.

    Gauge Widget configuration
    Fig. 2: Gauge Widget configuration.
    Gauge Widget reporting TVOC measurements
    Fig. 3: Gauge Widget reporting TVOC measurements.


    On iPhone or iPad running iOS 14+, you can use Scriptable app. This app lets you automate iOS using JavaScript. I forked the Toilet paper widget from marco79cgn, and create a widget to check the data send from the CO2 measuring devices. To run the application, first, install Scriptable and then follow these steps:

    1. Go to lemariva/tvoc-eco2-device-widget.js) and copy the source code;
    2. Open the Scriptable app;
    3. Click on the + symbol at the top right and paste the copied script;
    4. Change the line var domainName = "" to match your domain.
    5. Click on the title of the script at the top and give it a name (e.g. CO2 Measuring Device);
    6. Save the script by clicking on "Done" in the top left;
    7. Go to your iOS home screen and long-press somewhere to get into "wiggle mode" (which can also be used to arrange the app icons);
    8. Press the + symbol at the top left, then scroll down to "Scriptable" (the list is alphabetical), choose the first widget size (small), and select Add widget at the bottom;
    9. Press on the widget to edit its settings (optionally long-press if the wiggle mode has already been exited)
    10. Under "Script", select the one created above (CO2 Measuring Device) (see Fig. 4)
    11. Scroll down and enter the determined device_id as "Parameter", e.g. m5stack-atom-office (see Fig. 5)
    Scriptable Widget reporting TVOC/ECO2 measurements
    Fig. 4: Scriptable Widget configuration.
    Scriptable Widget Configuration
    Fig. 5: Gauge Widget reporting TVOC/ECO2 measurements.