AN-00010 ViSi-Genie RGB LED Control with an Arduino Host

Description
  The application demonstrated in this document consists of a 4D display, an Arduino host, and an RGB LED. The user controls the brightness of each of the RGB LEDs thru slider objects on the display.
Supported Processor PICASO, Diablo16
Supported Environment ViSi-Genie
Difficulty Medium

 

File Downloads
Files

Description

This Application Note explores the possibilities provided by ViSi-Genie to work with a host.

In this example, the host is an AVR ATmega328 micro-controller-based Arduino Uno board with a red-green-blue LED.

 The RGB LED is a classic 5 mm with four pins: 

This application note requires:

and other superseded modules which support the ViSi Genie environment

Visit www.4dsystems.com.au/products to see the latest display module products that use the Diablo16 processor. The display module used in this application note is the uLCD-32PTU, which is a Picaso display. This application note is applicable to Diablo16 display modules as well.

  • 4D Programming Cable / µUSB-PA5/uUSBPA5-II
    for non-gen4 displays (uLCD-xxx)
  • 4D Programming Cable & gen4-IB / 4D-UPA / gen4-PA
    for gen4 displays (gen4-uLCD-xxx)
  • micro-SD (µSD) memory card
  • Workshop 4 IDE (installed according to the installation document)
  • Any Arduino board with a UART serial port
  • 4D Arduino Adaptor Shield (optional) or connecting wires
  • Arduino IDE
  • When downloading an application note, a list of recommended application notes is shown. It is assumed that the user has read or has a working knowledge of the topics presented in these recommended application notes.

The ViSi-Genie project and the Arduino sketch are provided as examples to help you along this application note.

Application Overview

The application allows controlling a red-green-blue LED, which allows virtually any possible colour of the spectrum.

The colour is adjusted by moving each of the three sliders, one per component, red, green or blue. A Reset button sets the default mid-range

The screen is connected to a host, in this example an AVR ATmega328 micro-controller-based Arduino Uno board.

The screen sends commands to the host micro-controller, when a slider is moved and when the Reset button is pushed.

 Then the host micro-controller translates the commands and drives the RGB LED.

In the specific cases of the initialisation and reset procedures, the host sends commands to the screen to place the sliders at mid-course.

Developing such an application is done in just four steps:

  • Design the Screen
  • Identify the Messages
  • Write the Host Application
  • Integrate the Screen and the Host.

Setup Procedure

For instructions on how to launch Workshop 4, how to open a ViSi-Genie project, and how to change the target display, kindly refer to the section “Setup Procedure” of the application note:

ViSi Genie Getting Started – First Project for Picaso Displays (for Picaso)

or

ViSi Genie Getting Started – First Project for Diablo16 Displays (for Diablo16).

 

Create a New Project

Create a New Project

For instructions on how to create a new ViSi-Genie project, please refer to the section “Create a New Project” of the application note

 

ViSi Genie Getting Started – First Project for Picaso Displays (for Picaso)

or

ViSi Genie Getting Started – First Project for Diablo16 Displays (for Diablo16).

Design the Screen

Everything is now ready to start designing the project. Workshop 4 displays an empty screen, called Form0. A form is like a page on the screen. The form can contain widgets or objects, like sliders, displays or keyboards. Below is an empty form.

At the end of this section, the user will able to create a form with four objects. The final form will look like as shown below. The control panel includes three sliders, one per component, red, green or blue, with value included between 0 to 255, and one button Reset.

 

 

Add the Sliders

Select the Home menu to display the objects:

The Slider object is located on the Inputs pane:

Click first on the Slider icon…

…and click on the WYSIWYG screen to place it.

 

 The Slider0 is added.

To move the slider, click and drag it to the desired position:

This is the slider for the red component. Change the Palette with High to Red and Low to Maroon:

The WISYWYG screen shows the final result:

Now, the maximum and the minimum values of the slider should be set to 255 and 0 respectively. Enter the value to MaxValue and MinValue:

The slider for the red component is ready now.

