Gadgetab – the Gadgeteer Tablet

 

This story…

…begins a couple years ago when I started the Omnicopter.  To fly the copter, I needed a remote.  So, I built the Omnimote (right).  It was a Panda-II powered remote that used XBee to communicate with the copter.  It also had a small (slow) FEZ Touch display that was useful for displaying some info but had limited ability as a touch screen due to it being a resistive touch screen and it was just too slow to be depended on for use during flight.

As I’ve built other projects since then, it’s become more and more evident that I have a need for a universal device that can communicate and display information with other projects. 

In the past year, most of my focus has been drawn toward the Gadgeteer platform for electronics prototyping.  It’s a much more flexible and productive platform than anything else that exists at the moment and has dozens of powerful modules (subcircuits) that can be attached to it.  Gadgeteer has become my go-to platform when developing electronics projects.

I’ve been doing quite a bit of Gadgeteer evangelizing the past year by giving presentations at our local .NET users’ group and at conferences.  I’m also starting the Nashville Microcontrollers users’ group.  So, the desire to have a truly portable and compact solution for demoing Gadgeteer in addition to something that is useful for my other projects has become a little more important.

However, one piece has been missing to allow me to build the Gadgetab of my dreams – a large capacitive touch display. GHI Electronics recently solved that problem with the release of their CP7 module – a 7” capacitive touch display.  So, let the building begin!

The design goal was to build a tablet type device that could be useful as a remote, demo device, have some room for storage, be battery powered, and look nice – lots of software & sawdust.

 

The Mounting Plate

It just happened that I’d been talking to Steve Presley, who is starting up a custom CNC & 3D printing service, about building some mounting boards for Gadgeteer projects.  I gave him some dimensions and he went to work.  A few days later, I received a perfectly CNC machined piece of 1/4” blue acrylic in the mail and I went to work building the box that would house it.

 

Constructing the Box

	I started by taking a scrap piece of 3/4” walnut and cut it into three pieces. Two long pieces (9 3/4”) would serve as the top & bottom sides of the box.  A 6” piece was cut for the other two sides of the box.
The 6” piece was resawed using the table saw to produce two thinner pieces for the end sides of the box where the openings would exist.
	After resawing, the side pieces were ripped into two pieces to allow for the space on the sides where the external connectors would be located.
Next, I used the router table to mill several dados in the pieces where they would fit together.
	Time for a test fit.  Perfect fit! :)
Let’s glue it up!
	While the sides were drying, I worked on the top & bottom.  I found a wide piece of 7/8” walnut and cut it to 9 1/2” x 7”.
I then resawed it on the bandsaw to produce two pieces roughly 3/8” thick.  A quick pass on the thickness planer to smooth out the saw marks and ensure they were flat and they’re ready to go.
	After giving the glue 24 hrs to harden, I took the clamps off and glued up the top & bottom.  Glue was brushed on to ensure 100% coverage of the glued surfaces.  Too much glue is better than two little.  The right amount of glue will produce some squeeze out that will help ensure you have no gaps.
Using some scrap plywood as cauls to help ensure even pressure and to prevent the wood from clamp damage, I then clamped it up.  Lots of pressure is essential here to ensure there’s no gaps and everything stays together.
	Wait another 24 hours then take off the clamps.  Note all the extra glue on the box.  Also, I forgot to wax my scrap plywood and it glued to the box along the edges.  Not a problem…
Using a hand plane and a card scraper, I removed the extra glue and plywood.  Looking better, huh?
	Next, I put a 3/8” roundover bit in the router table and rounded over all the edges of the box to make it comfortable to hold in my hands.
Using an orbital sander, I smoothed out any problem areas using 80 grit sandpaper then followed up with 120 grit sandpaper over the entire box.  No reason to smooth it any further at this point.  We’ll save the fine sanding for later.
	Time to cut a whole for the CP7 display.  Since it’s hard to see pen marks on the dark walnut, I add some green tape to the areas to be cut and then mark out the opening for the display.
