Hello Blinky

Introduction

This application toggles the state of a single LED at a fixed interval. The purpose of this application is to ensure that the core libraries have been installed for further application development in subsequent projects. The basic development of the application moves along the classic project phases:

  • Design
  • Construction
  • Testing
  • Deployment

Project phases

The two key phases for the project with respect to the limited purposes of this simple application are:

  • Construction
  • Testing
       txtStatus.Text = "No GPIO controller detected on device!";
                   }
               }
               else
               {
                   txtStatus.Text = "GPIO controller already initialized!";
               }
               return pinDetected;
           }

Construction

There are two parts to the construction phase:

  • Board assembly
  • Code development

Board assembly

The following information is presented in this section:

  • Layout
  • Schematic
  • Bill of Materials
Layout

The general layout of the breadboard for the application is shown in the header of this post. In practice, a cobbler board (see photo/video) was used to layout the RPi pins to the breadboard but you may choose to forgo this extra work for the limited purposes of this specific application.

GPIO 5 and 3.3V PWR pins are the only two pins(#1 and #29) used in this application.

Schematic

HelloBlinky2_schem

Bill of Materials

Label Description Quantity Reference
RpI1 Raspberry Pi 2 1
LED1 LED, red, 633 nm 1
R1 Resistor, 220, ±5% 1
Misc Connection wires, assorted colors 4

Code development

Code development consists of:

  • Prepare the project files
  • Place the user interface controls
  • Add the timer code

Prepare the project files

  • Launch Visual Studio
  • On the menu bar of the Start Page, click File and drill-down the cascade menu to New and then Project as shown below:

HelloBlinky - File New

  • In the left-pane of the New Project dialog box, drill-down as follows: Templates Visual C# Windows Universal
  • In the middle-pane of the same dialog box, select Blank App (Universal Windows)
  • In the bottom-pane of the same dialog box, enter HelloBlinky for the Name field as shown below and leave the other fields as the defaults unless you have a specific reason to override these entries.
  • Click the OK button to proceed as shown below:

HelloBlinky - New Project

Wait for the wizard to complete the initialization of the files for the solution. In the right-pane, select the Solution Explorer tab and drill-down the tree control to References as shown below:

HelloBlinky - References

  • Right click References and select Add Reference in the context menu as shown below:

HelloBlinky - Add Reference

  • In the Reference Manager dialog box, drill-down in the left-pane to Universal Windows Extensions. In the middle-pane select the SDK, Windows IoT Extensions for the UWP version 10.0.10586.0 or later as shown below:

HelloBlinky - Reference Manager

The selected SDK will now be displayed under References for the project in the Solution Explorer pane as shown below:

HelloBlinky - Added reference to IoT SDK

Place the user interface controls

Open the MainPage.xaml file; you will be presented with a blank screen on the Design page in the middle-pane of the IDE as shown below:

Hello Blinky - MainPage blank display

In the XAML code section, you will notice that the default Grid control is present:

   <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
   </Grid>
  • Insert a StackPanel control within the Grid element to facilitate the positioning of the subsequent controls. You can drag and drop the StackPanel control from the Toolbox:
Hello Blinky - StackPanel control

Alternatively, you can type the XAML code directly using your own preferences for the values for Alignment and Margin to override the default values:

       <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
       </StackPanel>

There are three controls that have to be placed within the StackPanel. You can use the Toolbox to drag-and-drop these controls (shown below) to the MainPage or you can type the XAML code shown further below:

  • Ellipse (i.e. circle) to display the current color of the LED

Hello Blinky - Ellipse control

  • TextBlock for the duration before the state reversal of the LED

Hello IoT World - Textbox control

  • TextBlock for status messages

If you drag-and-drop the controls to the canvas pay attention to the closing XAML element of the corresponding control which in the case of the StackPanel would have to edited. The XAML code, excluding the header section, after all the controls have been inserted should be similar to that shown below:

   <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
       <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
           <Ellipse x:Name="ellLED" HorizontalAlignment="Center" Height="100" VerticalAlignment="Center" Width="100" Margin="10"/>
           <TextBox x:Name="txtDelayPeriod" HorizontalAlignment="Center" TextWrapping="Wrap" Text="unknown" VerticalAlignment="Center" Margin="10" FontSize="32"/>
           <TextBox x:Name="txtStatus" HorizontalAlignment="Center" TextWrapping="Wrap" Text="Not ready" VerticalAlignment="Top" Margin="10" FontSize="24"/>
       </StackPanel>
   </Grid>

 

Add the timer code

Open the file, MainPage.xaml.cs

Untitled picture

  • Insert the following statement in the header section of the file to use the WinRT classes:
 using Windows.Devices.Gpio;

 

  • Insert variables for the class MainPage; insert the following lines before the MainPage constructor:
private const int GPIO_LED = 5;
	private const double blinkInterval = 1.0;              
	private GpioPin pinLED;                                
	private DispatcherTimer timer = new DispatcherTimer();
	private SolidColorBrush brushRed = new SolidColorBrush(Windows.UI.Colors.Red);
	private SolidColorBrush brushLightGray = new SolidColorBrush(Windows.UI.Colors.LightGray);
  •  Insert the following method in the class MainPage to initialize the GPIO controller and active pin:

 

private Boolean InitGPIO()
{
  Boolean pinDetected = false;
  if (gpio == null)
  {
    txtDelayPeriod.Text = blinkInterval.ToString() + " secs";
    gpio = GpioController.GetDefault();
    if (gpio != null)
    {
      try
      {
        pinLED = gpio.OpenPin(GPIO_LED);
        pinLED.SetDriveMode(GpioPinDriveMode.Output);
        txtStatus.Text = "GPIO pin " + GPIO_LED + " initialized";
        pinLED.Write(GpioPinValue.High);
        pinDetected = true;
      }
      catch (System.IO.FileLoadException fle)
      {
        txtStatus.Text = "GPIO pin " + (GPIO_LED).ToString() + " in incompatible sharing mode";
      }
    }
    else
    {
    }

 

  • Insert the following method to the class MainPage:

 

private void Timer_Tick(object sender, object e)
     {
       if (stateLED == GpioPinValue.High)
       {
         stateLED = GpioPinValue.Low;
         ellLED.Fill = brushRed;
         txtStatus.Text = "HIGH";
        }
        else
        {
          stateLED = GpioPinValue.High;
          ellLED.Fill = brushLightGray;
          txtStatus.Text = "LOW";
        }
           }
           pinLED.Write(stateLED);
       }

 

  • Insert the following code snippet after the this.InitializeComponent statement in the class MainPage:
	txtStatus.Text = "Loading...";
	timer.Interval = TimeSpan.FromSeconds(1.0);
	timer.Tick += Timer_Tick;
	if (InitGPIO() == true)
	{
	   timer.Start();
	}
	else
	{
	   txtStatus.Text = "Initialization failed!";
	}

The Output pane should display a message similar that shown below:

'HelloBlinky.exe' (CoreCLR: CoreCLR_UWP_Domain): Loaded 'C:\Data\Users\DefaultAccount\AppxLayouts\38416d93-771d-4180-882b-8015e481426eVS.Debug_ARM.User\System.Reflection.Extensions.dll'. Module was built without symbols.

The display attached to the Remote Machine will display the main page with the three visual controls:

  • Circle displaying the current state of the LED
  • Textbox for the toggle interval
  • Textbox for the status message

 

  • Stop the application using the Stop button on the toolbar as shown below:
Hello Blinky - Stop Debugging

References

Advertisements

About charnumber

Still learning...
This entry was posted in IoT and tagged , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s