Proceed the same way for the green and blue components:

  • For the green component, change the Palette with High to Lime and Low to Green:
  • For the blue component, change the Palette with High to Aqua and Low to Blue:

For both, enter 255 for MaxValue and 0 to MinValue:

The Slider1 and Slider2 are added.

Final result looks like:

For more information on the Slider object, please refer to the application note ViSi-Genie Inputs.

Add the Button

The Button object is located on the Buttons pane:

Click first on the Button icon…

…and click on the WYSIWYG screen to place it.

The WinButton0 is added. 

Set the Caption to Reset and choose the appearance and the colour as you wish, here Colour set to black, Font to white and size to 16:

The control panel is ready now:

For more information on the Button object, please refer to the application note ViSi-Genie Advanced Buttons.

Define the Actions

The interface is ready now but WinButton0, Slider0, Slider1 and Slider2 have no actions defined.

When pressed or changed, the objects raise events. All the events are going to be defined as Message.

The message goes though the serial connection to the host and includes the object identification and the value.

 

When pressed, the WinButton0 button…

…raises the event OnChanged and sends a Message:

When being moved, the Slider0 for the red component raises the event OnChanging and sends a Message:

When being moved, the Slider1 for the green component raises the event OnChanging and sends a Message:

When being moved, the Slider2 for the blue component raises the event OnChanging and sends a Message:

Build the Project

For instructions on how to build and upload a ViSi-Genie project to the target display, please refer to the section “Build and Upload the Project” of the application note

 ViSi Genie Getting Started – First Project for Picaso Displays (for Picaso)

or

ViSi Genie Getting Started – First Project for Diablo16 Displays (for Diablo16).

 The uLCD-32PTU and/or the uLCD-35DT display modules are commonly used as examples, but the procedure is the same for other displays.

Identify the Messages

The screen is going to generate and send messages to the host. But what are those messages?

We need first to build and upload the project, then use either the debugger Codeless Executive Test Instrument or the terminal.

Launch the Debugger

To debug the project, launch the Genie Test Executor or GTX.

Select the Tools menu…

…and then click on the GTX button.

A new screen appears, with the form and objects we have defined previously:

Just try to move one of the sliders and press Reset. Messages are sent to the debugger:

The white area on the right displays

  • in green the messages sent to the screen
  • and in red the messages received from the screen:

All values are in hexadecimal.

The messages are formatted according to the following pattern:

Message from a Slider

The messages from Slider objects are formatted according to the following pattern:

Each slider has its specific number:

  • The red slider is number 00, so the message from the red slider starts with 070400
  • The green slider is number 01, so the message from the green slider starts with 070401
  • The blue slider is number 02, so the message from the blue slider starts with 070402

 

The values allowed for the slider are between 0 and 255. So:

  • minimum value sent on a message is 0 = 0000
  • maximum value sent on a message is 255 = 00FF

The messages are sent when the slider is being moved, because Message has been defined for the event OnChanging, which is raised as many times and as long the slider is being moved.

Message from the Button

The message is formatted according to the following pattern:

Each button has its specific number:

  • the Reset button is number 00, so the message from the Reset button starts with 070600

Value is always 0000 and sent when the button is pressed.

Message from Query Values

The Codeless Executive Test Instrument debugger features four Query buttons, one per object:

Query for Sliders

Pressing Query on top of the leftmost slider…

 

…adds two lines to the message area on the right:

 The first line in green is a command sent by the debugger to the screen, asking the values for the first slider:

The second line in red is the message sent back by the screen, with 0400 for Slider0 or slider number 0 for the red component:

Query for Button

Pressing Query on top of the button…

…adds two lines to the message area on the right:

 

The first line in green is a command sent by the debugger to the screen, asking the values for the button:

The second line in red is the message sent back by the screen:

If the button is pressed…

…the value is

Send Commands to the Screen

The screen sends messages to the host but the host can also send commands to the screen.

A first example is the Query Values seen before.

Another example is sending a value for a specific slider, for example for Slider0, the slider for the red component.