Drill some holes in opposite corners big enough to fit a jigsaw into.
	Cut out the opening using a jigsaw then remove the tape.
Time for a test fit.  NICE!
	So, you’ve probably been asking yourself… “Self, how’s he going to open that box since it’s glued together?”  Simple, we’re going to cut it in half.  Fortunately, we only have to saw two sides of this box since the other two are already open in the middle.  We line up the saw blade so that it cuts perfectly with the edge of the opening and set the blade height so that it’s just a hair short of cutting all the way though.  We don’t want to cut all the way though or the box will flop around when we cut the other side and will create unwanted damage from the saw blade.  Cut both sides.
Using a hand saw, we’ll carefully cut out the hair thin piece that’s holding the two parts together.  The box will likely pop apart shortly after you begin sawing.
	Clean up the remaining bits of the thin strip using a box cutter.
Time for a test fit of the mounting plate.  Oh yea!
	Those joysticks need holes now…
Using a Forstner bit on the drill press, I make quick work of that task.
	The joystick bases are semi-spherical and need a little more space.  So, using a drum sander attachment on the Dremel tool we make the hole openings concave.
Time to cut the dovetails…  We start by routing a dado where the dovetail sliders will run.  This will remove a lot of the wood and make the actual dovetail slot much easier for the dovetail bit and prevent it from breaking.  We do this in two passes.  Cutting half the height in each pass.  We repeat these steps for all four dovetail slots (two on the top and two on the bottom)
	And finally, install the 1/2” dovetail bit and cut the slots.
Lookin’ good?
	Now the tricky part… We have to cut the sliders so that they fit perfectly and don’t allow any slop and make the box appear lose.  We cut some rectangular strips out of hickory (for color contrast) that are exactly the height from top to bottom of the slot and are exactly 1/2” wide.  Keeping the dovetail bit at the same height, we adjust the fence so that it aligns over the bit such that the bottom corner of the bit lines up perfectly with the bottom edge of the hickory strip.  Run each strip across the bit four times to cut the double dovetail slider.
Test fit.  SMOOTH!
	After sanding the entire box with 220 grit then some 400 grit sandpaper, it’s time to start applying the finish.  I apply one heavy coat of Watco Danish Oil first and let it sit 24 hrs.  Be sure not to leave any standing oil.
After the first coat dries, I lightly sanded the whole thing in 400 grit sandpaper.  Then I repeated this process with four coats of satin wipe-on polyurethane.  Then I attached the CP7 using the double-stick tape that is supplied.  AFTER the CP7 is mounted, apply a coat of paste wax to the box and polish it to a smooth sheen.

This has been a fun project that yielded a platform that I’m sure you’ll see as an essential of many future projects.  So, stay tuned and keep making!

Special Thanks

Steve Presley – for milling a perfectly fitting acrylic base plate.  If you have any custom CNC or 3D printing needs, contact Steve.

Skewworks – for making the best UI controls available for .NET Micro Framework and letting me try out his new Tinkr controls.

GHI Electronics – for building the best Gadgeteer components and for setting the gold standard in customer support.  They’ve also built the best NETMF/Gadgeteer community on the planet.  Got Gadgeteer questions?  Bring them to tinyclr.com.

Microsoft’s Channel 9 Coding 4 Fun site featured this project! 

Getting Started With a FEZ Hydra Basic Kit

I’m teaching a NETMF Gadgeteer lab for the Nashville .NET User’s Group this week.  Our gracious sponsors have purchased several FEZ Hydra Basic Kits made by GHI Electronics that we’ll be using to introduce everyone to the Gadgeteer world.

The FEZ Hydra Basic Kit consists of:

• FEZ Hydra Mainboard
• USB Client SP Module
• LED7R Module
• Joystick Module
• LightSense Module

So, the challenge is what can we build with just these components?



THE PLAN
We’re going to build a simple project that will use the green LEDs on the outer ring of the LED7R module as a gauge to show the light level that is reported by the LightSense module.  In the center of the LED7R module is a bright red LED.  I’m going to use the Joystick module to vary the brightness of this LED.

