Sensor Demo



This article is a detailed guide on how to implement sensors on an Ultrabook® running Windows 8. There are many sensors on the Ultrabook®, but this demo will only use the accelerometer.  The article will be using a demo application to help explain the details. To fully comprehend this article, please review the requirements before continuing.

Tutorial Requirements:
1. MSDN Account:
2. Windows 8:
3. Visual Studio 2012 :
4. Ultrabook with touch screen enabled and sensors enabled
5. Programming knowledge of XAML
6. Programming knowledge of C#

Download the demo source code here: Soucre Code
Download the Windows 8 demo executable: Demo

Compiling the project

1. Unzip the source code and locate the solution: Win8Demo.sln

2. Compile the project in Visual Studio 2012 and run it in debug mode

3. Verify that the solution compiles successfully and run the app:



Implementing the sensor demo

We will begin by examining the senor example. Please take a moment to run the sensor example and get familiar with the user interface. Press the Start Accelerometer button and pick up the Ultrabook®. As the move the device, observe the ball bounce around the screen. Also notice the xyz coordinate change as the ball is moved. 

The accelerometer is not end user event driven like the touch demo. Image only moved when the user touched the screen. In this demo, once the [Start Accelerometer] button is pressed, data is constantly being streamed to the screen. There are timers that forces events to be executed. 

Open the source code project now and examine the XAML file:AccelerometerText.XAML

Notice the Grid tag, there is where we define the ball, the Ellipse tag is used to create the ball. We also set the size and color. Unlike the touch demo, there is no accelerometer event handlers placed here.  The canvas is only used to display the results of the accelerometer readings.




Open the file: AccelerometerTest.cs

The demo begins the moment the [Start Accelerometer] button is pressed. This calls the function SetAcc. This initialization function creates to two timers: drawing and accelerometer data updates. 

The drawing timer (m_timer) updates the circle every 20 milliseconds. That can be seen at the bottom of the function. Every 20 milliseconds, the canvas will automatically draw the location of the ball based on the streaming xyz data updates from the top left and corner. The accelerometer data update timer (acc_monitor) will post the accelerometer xyz data ever 50 milliseconds. This is defined by the acc_monitor.update function. We look at this feature later in the tutorial. These two times must work together to make a smooth movement across the screen. Posting too often or to slowly can make the ball move erratically. Also, drawing too often will take up too much resource and slow the device. 

Also notice the acc_monitor.stateChanged event, this actually starts and stops the timer. 



2.Accelerometer Monitor Class
Open the file: AccelerometerMoniter.cs
As we mentioned earlier, we will examine the 50 milliseconds and the acc_monitor class. 
Notice the required define at the top of the file: Windows.Devices.Sensors. This definition is key to accessing the accelerometer. 
This class essentially posts the accelerometer data on the screen, the xyz data in the top left hand corner of the demo. Every 50 millisecond, the accelerometer will notify the app there is new data to be posted. Try adjusting the timer and notice how the ball is moved around erratically across the screen.
The function below actually extracts the accelerometer data from the sensor and signals the event that new data is ready for posting. The XValue, YValue, ZValue is how the AccelerometerMonitor.cs and AccelerometereTest.cs pass data between the classes. 
4.Drawing the ball
Go back to the file: AccelerometerTest.cs
At this point, we have the new xyz data from the Accelerometer and we must now transform the data to the screen. The function below simply uses the XYZ data and updates the position on the screen. Based on the previous position and new accelerometer data, it can determine the speed of movement. If the new accelerometer data is significantly different, the device must have been severely tilted and the ball will move more dramatically. 
With the new coordinates, the app can finally draw the new ball position.
Hopefully after reading through this tutorial and using the demo, you have a better understanding of how to implement touch/sensors in your own app. 
Check out part 1 again for touch:
Package icon win8demo-1.zip2.26 MB
Package icon source.zip5.02 MB