First set the value on the debugger, here close to the maximum…

…press Set below…

 …and two lines are added to the message area on the right:

The first line in green is a command:

The handler for the command is 0400, or the object Slider0, with 04 for slider and 00 for the first slider number 1, and the value is FF.

In case the value is greater than 0xFF, for example 0x0102, the value is coded on the MSB and LSB:

When a command is sent to the screen, the screen always answers by an acknowledgement:

  • 06 for success,
  • 15 for failure.

Use the Terminal

As an alternative to GTX, the terminal is the second option to get the messages sent by the screen to the host.

To launch the Terminal, select the Tools menu…

 

…and

  • Click ‘Terminal connect 9600’ to open the currently selected com port at 9600 baud in the Terminal program.

A new screen appears:

To send the commands on hexadecimal format, press

The commands sent by the host and the messages sent by the screen are the same as with the Codeless Executive Test Instrument debugger.

Enter the hexadecimal code in the Terminal window, including the final checksum:

Here, the command Set Slider0 to value 0xFE is sent to the screen module, or 01 04 00 00 FE FB displayed in green on the terminal window.

And the screen answers with the 06 for successful acknowledgement, displayed on red on the terminal window.

Program the Arduino Host

A thorough understanding of the application note ViSi-Genie Connecting a 4D Display to an Arduino Host is required before attempting to proceed further beyond this point. ViSi-Genie Connecting a 4D Display to an Arduino Host provides all the basic information that a user needs to be able to get started with ViSi-Genie and Arduino. The following is a list of the topics discussed in ViSi-Genie Connecting a 4D Display to an Arduino Host.

  • How to download and install the ViSi-Genie-Arduino library
  • How to open a serial port for communicating with the display and how to set the baud rate
  • The genieAttachEventHandler() function
  • How to reset the host and the display
  • How to set the screen contrast
  • How to send a text string
  • The main loop
  • Receiving data from the display
  • The use of a non-blocking delay in the main loop
  • How to change the status of an object
  • How to know the status of an object
  • The user’s event handler

Discussion of any of these topics is avoided in other ViSi-Genie-Arduino application notes unless necessary. Users are encouraged to read ViSi-Genie Connecting a 4D Display to an Arduino Host first.

 

Shorthand Version for Evaluating a Message

There is an alternative way of evaluating a message besides breaking it down successively. It can be thought of as the shorthand version since it is compact. Instead of using nested if statements, write

 The function

compares the cmd, object, and index fields of Event to the parameters specified by the user. It returns TRUE if the all the fields match the caller’s parameters, FALSE if any of the fields does not match the corresponding parameter. Hence, the statement

evaluates if Event is a REPORT EVENT message from Winbutton0.

Change the Status of a Slider

To change the status of a slider, use the function indicated below.

Extract the Data of a Message

Since the values of the sliders are used to control the brightness levels of the LEDs, the MSB and LSB data bytes of a message are extracted and stored into a variable (slider_val in this example).

The value of slider_val is then passed to one of the LEDs, depending on which slider the message is from.

The statement

can also be written as

 The function returns the LSB and MSB of the event’s data combined into a single variable.

Connect the 4D Display Module to the Arduino Host

Refer to the section “Connect the Display Module to the Arduino Host” of the application note “ViSi-Genie Connecting a 4D Display to an Arduino Host” for the following topics:

 Using the New 4D Arduino Adaptor Shield (Rev 2.00)

    • Definition of Jumpers and Headers
    • Default Jumper Settings
    • Change the Arduino Host Serial Port
    • Power the Arduino Host and the Display Separately
  • Using the Old 4D Arduino Adaptor Shield (Rev 1)
  • Connection Using Jumper Wires
  • Changing the Serial port of the Genie Program
  • Changing the Maximum String Length

Connection of RGB LED

 

Photo of the actual project using jumper wires

Breadboard layout for the RGB LED (made with Fritzing)

Schematic diagram for the RGB LED (made with Fritzing)

 

 

Share: