4D Systems Display Tutorial

[JohnCrow]

4D Systems Intelligent (Visi) Display Tutorial

1.0 Introduction:

4D Systems produce a range of “Intelligent” Touch Screen Displays.
This tutorial will focus on the uLCD-32PTU model which uses the Picasso Processor.

4D Systems produce a range of documentation and application notes for the hardware, and the Workshop Programming Software.
While these documents are very comprehensive and useful they do not cover using the display with Flowcode, so I will attempt to go over using some of the more common aspects of the display with Flowcode 6.
More help is also available in the Flowcode help pages.

Note- The display component macros are available with the professional version of Flowcode.

2.0 Overview:

The workshop software allows various gauges, switches buttons etc to be programmed on to the display. These can interact with the microcontroller in the same way physical switches can.
Examples of a range of these will be looked at and Flowcode programs along with the 4D Workshop source code given.

The software will all be provided as one zip file.

Several of these can be added to one display and can be configured to interact with each other.
The images are held on a uSD memory card plugged into the display.
The card is programmed with the image at the same time as the display is programmed, but must connected to the PC card reader.

2.1 Required Hardware:

Matrix Hardware.

The following matrix hardware is required to run all the example flowcharts in this tutorial.

EB006 Programmer
12 V Power Supply
EB004 LED Board
EB005 LCD Display Board
16F877A Microcontroller
EB-002 Screw Terminal Adaptor (Or Generic 9Pin D-Adaptor)
Dual Potential Divider Board (For ADC Inputs)
Various Cables

4D Systems Hardware.

uLCD=32PTU Display
2GB uSD Memory Card (A Card reader is also needed to program it.)
4D Programming Cable or uUSB-PA5 Programming Adaptor.

Optional
4DEVBoard

Connections:

The display has a 2x5 DIL Header. With this to the bottom of the display, the RHS is used for both programming with the uUSB-PA5 cable, once programmed the display is connected to the microcontroller using the TX & RX pins

Display RES - Reset Line – Not Used
Display GND – 0V
Display RX – Port C6
Display TX – Port C7
Display 5V – 5V supply

If connected to the Development Board
Power is connected to the pins just above the protoblocks.
Rx & TX are taken from the 30 pin DIL Header
RX0 = Pin 26 – Port C6
TX0 = Pin 28 – Port C&

3.0 Programming Using The 4D Workshop Environment:

DO NOT Connect the display to the PC at this time.

Start 4D Workshop
Select the relevant display (LCD-32PTU in this case)
Choose portrait or landscape format.
Select Visi Genie - This now opens the main screen.

Select the Gauges Tab
Left click the first icon
Move the cursor over the image of the screen
Left Click again. – This will place the gauge on the screen.
This can then be moved and resized.
Left click on the gauge
Select Events Tab
Select Report Message on the On Activate Setting
Ensure the display is not connected to the microcontroller or another power source.

Connect the programming cable firstly to the display and once confirmed it is correctly connected, then plug it into the USB Port.

Note Incorrect connection may damage both gauge and the computer USB Port.

Insert a uSD card into the PC card reader
Select Comms from the Menu bar on the 4D Software main window.
It may be necessary to select a COMM Port. Once connected the Icon will turn blue.
Click the Home Tab
Click the Build Copy/Load Icon
This will start the programming
Give the file a name and click ok
Select the drive containing the uSD card and click ok.
This will complete the programming. Display should now show “Drive Not Mounted”

Move the uSD card to the Display card slot.
The display will now show the gauge programmed above.
Disconnect the USB lead from the display.

Any errors should be referred to the 4D documentation

4.0 Example Programs:

A selection of the different type of component will be detailed below and a description of the Flowcode program.
Refer to the comments in the Flowcode programs for more details.

Most of the components are read as 2 separate 8 bit values MSB & LSB.
These then need to be combined back to a single value. Some components will need this as a INT or UINT.
Refer to the display documentation for this.

The values can be combined using 1 of the following methods

Data = (MSB << 8 ) | LSB

Data = LSB + (MSB<<8)

Data = LSB + (MSB *256)

The basic flow of using the display is
1) Initialise the display – 2 second delay will be needed.
2) Wait for the display to signal ready
3) Read Object ID
4) Read MSB
5) Read LSB
6) Combine MSB & LSB

Most of the example flowcharts are very similar apart from using different components.

When testing for the component type its is advisable to use its name rather that the ID number as the documentation mentions that the ID number is subject to change in later versions of the software.

The rotary switch for example has the ID Number 3, but it is preferable to refer to it by its name
Visi4D1 :: VISI_ID_Rotaryswitch
Components can be selected by a dropdown box in the Flowcode Macro.

