Graphics Widget Help


Serial Graphics Help

Graphics Window

Help Index


Programming Help

Working with Serial Graphics is easy! Please read the steps below for how to use the Serial Graphics API.

Known Bugs: The scroll wheel pans instead of zooms and svg image line widths aren’t saved with a cosmetic pen.

How to create a Serial Graphics Widget Window

Before creating a Serial Graphics Widget Window you need to establish a serial communications connection to Omnia Creator first using the ILCore object. ILCore takes care of connecting to Omnia Creator using the fastest possible serial communications speed; that your microcontroller can run the Omnia Creator Interface Library code at so that you don’t have to worry about baud rates anymore.

With Omnia Creator, worrying about baud rates is a thing of the past!

Please note: you need to make sure that your serial port’s baud rate is set to Auto in Omnia Creator for the Omnia Creator Interface Library to work. You can also force your serial port’s baud rate to be another value in Omnia Creator for interfacing with devices that aren’t running the Omnia Creator Interface Library code.

To get started with Serial Graphics, first include the Omnia Creator Interface Library in your code (line 1). Then declare the ILCore and ILGraphics objects (lines 3 and 4). In your main/setup function initialize communication with Omnia Creator using the core.init() function (line 8). core.init() takes care of setting up serial communications with Omnia Creator for you. Once you’ve initialized ILCore DO NOT USE YOUR NATIVE SERIAL FUNCTIONS ANYMORE! If you need to receive or send characters use ILCore to do it for you. ILCore wraps around your native serial port and supplies its own functions to access your native serial port like read, write, print, println, etc. However, if you still want to write/print to your native serial port, this is okay and will not cause any problems. Any text sent by your microcontroller will be printed to Omnia Creator’s standard serial terminal if you use your native serial write/print functions or ILCore’s write/print functions. But, you need to use the ILCore functions for receiving serial data. Calling your native serial read functions will cause the Omnia Creator Interface Library to lose synchronization with Omnia Creator.

Please note: you can use the ILCore object to open dialog boxes on the computer and get the results. You’re not going to really ever need to type into the serial terminal to command your microcontroller anymore!

Next, after initializing the core object you can clear all the previous Widget Windows from Omnia Creator’s memory by calling core.clearAll() (line 9). Any open Widget Windows should disappear after executing this line of code. If you don’t clear previous Widget Windows from memory you can still keep adding data to them from your microcontroller. However, you’ll need to clear a previous Widget Window from memory if you change the Widget Window’s type when you initialize it in your code. Omnia Creator’s Widget Menu also has a Remove Widget command and a Remove All Widgets command for this purpose. Omnia Creator will print out debug messages when there’s a problem that you need to address.

Finally, you can create the Serial Graphics Widget Window by calling graphics.init(&core, “Hello World”) (line 11). The first argument to graphics.init() is a pointer to the core object. All you need to do is pass it &core always. Passing &core connects the child ILGraphics object to parent ILCore object. The second argument to graphics.init() is a title string for the Widget Window. You can make this string whatever you want. But, please try to keep it short. If you’d like a docked Widget Window call the initDocked() function instead of the init() function. This will create the Serial Graphics Widget Window as a docking window that can dock itself inside of the main Omnia Creator window. Otherwise the init() function will create the Serial Graphics Widget as a top level window.

After executing this code a Serial Graphics Widget Window should appear!

How to customize a Serial Graphics Widget Window

Once you’ve created your Serial Graphics Widget Window you can customize it. You can set the drawing line color, set the drawing line style, set the drawing fill color, set the drawing fill style, set the drawing rotation, set the drawing scale, and you can set the background color. There’re get functions for each one of the above properties too!

By default Serial Graphics Widget Windows draw objects using the Cartesian Coordinate System. However, if you need to draw objects from a Polar Coordinate System you can tell Omnia Creator through ILGraphics by setting the Serial Graphics Widget Window’s coordinate system. You can specify whether to use degrees or radians while in the Polar Coordinate System too!

How to draw objects on a Serial Graphics Widget Window

You can draw objects on the Serial Graphics Widget Window in ten ways by using drawText(), drawLine(), drawQuadraticLine(), drawCubicLine(), drawArc(), drawChord(), drawTriangle(), drawQuadrilateral(), drawRectangle(), and drawEllipse().

The above functions use integer values, if you need to use a floating point value add a capital F to the end of the function name for the floating point version – i.e drawTextF(), drawLineF(), drawQuadraticLineF(), drawCubicLineF(), drawArcF(), drawChordF(), drawTriangleF(), drawQuadrilateralF(), drawRectangleF(), and drawEllipseF().

How to draw lots of objects on a Serial Graphics Widget Window

Drawing a single object to a Serial Graphics Widget Window at a time is inefficient. A serial communications connection to Omnia Creator will never be efficient drawing one object at a time. However, you can increase the efficiency by using the drawTexts(), drawLines(), drawQuadraticLines(), drawCubicLines(), drawArcs(), drawChords(), drawTriangles(), drawQuadrilaterals(), drawRectangles(), and drawEllipses() functions which can send up to 256 objects in one function call.

How to clear objects from a Serial Graphics Widget Window

Clearing objects from your Serial Graphics Widget Window is easy. You can clear a rectangle or just remove everything.


User Interface Help

You can find information about user interface functions below:

Known Bugs: The scroll wheel pans instead of zooms and svg image line widths aren’t saved with a cosmetic pen.

Zoom In

To zoom in on whatever is under the mouse cursor go to the File Menu and click Zoom In. You can use the scroll wheel to zoom in also.

Zoom Out

To zoom out on whatever is under the mouse cursor go to the File Menu and click Zoom Out. You can use the scroll wheel to zoom out also.

Zoom Fit

To zoom the viewport to fit all data contained in it go to the File Menu and click Zoom Fit. You can double click on the viewport to zoom fit also.

Panning

To pan around in the viewport left click on the viewport and drag the mouse.

Tooltip

To display a tooltip of the X and Y coordinates of a data point in the viewport hover the mouse cursor over a data point in the viewport.

Save Raster Image

To save a raster image of the viewport or the zoomed fitted viewport to a bmp, jpg, or png file go to the File Menu and click Save Raster Image. You can select the resolution to save the image at – between 1-65,535 pixels for both the horizontal and vertical dimensions. Please note: the line widths and text sizes will not increase with a higher resolution.

Save Vector Image

To save a vector image of the viewport or the zoomed fitted viewport to a pdf or svg file go to the File Menu and click Save Vector Image. You can select the resolution to save the image at – between 1-65,535 pixels for both the horizontal and vertical dimensions. Please note: the line widths and text sizes will not increase with a higher resolution.

Export State

To export your graphics state go to the File Menu and click Export State. This will export your graphics state to a JSON file that you can open with Omnia Creator later to recreate your Serial Graphics. Feel free to edit the exported JSON file.

Import State

To import your graphics state go to the main Omnia Creator window, open the Widgets Menu and click Import Widget State. Select the JSON file you want to open and Omnia Creator will recreate the saved Serial Graphics Widget Window for you.

Please note: the new Serial Graphics Widget Window is a static read-only visualization of your data and is not connected to your serial port in any way.