Skip to main content

Digilent Shield Brings Multi-Touch Display to Arduino

Main6_c46be04f7d26c196797bcefe73358ac877c4df0f.jpg

Neat shield adds a bright 2.8” display with multi-touch to Arduino projects

The Digilent Multi-Touch Display shield 410-317 (136-8068) and associated software make it easy to add a QVGA resolution touch screen to Arduino projects. In this post, we take a first look at the hardware and software support, before trying out a few of the provided examples.

Hardware

MTDS1_3a7aa714a8afca5f5845a57d02b20f547c116587.jpg

The Arduino shield main features are:

  • 2.8” display with QVGA resolution (320×240)
  • 2 finger capacitive touch panel
  • PIC32MZ microcontroller

Interfacing is via SPI, with Arduino and chipKIT support via the provided Arduino libraries.

MTDS2_1e0e65bce94f77583584b7d552cdca6ca8dcfb02.jpg

For the pinout, schematic and additional hardware details, see the Reference Manual.

Multi-Touch Display System (MTDS)

Image source: digilentinc.com.

The shield makes use of Digilent’s Multi-Touch Display System, whereby a dedicated processor takes care of driving the screen, and its firmware together with host support makes it easy to:

  • Design a UI with only a few lines of code using Arduino libraries
  • Draw images with binary transparency from files stored on microSD
  • Drop buttons and check their status at will using intuitive function calls

In addition to support for chipKIT and Arduino, MTDS can also be used with Arty (Xilinx FPGA/Zynq) platforms via the Pmod Multi-Touch Display Module (410-341) board, together with the PmodMTDS IP core and libraries.

Software setup

uC32_ae06c4d4f88a48d83b0ba214de82d60e4556af7a.jpg

We decided to try out the Shield with a chipKIT uC32 (775-7346) Arduino compatible board and the Arduino IDE. Once the Arduino software installed it was then necessary to install chipKIT Core, which adds support for chipKIT boards. With later versions of the IDE, this can simply be installed by adding a new Board Manager URL, searching for it and then selecting to install.

The Multi-Touch Display Shield Arduino libraries, examples and associated documentation are provided as a ZIP download on the MTDS Reference website. The ZIP also includes a Quick Start Guide, plus bitmap/image resources that are copied to a Micro SD card inserted into the shield.

Arduino Libraries

There are two Arduino libraries supplied for use with the shield.

MTDS

MTDS provides the core API and the library defines three object instances:

  • MTDS mtds; // object used for access to graphics and basic services
  • MTFS mtfs; // object used for access to file system services
  • MTWS mtws; // object used to access to windowing system

A simple example using the first, the graphics system function, to set a pixel on the display:

mtds.SetPixel(hdsDisp, 10, 20, clrWhite)

The provided MTDS Library Programmer’s Reference Manual is fairly comprehensive at 100 pages in length and covers topics including startup and initialisation, along with core concepts such as drawing state, coordinate system and colour.

MyDisp

The MyDisp library provides a high-level interface that builds on MTDS, with simple functions to render graphics and create simple touch interfaces. For example, to draw a line from the upper left corner of the display to a point 100 pixels down and to the right:

mydisp.drawLine(0, 0, 100, 100);

Once again an accompanying programmer’s manual is provided which covers core concepts such as coordinate system, colour values, pen pattern, touch panel operation and UI buttons. Albeit this time the manual is only 21 pages in length, reflecting the simplified nature of the library.

Examples

MtdsDemo1_db686e283cb44e1674fe7b509656ff59610a6242.jpg

One of the screens from the MtdsDemo1 sketch.

Seven demo sketches are provided for the MTDS library:

  1. Uses most of the graphical API functions and cycles through a number of different screens demonstrating their use.
  2. Render graphics onto the display and to save and load bitmaps to and from files on an SD card.
  3. Load bitmaps from an SD card and to then render them on the display.
  4. Demonstrates use of the touch panel.
  5. As with (4) but landscape orientation rather than portrait.
  6. Demonstrates the use of some of the graphical facilities.
  7. Demonstrates the use of the DrawBitmap() function

MyDispDemo3_118a68ff1c62e91cafae8b1a768d22ab5aa203b3.jpg

The MyDispDemo3 sketch demonstrates buttons, touch and a progress wheel.

With an additional three demo sketches for the MyDisp library:

  1. Among other things demonstrates drawing images taken from bitmap files stored on the SD card.
  2. Demonstrates the use of the library to create and use touch buttons to build a user interface.
  3. Similar to (2), but uses different bitmaps for the buttons and then demonstrates a couple of other features, including an example of how to animate a progress wheel.

First thoughts

The Digilent Multi-Touch Display Shield is a neat way of adding a vibrant QVGA resolution screen with capacitive, multi-touch capability to Arduino-compatible platforms. Furthermore, without having to worry about driving the display, implementing graphics primitives and support for touch. As such, not only reducing development time but processing overhead on the application MCU.

Andrew Back

Open source (hardware and software!) advocate, Treasurer and Director of the Free and Open Source Silicon Foundation, organiser of Wuthering Bytes technology festival and founder of the Open Source Hardware User Group.
DesignSpark Electrical Logolinkedin