VGDD:Visual Graphics Display Designer
Published a new video that shows VGDD first configuration and VGDD-Link in action.
Go to the Downloads Page
What is VGDD?
Visual Graphics Display Designer is a powerful tool which enables you to easily and effortlessly design your application's GUI letting you to concentrate on the main program.
- an IDE for developing complex User Interfaces for embedded projects based on Microchip's GOL (Graphics Object Library) widgets for all supported PIC(tm) families: PIC24 and PIC32
- a framework for easing repetitive tasks such as laying out the switch structure to handle messages coming from GOL widgets
- a tool for converting pictures (and fonts) into suitable form to be used into MPLAB(X) projects
It is based on the power of Visual Studio(c) DesignSurface, and this alone gives it - and you - a very big designing power. It adds then a lot of features making developing a Human Machine Interface (HMI) a breeze.
It has a builtin GOL (Graphics Object Library) Toolbox with all the standard widgets:
and GPL objects:
plus a series of Custom Widgets:
- SegDisplay, a big-font 7-segment simulator that uses a vector font and uses a very small amount of memory
VGDD is fully compatible with all the various versions of Microchip Graphics Library:
- Legacy MLA - Microchip Graphics Library version 3.06.04 contained in MLA v2013-06-15 and previous releases - For both 16-bit and 32-bit devices.
- MLA - Microchip Libraries for Applications - For 16-bit devices (PIC24 and dsPIC33)
- Harmony - For 32-bit devices (PIC32) with some limitations.
To see Licensing details, go to the Features page
VGDD is Hardware-agnostic. This means that it generates C code suitable for any hardware supported by the Microchip Graphics Libraries (MLA, formerly MAL). This surely includes your custom developed board provided that it has the right PIC24/dsPIC33/PIC32 MCU on board with the needed amount of FLASH memory and RAM.
If you have to develop an HMI for your application and want to speed-up the development of a working prototype, a number of Microchip Development Boards are directly supported by the Wizard, which lets you start from scratch with your idea in mind and see it running in minutes.
See the Tested Hardware Configuration page to see which combinations of Development Board and Display Boards are supported by VGDD Wizard out-of-the-box.
How does it work?
VGDD lets you create an unlimited number of Screens, put in them how many widgets you want, keep all that stuff toghether organized as a VGDD project and, when you click on the "Generate Code" button, it generates
- a single .c file containing the code to be compiled into your project
- a single .h file with the necessary headers for the other modules to access your GUI
Simply add screens to your VGDD project and in every screen visually draw buttons, labels, bitmaps and so on.
Then click on the "Generate Code" button to have all that tedious work done in seconds!
The code generated by VGDD is intended to be included in an existing MPLAB/MPLABX project in which only slight modifications are needed for it to work with the VGDD-generated GUI.
VGDD relies on a standard "screenState" logic, as used in Microchip's GOL Demo: in its main loop simply call VGDD_<ProjectName>_MsgCallBack and VGDD_<ProjectName>_DrawCallBack function to integrate it.
For a step-by-step guide to its first use, see the How to use VGDD page.
When using GOL widgets, you had to write a lot of code to handle the message-pumping loop messages.
And you had to do it manually.
In other words, for each screen you created you had to write a switch structure, always the same.
Then for each widget you placed on each screen you had to create a switch structure, to detect which widget has sent a message.
And finally, for each possible message you wanted to handle, you could then write your code that "does something"!
All this repetitive task should be performed by you and by hand.
And should be mantained, also! Trying to locate the particular code behind a pressed button could take more time and efforts than modifying the code itself!
What a waste of time and most of all what a boring task!
In VGDD every widget (button, slider, and so on) exposes its events (i.e. for the button widget, the PRESSED event).
You can write your C code directly into the widget itself staying in VGDD.
You simply click the widget, and then choose the event you want to write code for in the Events window.
This way that code remains bound to the object at VGDD level and thus it will be copied along with the widget when you reuse it on other screens/projects.
When you use this feature, VGDD automatically generates the complex switch/if structure for all widgets of all your screens in your project.
You can forget of hand writing code to handle widget interactions in your applications: VGDD does it for you.
You only have to write specific code you want to be executed when the widget has been touched (for example), and thus you are free to concentrate on the main program: the GUI is done!
Is this a complete replacement of hand-wrote code? No: this feature is only a (big) aid when it comes to write GUIs for the embedded world. You remain free to hand-write code, mixing it with the automatically generated VGDD code. No limitations at all, only benefits.
See the Automatic Event Handling section for details
Watch out the VGDD-EventsDemo video to see how much powerful this new feature is!
Direct Bitmap and Font conversion and embedding
VGDD automatically creates for you Microchip's Graphics Resource Converter (GRC) projects with your bitmaps and fonts and runs it transparently in the background to convert them automatically into C arrays and/or bin files, ready to be compiled or copied to your FLASH memories.
No more need to manually launch GRC and to create separate GRC projects for internal/external/bin bitmaps and fonts. Simply use the bitmaps and fonts you want, in any format you want (not only .bmp and .jpg) and change their type from the default "FLASH" to "VGDD_FLASH". That's it. See the GRC Integration page for details
The Font Filter feature, used to reduce the font memory size, with full Unicode charset support is automatically handled, and VGDD adds to this its exclusive SmartCharset feature.
Thanks to its PutImageFromSD Framework, by simply adding (if not yet present) an SD/MMC socket to your existing project design, you can achieve an unlimited graphics GUI, with as many background pictures and slides as you want. Every limited-flash PIC device can have its own rich GUI without having to redesign everything. In fact, if you change the bitmap's type to "BINBMP_ON_SDFAT" VGDD will take care of converting it to .bin format and copying the resulting file to a folder. Then you only have to copy those files to an SD memory card (FAT16 supported, so a limit there is but it's 2GB and so it can be considered "unlimited" :-), build the project and enjoy! See the PutImageFromSD page for details
VGDD handles bitmaps transparency while designing the GUI.
You can design beautiful screens with the desired background and draw transparent buttons on it for an impressive final result.
See the Transparency page for details.
VGDD saves and restores along with the project all Custom Colours defined by users in the ColorDialog (the color chooser).
This feature is particulary needed when working with controllers that use the hardware indexing feature.
See the Custom Colours Support page for details.
VGDD lets you handle on screen every custom control you or someone else has developed! See the Custom Widgets page for details.
The Player feature lets you simulate your GUI while you develop it, playing with buttons and see your interface in action.
This feature allows you to ship your GUI to someone else, may be the graphic expert, for him to see the GUI in action before you develop the actual application.
Actually, with VGDD, GUI and main application development are conceptually separated, giving you the opportunity to outsource the graphics part and concentrate on the main application.
VGDD can integrate its generated code in your existing MPLABX project. See the MPLABX Wizard page to see how simple it is. Not a plugin, but not less productive.
With the Wizard and a supported Microchip Development Board you can build your GUI from scratch in minutes.
External Widgets plug-ins
Due to its open architecture, VGDD is capable of using external plug-ins which deliver ready-made complex Widgets to be used out of the box.
This is a major feature.
Are you developing a complex GUI with many screens on which some Widget should be "static"? The new VGDD's feature, Master Screens, lets you overlay such Widgets in an extremely easy way.
Do you want to see how your GUI looks on a bigger display?
Or are you moving your existing application to a cheaper and smaller display for mass production?
That would mean reposition and resize each and every Widget throughout the entire project, one screen after the other!
But don't worry: VGDD does it for you: simply change the default screen size in Project Settings and click on the Migrate button: everything will be proportionally expanded (or shrinked).
A quick tour into the Wizard just to tell VGDD which display to use and you're ready to go.
A long awaited feature is Bitmaps Scaling which enables a new level of freedom while designing GUIs
Big projects need some form of optimization, and so now you can give a Screen a Group property to keep them grouped and better handle them without scrolling all day in the Project Explorer.
Project Load Optimization
VGDD now handles project loading in a much better way, and it's FAST!
Custom Hardware - User Templates
Now it's easy to add VGDD Wizard support to your custom board. See the VGDD:User Templates page for details.
VGDD integrates an HTML source code editor with a built-in preview functionality. This allows you to develop embedded web sites with ease and to upload the final version to the target hardware.
See the HTML Editor page for more details.
VGDD Now support designing GUIs with multiple languages. see the Multi-Language page for details
For a demo of what you can do with VGDD and how to do it, see the VGDD Video page!
Take a look at the ScreenShots page to see what can be done with this tool.