CREATING THE PROJECT
Before we can start assembling pieces and writing code, there are some prerequisites that we need to ensure you have on your laptop.  Install all of these if you don’t have them already.  Make sure that you are running the latest versions.

1. Visual Studio 2010 (or later).  Any flavor will do including Express.
2. Microsoft .NET Micro Framework v4.1 SDK.
3. GHI NETMF v4.1 and .NET Gadgeteer Package

Now that we have all of the bits installed, open Visual Studio and go to File –> New –> Project.  From the “New Project” dialog, we’ll choose the “Gadgeteer” section underneath the “Visual C#” group and we’ll create a new project using the “.NET Gadgeteer Application” template.

After we click “OK”, a new Gadgeteer project will be created and the Gadgeteer GUI designer appears showing an image of the FEZ Hydra mainboard.  If we open the Toolbox we will see a list of modules under the “GHI Electronics” section.  We’ll select the Joystick module and drag & drop it onto the white area somewhere around your mainboard.  Then we’ll do the same for the LED7R module and the LightSense module.

If we left-click on the socket (the orange box) on our module then compatible sockets on our mainboard will be highlighted in green.  We can then drag the connector to the compatible socket that we want to plug the module into and click.  The sockets will then turn blue and a blue wire will be drawn between them.  Repeat for the other modules.