4.1 Rotary Knob:
A simple rotary knob.
Outputs a value shown in binary on in the LED E-block.
Also shows on the 7 segment LED on the display
The max and min values can be customised.

Photo1 Rotary Knob.

4.2 Rotary Switch:

This example is a 7 position switch (0 to 6). Number of positions is customisable.
Each position sets the value in binary on the LED E-Block (Port B) and shows the numeric value on the LCD (Port A).
It is also shown on the display as a simulated 7 segment display.

Photo 2 Rotary Switch.
 
4.3 Slider / Trackbar:

This is a simple touch sensitive slider.
Moving from bottom to top it outputs a value of 0 to 255. This is shown on the LED E-Block (Port B) as a binary value.
It is also shown on the display as a simulated 7 segment display

The slider sends the data to the microcontroller as “On Changed” and the 7 segment display as “On Changing”.
i.e. While the trackbar is moving the 7Segment display moves in sympathy and once the touch is released the position is then sent to the microcontroller.
The max and min values can be customised.

The On Change and On Changing events are fully documented in the user guide.

Photo 3 Slider.

4.4 Simple Gauge:

A range of analogue gauges are provided. These can all have their Min and Max values configured, along with the colours and fonts of the displays.

This is a simple circular analogue “Speedometer” type gauge. It also has a simple digital readout of the setting in the bottom of the gauge.
Gauges are simpler to use than switches etc as they only need the input data.

Object ID = Visi4D1::VISI_ID_Meter
Object Index = 0
Value = count ( The data from the ADC)

Photo 4 Simple Gauge.

4.5 Dual Analogue Meters:

This example uses 2 Analogue meters to read the outputs of 2 analogue sensors.
Each display must have a separate ObjectIndex, in this case they use 0 and 1.
Again these meters can be customised to suit.

Photo 5 Dual Analogue Meters. 
4.6 Dual Digital Meters:

This is the same program as the dual analogue except it uses the 7 segment LEDs
This also uses Static Text Labels.

Photo 6 Dual Digital Meters.

4.7 Dual Button Latch:

This uses the left button to turn on the LED on Port B BIT 1 and the right button to turn it off.

Photo 7 Dual Button Latching

4.8 Dual Button Momentary:

This uses 2 buttons. One turns on BIT 0 and the other BIT 1. The LEDs stay on for a pre-set time before going off again.

Because this uses 2 buttons they have to be read as separate inputs.
This is done by using Index2 on the ReadByte From Message Macro.
The return variable is either 0 or 1 (would be 0 1 or 2 if 3 buttons were used for example)

A normal decision box is then used.


Photo 8 Dual Button Momentary

The example Flowcharts and 4D Source files are attached below.
Also I have included a screen shot of the 4D Display for each example.

Tutotial Example Files.zip

(24.98 KiB) Downloaded 1024 times

Tutorial Screens.zip

(128.05 KiB) Downloaded 915 times

[JohnCrow]

Advanced Components

The second part of this tutorial will concentrate on some of the more advanced components that are available with the display by using 4D Workshop package.

1.0 Spectrum Display:

This component show a row of vertical bar-graphs, where each individual bar can be programmed.
The example has 24 vertical bars, each displaying a range of 0 to 255.
The range and colours of the graph can be customised using the 4D Workshop Software.
The value sent to the graph is read from ADC0 in the normal way, and the speed of scanning between graphs is set by using ADC1 to give a value between 0 and 255, which is then used to set the delay value.
The graph to be programmed is set by means of a loop which resets back to zero, once it reaches 23.
Data is sent to the graph as follows.

Data = ( Bar_Position << 8 ) | Bar_Value

This method will be familiar from the first section of the tutorial.
Once the program is running, the scan speed is set with ADC1. This is shown on the LEDs at the bottom of the screen.
ADC0 is then moved up and down, the graphs will then follow the output.

2.0 Keyboard:

The display can be programmed to emulate various types of keyboards.
Anything from a full “QWERTY” keyboard to a simple numeric keypad can be setup and customised within 4D Workshop.

This example uses a numeric keypad outputting 0 to 9 and 10/11 for */#.
The values are shown on both the LED E-block and on a LCD display.
The displays are cleared every 500ms and the program just keep looping.

The component only used the LSB to read the data, MSB is always 0, so can be ignored.


3.0 Tank Gauge:

This is a simple graphical representation of a tank. In this instance it looks like a funnel.
The greater the input value, the higher the tank is filled.

As in previous examples, the input is taken from ADC0.

Also on this example, the 7-Segment LEDs are used to show a % full value.

As with most of the components, a high level of customisation is possible, including different shapes of tank.

4.0 Scope:

