GUI Development using 8th

How does 8th handle GUI applications?

One of the most difficult problems in “cross-platform” development is how to get a “GUI” (graphical user-interface) to look the same across platforms, while retaining more than just the bare-minimum of functionality. That is to say, how to get truly functional GUI applications which operate the same across platforms. That 19” monitor on your Windows machine isn’t going to have the same characteristics as the Galaxy Android phone or your iPad or iPhone. So you need a flexible system.

The approach taken by 8th is to build upon the excellent JUCE library, which provides an attractive GUI while also giving more than the lowest-common-denominator in terms of functionality.

In 8th, a GUI layout is created using JSON as the data-description language. The layout is a JSON “object”, whose keys determine the specifics of the layout. For example, this object and the attendant code will produce the following on-screen item:

{
   "kind" : "win",
   "wide" : 128,
   "high" : 128,
   "title" : "Small Demo",
   "bg" : "grey",
   "children" :
   [
      {
         "kind" : "btn",
         "bounds" : "10, 10, parent.width-20, parent.height-20",
         "bg"   : "pink",
         "label" : "Bye!",
      }
   ]
} var, guiobj

: app:main 
   guiobj @ g:new g:show ;	

That code results in this GUI when run:

GUI Example

Note that the GUI as shown on screen was entirely defined by the JSON data. You could therefore store different GUI screens in a database, or read them from the network — there is no need to hard-code layouts.

This is a very small demonstration of the GUI capabilities of 8th. For much more information, simply download 8th and look through the copious samples and the manual.