Now we’ll connect our physical components & cables up to match the connection decisions we made in the GUI designer.  Also, we’ll plug our SP power module (the red one) into the D socket (#2) and connect the USB cable to it and to our computer.

TIP: The name below each module in the GUI is the variable name that you’ll use in code to reference the module. If you want to change it, you can do so by click the name in the GUI a couple times to get into edit mode. If you change it after code has been written then your code will automatically update.

Let’s write some code!!!


HELLO WORLD!
Now that everything is connected and powered up, we should see a red LED on our power module, on our mainboard, and on our LED7R module.

Next, let’s make sure that our project is configured to run on our Hydra and not the emulator.  In the Solution Explorer, we’ll right-click on our project and go to Properties.  In the Properties page, choose the “.NET Micro Framework” tab on the left.  We’ll choose the “USB” Transport option.  When we do this, the “Device” should automatically populate with “FEZ Hydra_Gadgeteer” (assuming we only have one mainboard connected to our PC).  Save your options and close the page.

Hit F5!  If everything is connected correctly, the default program should compile and deploy to the Hydra and in our Debug Window we should see a lot of memory information flash by and then finally you should see…


If you don’t then it’s time to call for help…


LED7R MODULE
We’ll start by writing a quick test of our LED7R module.  Note that I have renamed my module from it’s default name to “led” in the code below. 

The LED7R module has the following methods available to it:

Animate()	Cycles through all the LEDs on the module in a circular pattern. There are parameters to determine speed, direction, whether the lights are to be turned on or off, and an option to leave the lights on or to turn them off before moving to the next one.
TurnLightOn()	Turns an LED on. It has one parameter – the number of the LED to turn on. Note the “D” numbers printed next to the LEDs on the module. They are the index numbers.
TurnLightOff()	Turns an LED off. Same parameter as TurnLightOn().

Let’s add some code to test out our LEDs.  In the Program.cs file in ProgramStarted() let’s add the following code below the Debug.Print line that was added automatically.

   1:  // Cycle through the lights to show we're alive.

   2:  led.Animate(100, true, true, false);

   3:  led.TurnLightOff(6);  // a bug causes the last light to stay on...

Hit F5 to compile, deploy, & run the code and you should see the LEDs on the module light up in a clockwise direction.


LIGHTSENSE MODULE
Now that we know our LED7R module is working fine, let’s do something with our LightSense module.  The LightSense module has two methods.  Both are used for polling the sensor to capture it’s settings.

ReadLightSensorPercentage()	Returns the light level as a percentage value from 0.0 (dim) to 1.0 (bright).
ReadLightSensorVoltage()	Returns the light level as a measure of voltage from the sensor (0V-3.3V).

As you can tell from the methods, to do anything with the meter we are going to have to poll it on a regular basis.  For this we’ll need a timer.  At the bottom ProgramStarted() let’s add the following:

   1:  // Light meter 

   2:  var timer1 = new GT.Timer(100);

   3:  timer1.Tick += OnLightMeterTick;

   4:  timer1.Start();

And let’s add a new function to our Program class…

   1:  private void OnLightMeterTick(Timer timer)

   2:  {

   3:      var lightLevel = (int) lightSensor.ReadLightSensorPercentage();

   4:   

   5:      for (var ndx = 1; ndx < 7; ndx++)

   6:      {

   7:          if (ndx <= lightLevel/100.0*7)

   8:          {

   9:              led.TurnLightOn(ndx);

  10:          }

  11:          else

  12:          {

  13:              led.TurnLightOff(ndx);   

  14:          }                

  15:      }

  16:  }

Run the code again and you should now see the LED7R do it’s initialization loop and then the number of LEDs lit should vary depending on the brightness that the LightSense is reading.  Try moving your hand over the LightSense module.  The number of LEDs lit should decrease.

Having fun yet?


JOYSTICK MODULE
It’s time to put our hands on this thing!  I bet you never thought you’d be able to actually touch a C# project :D 

The Joystick module moves in X & Y directions and has a button we can use when the stick is pushed downward.  We’re going to use the Y (up & down) direction of the Joystick to dim the red LED in the middle of our LED7R module.  Fully explaining the Joystick module is beyond the scope of this post.  I’ll do that in the near future.

But wait!  If we take another look at the LED7R module we’ll notice that there isn’t a method we can use to dim LEDs.  What to do?  We’ll use an optical trick called persistence of vision (POV) to make the LED appear dim by using a timer to pulse the light on & off many times per second and vary the length of time that it is on between pulses.

Add the following to ProgramStarted():

   1:  // Monitor joystick to update red LED brightness.

   2:  var timer2 = new GT.Timer(10);

   3:  timer2.Tick += OnRedBrightnessTick;

   4:  timer2.Start();

And let’s add this new function to our Program class…

   1:  void OnRedBrightnessTick(Timer timer)

   2:  {

   3:      led.TurnLightOn(7);

   4:      Thread.Sleep((int)(joystick.GetJoystickPostion().Y*100)/20);

   5:      led.TurnLightOff(7);

   6:  }

Run the program and now when you move the Joystick up & down you should see a slight variation in the brightness of the red LED in the middle of the LED7R module. 

Surely, you’re having fun now???

You may be asking yourself why we used Timers instead of just putting a loop in our ProgramStarted() event.  This is one area where Gadgeteer is very different than traditional NETMF projects.  Read this blog post for an excellent explanation and you’ll save yourself some frustration down the line.


WHAT NEXT?
Well, that’s up to you!  I’ve given you a simple example of a couple things you can do with the FEZ Hydra Basic Kit.  Now, take this example and improve it or come up with something better (a game maybe?).  Be sure to leave a comment on this post and tell me what you did or even better post a link to a video.

Have fun!

Download the complete project source here.

Making a Gadgeteer DaisyLink Extender Module

I’ve been working on designing a .NET Gadgeteer DaisyLink module for a project I’m working on and ran into a limitation of the GHI Extender module that I thought warranted an improvement (aka “hack”).  I’ll detail the steps I took to convert a GHI Extender module into a DaisyLink Extender module in this post.

In case you’re unaware of what DaisyLink is…in a nutshell, it’s a way to chain together Gadgeteer modules so that you only have to use a single socket.  An example of such a module is the GHI Smart Multicolor LED module.  On a DaisyLink module there are two sockets – the upstream socket (the one going toward the mainboard) and the downstream socket (the one going away from the mainboard). 

The communication for DaisyLink happens using the I2C protocol and a neighborhood bus.  It isn’t the intent of this post to explain in detail how DaisyLink works.  For that info, see the .NET Gadgeteer Module Builders Guide.  However, I mention this because the neighborhood bus is the reason for this hack.  All the pins in the two sockets on a DaisyLink module can be passed straight through from one socket to the next except the neighborhood bus (socket pin #3).  This pin has to be activated/deactivated independently as this is the mechanism that the mainboard uses to identify which module it is communicating.

The GHI Extender module is in my opinion the most useful of all Gadgeteer modules since you can basically do anything with it.  Before I started understanding how DaisyLink worked, I always assumed that the Extender module had two sockets on it so that it could be used to develop DaisyLink applications since I otherwise see no application for the other socket except as a way to tie two cables together.  The pins on the two sockets are directly connected together and to a header on the edge of the module.  As I mentioned above, this is a problem since I need to be able to control the value of pin #3 independently on each socket.  So, it’s time to pull out the soldering iron!

If you flip the Extender module over and rub the solder mask a little to polish it, you will see the circuits.  I’ve highlighted in green the circuit for pin #3 that goes to both sockets and to the header pad.  Note that the left-most junction is where the circuit connects to what we will refer to from now on as the downstream socket.  We’re going to add an additional pin to the header called “P3*” (since * is used by Gadgeteer to denote downstream sockets) and make the header labeled “P3” only connect to the upstream socket pin #3.

 

We’ll begin by using a box cutter or Xacto knife to scrape the solder mask off the circuit on both sides of the junction we want to bypass.

 

 

 

Next, we’ll use the box cutter to make four deep cuts through the copper circuit we just exposed and then we will remove the sections.  The cuts to make are shown in red on the picture to the right.  Remove all the copper between each set of parallel cuts.

 

Now that pin #3 of the downstream socket has been isolated, we need to connect the two circuits that we just cut back together so that the upstream socket pin #3 will be connected to the “P3” header.  Start by using the box cutter to scrape a little more of the solder mask off the copper on the right side of the top circuit we cut and below the bottom circuit we cut.  Now, take a thin wire and solder it to the two pieces of exposed copper.  If you have some Kapton tape to stick down the wire while soldering, it will make it a lot easier.  However, you can manage it w/o if necessary.  It also helps if you tin the wire with some solder before attempting to connect it to the PCB.  You will probably not get a large bead of solder to stick to the tiny piece of copper.  As long as you get enough so that the wire is secured that will be sufficient.

We’re done on the back side of the PCB.  Next we’ll attach the male headers to the board.  Although the module has 10 header holes, we will need a section of header that has 11 male pins.  To make it easier to solder every square, put the header into a spare breadboard and put the Extender module on top.  I also like to put an extra piece of header underneath the module on the other side to give it some support and help ensure it stays flat.

Take a small piece of thin insulated wire and strip a very small amount off one end and tin it with some solder.  We’ll solder this to pin #3 of our downstream socket.  Note that in the picture on the right, pin #1 is in the bottom left corner of the socket.  All the even numbered pins are in the top row and the odd numbered pins are on the bottom row.  So, pin #3 will be the second pin on the bottom row.  It will greatly simplify soldering if you have a tiny alligator clamp that you can clamp the wire to the PCB so that the exposed end of the wire is lying on top of the pad for pin #3 as is shown in the picture.  If you have a flux pen, it would be a good idea to add a little flux to the SMD connectors before soldering.  However, if you take care and get it done in one heating you should have no problems w/o additional flux.  Use your soldering iron to heat the wire and pad so that the reflowed solder connects the two together.  You may need to add a tiny amount of additional solder.  Just be careful not to bridge any of the other pads.  Solder the other end of the wire to the extra header pin.

Let it cool a few seconds and then you can remove it from the breadboard.  Take caution when removing it as the extra header pin could easily snap off if torqued side-to-side.

Finally, to help protect the uninsulated wire we added to the bottom side of the board I created a label in Excel and printed and taped it to the underside of the board to help label the extra header in case some day years from now I forget why it’s there.

Now that I have a good way to prototype, it’s time to go finish my new DaisyLink module!  Thanks for stopping by.