This component, is a simple oscilloscope.
The input data is taken from ADC0, in this case it is limit to a maximum value of 200 by Flowcode.
The scan speed is again set by taking a value from ADC1 and using it a ms delay in the flowchart.

It will be noted that the scope has a red line around it. This is added as a separated component, “Border”.

5.0 Multiple Components:

When using multiple components on the same form, in such a way that they overlay each, such as in the scope example above, it will be seen that the lower component cannot be moved or selected by clicking on it within 4D Workshop, when it is completely behind the upper component. In this case it is selected by the dropdown boxes on the 4D Workshop object inspection screen.

Advanced_Components.zip

(117.89 KiB) Downloaded 883 times

Advanced_Screens.zip

(102.81 KiB) Downloaded 847 times

[Benj]

Wow some top notch info there John, Many thanks for posting your findings.

The VISI interface is really good, be nice if it made it into some kind of a standard as GLCDs especially are currently a bit of a nightmare in terms of operation and compatibility.

[JohnCrow]

Thanks Benj

I've had the display for almost a year and never got round to really doing anything with it, so I decided to set up for a couple of days and really see what it can do and share my findings. Hope they will help other users to get started with it.

[JohnCrow]

This covers another of the features of the 4D Display, the GPIO Pins.
This gives some simple examples of how to use both the input and output features. Again for full information refer to the data sheets and application notes.

App Note 4D-AN=D4009 covers the Pin In and Pin Out.
It is written around the Diablo Processor, rather than the Picasso that is fitted to the uLCD 32PTU displays, but is still fully applicable.

4D Display – GPIO Connections

The 4D Displays have a range of IO connections on them. These are mirrored on the Development Board, which is what will be used for this article.
The connections are all 5V tolerant, so can be used with the Matrix Programmers.
The Flowcode files and the 4D Workshop source code can be found as a zip file at the end of this tutorial.

Introduction:

This uses 2 of the GPIO connections, IO1 & IO2 These are the top 2 pins on the LHS of the main DIL header on the development board. IO3,IO4, & IO5 are found below this.
This tutorial will use the uLCD-32PTU display, which uses the Picasso Processor.
The first example is a simple input and output will be configured, on the development board, and will not use a microcontroller or Flowcode.

Hardware:

4D Hardware

4D uLCD 32PTU Display
4D Development Board (Connections can be made directly to the display, but this makes it easier)
4D Programming Lead
Short M-F and M-M jumpers
LED
Push Switch
1k-Ohm Resistor
10k-Ohm Resistor

Matrix Hardware:

EB006 Programmer with 16F877A Microcontroller
EB004 LED Board
EB007 Switch Board
EB005 LCD Board

Standard Connections:

Display 5V to EB006 5V
Display 0V to EB006 0V
Display RX0 (Pin24) to EB006 Port C6 (Blue)
Display TX0 (Pin26) to EB006 Port C7 (Yellow)
IO1 is used as Output
IO2 is used as Input

Example Software:

Example 1:
Refer to the circuit diagram for the connections of both circuits, these will be use in subsequent examples as well.

IO1 : This is configured as an output and will be used to turn on a standard Red LED.
The on screen button is configured as toggle, so its touch on touch off.

The output pin is configured as

Idle State = Low
Pulse Duration = 0 (This means stay on. A duration of 1000 would turn on for 1000ms, and then off again.)

IO2: This is configured as an input and will be used to read a standard Push To Make Switch.

Idle State = High
Pulse Duration = 0

The idle state is set to high as the push switch on the development board pulls the pin low to activate it.

These configurations are used in the subsequent examples.

Visi_IO.JPG (7.39 KiB) Viewed 13905 times

Simple_1.JPG (133.44 KiB) Viewed 13906 times

Simple_2.JPG (112.24 KiB) Viewed 13906 times

Example 2 :

The 5V supply is connected via a 10K-ohm resistor to the pushbutton and then to the IO2 pin on the display. The other side of the button is connected to ground.
When the button is pressed the IO2 pin is pulled low.

Flowcode reads the status of the IO2 from the display and sets Port B0
(Shown on the LED E-Block)
Button Pressed IO2 = Low Port B0 High – E-Block LED On
Button Released IO2 = High Port B0 Low –E-Block LED Off

Push_Switch_From_EB006.JPG (115.76 KiB) Viewed 13906 times

Example 3:

Bit A0 on the E-Block Switch Board is read by Flowcode.
The value (0 or 1) is passed to the display and IO1 is set accordingly.
When this goes high, the LED connected to pin IO1 via a 1K-ohn resistor is turned on.

LED_From_EB006.jpg (117.77 KiB) Viewed 13906 times

Software.zip

(13.79 KiB) Downloaded 788 times