Designing Graphical Displays in Flowcode

Flowcode includes a huge range of components and software that allows you to design feature and graphics rich colour touch screen display systems.

Display Design Tools

A full library of components for driving touch screen graphical displays is included within Flowcode. These include: display drivers for the most popular touch screens, graphics widgets, graph widgets, touch screen components, WYSIWYG graphical display designer and menu control subroutines.

These components allow you to design touch screen graphical displays based on a wide range of 8, 16, or 32 bit microcontrollers.

Many display design options

WYSIWYG options

WYSIWYG Editor

Flowcode includes a full What You See Is What You Get (WYSIWYG) editor. The display plugins component category includes primitives for rectangles, circles, ellipses, lines, rectangles, rounded rectangles, sliders, text and bitmaps. All can be declared as touchable objects to allow you to create highly functional touch screen systems. Simulation helps you to quickly debug your project.

WYSIWYG designer is available on the industrial and educational versions of Flowcode.

Display Scenes

The scenes features allows you to design multiple scenes for your display system using the WYSIWYG editor. Touch screen buttons allow you to direct your program to different scenes in your project using simple 'If' and 'Switch' statements. Scenes make the graphical design of your project super easy leaving you more time for coding. Simulation allows you to check the navigation and logic of your program before downloading saving you further time.

Simulating scenes in action

QR code generator simulation

QR Code Generator

The QR code generator allows you to display a QR code on a graphical display. This allows you to extend the functionality of your electronic system using the mobile phones of your users. For example: you can direct users to a web site for further information, for reordering parts or stock, or direct users to a web site where further control and data gathering functions for your system are available.

Supported Screens and Touch Drivers

Flowcode supports many of the popular display driver chips and touch screen driver chips. This means that you will easily find a display to match your needs.

Driver chips support multiple resolutions technologies and colour depths. The result is that Flowcode is compatible with thousands of colour graphical displays that can be driven with both series and parallel communications protocols from standard 8, 16 or 32 bit microcontrollers.

Extensive component library

Graphs in action

Graphs

Two graphing components allow you to use a graphical display to show time-varying parameters in your projects. Up to 8 separate plots can be made simultaneously, and scrolling of data automatically is an option.

Fonts

A small number of fonts can be compiled into the microcontroller memory - but they take up a lot of room, so fonts can also be embedded onto an SD card linked to the microcontroller with the SPI bus.

We have focussed on providing multiple sizes of Arial, Arial bold, Courier and 7-segment fonts. Further fonts can be designed and embedded into Flowcode using an external font design package.

Fonts in simulation

Bitmaps in simulation

Bitmaps

Bitmaps can be compiled to the microcontroller memory during compilation, or can be stored on an SD card. Storing bitmaps in the microcontroller is a great solution for small bitmaps like menu and navigation icons.

E-Blocks 3 Upstream Boards

E-Blocks 3 upstream boards are fitted with a 3.5 inch colour graphical touch screen display. This is a good size choice for many electronic systems. This includes an SD card with many Arial, Arial bold, Courier and 7-segment fonts pre-loaded.

E-Blocks 3 Upstream Board

Learning More

Examples on touch screen menu control and graphical display projects are available in the Examples menu shown on Flowcode startup.

Videos accompanying the programs are available on the Flowcode YouTube site.