Getting started with

Microsoft .NET Gadgeteer

Gadgeteer Club

The .NET Gadgeteer Hardware

At the heart of every Gadgeteer project is a mainboard.
A mainboard is made up of a programmable processor, and a
number of sockets that Gadgeteer modules can plug into.

Can you find the

Touchscreen Display

Can you find the

Camera

Can you find the

Multicolor LED

Can you find the

Button

Can you find the

Potentiometer

Can you find the

USB Host

Can you find the

Ethernet

Can you find the

SD Card

Can you find the

USB Power Supply
+ Programming Interface

There are also

Some connector cables (same both ends)
Some extender cards
A black USB wire to power the power card

A Closer Look at the Mainboard

Power LED

Debug LED

Reset Button

Mainboard Socket Numbers

Mainboard Socket Types (Letters)

Socket Type Compatibility Labels

X or Y

Match socket type letters when connecting

modules to the mainboard

 If a module is connected to the wrong socket type it wont

work (but it wont damage anything, either)
Red modules supply power to the mainboard. Only one red
module should ever be connected to the mainboard at any
time. (We only have one type of power card at the moment)
When connecting modules, always make sure that the
mainboard is not powered on, and that it is disconnected from
the PC.

Constructing a Digital Camera

What components will we need to make a
camera like this one?

We need.

Main board
Power board
Screen
Button
Camera module
We could also add an SD card.later.

Connect modules to mainboard, and connect to PC via USB.

Lets connect it together like this

Creating a New Gadgeteer Project

Open Microsoft Visual Basic 2010 Express, and select New Project from the Start Page.
(Alternatively, select File > New Project).

Select Gadgeteer from the list of Installed Templates, then select .NET Gadgeteer
Application. You can give your project a name, then select OK.

Designer Tab
(Program.gadgeteer)

Solution Explorer
(Project Files)

Code Tab
(Program.vb)

Designer Tab
(Program.gadgeteer)

Toolbox

You can rename button. For example, rename it to myButton.

Click on the buttons socket. Compatible

sockets on the mainboard are highlighted
in green.

Click and drag to connect the button to a

compatible socket.

Add USBClientDP module from the toolbox, and connect it to socket 1.

The USBClientDP module is both a power supply and a USB
programming interface.

Now make the image in VB look like

the Gadgeteer you have made
Make sure that you use the
right sockets.
The diagram in C# must be the
same as your actual gadget.

Now we will write the code to make it

work

There are different parts to code in VB (and other

languages).
We will use terms like:
Properties
Events
Methods
Dont worry about them too much at the moment.lets
just get something that works!

If it tells you text template may

damage your computer..

Make sure that you click OK

When the button is pressed

We want to say that once the program has started, if the button is pressed (an
event), something happens (a method)
Select Button from pull-down menu

Then select ButtonPressed

Find the button_ButtonPressed procedure

Add the line camera.TakePicture()

When the camera receives an image

We want to say that once the program is started, if the camera receives an image (the
event), something happens (the method)

Select camera

and then PictureCaptured

When the camera has captured a picture, use the displays SimpleGraphics
to display the image.

Add this line of code to the procedure that appears

The DisplayImage method takes three parameters: a Picture object, an X

coordinate and a Y coordinate.
The PicturedCaptured event returns a Picture object, called picture, which can be
directly passed to the DisplayImage method as the first parameter.
The coordinate 0, 0 (passed as the second and third parameters) refers top-left
corner of the display.

This is what the completed program should look like

(comments and spare lines removed).

Now lets run our program

Save your project and the program file to your
own area.
Press run on the toolbar

What happens?
Be patient.
In the output window you will see messages about
debugging and rebooting.
The program is being transferred to the main board,
which will then reboot itself and run the program.
You will know it has done this (and is ready) when it
says Program Started in the window.
ONLY THEN CAN YOU TEST YOUR CAMERA.

If you see the following message in the output window,

stop debugging (Shift+F5) and try again (F5):
Updating display configuration. DEVICE WILL NOW REBOOT. Visual Studio might lose
connection, and debugging might need to be manually restarted.

If the output window is stuck displaying the following

message, press the reset button on the mainboard:
Rebooting...

When the Program is running

1. Press the button an image should be
displayed on the screen.
2. You may wish to hold the camera steady and
re-focus a little at a time until the image
improves

You can also use SimpleGraphics to perform basic drawing operations.

For example, use it to overlay a rectangle on top of the picture.

Use the prompts and drop-down lists to discover and select the appropriate
parameters.

Other things to try

Add an LED that is red while the camera is busy
taking a picture and green when it is not busy
Next week:
Saving pictures to an SD Card