Creating Screens with JSON

Under the covers, Profound UI uses its own JavaScript framework to render pages. Within that framework is a JSON format that's used to store the screens and their meta-data.

The Profound UI Rich Display Visual Designer will generate the JSON data for you automatically. However, if you are using the open source version of Profound UI (and therefore do not have the Visual Designer) it's necessary to code the JSON yourself.

Our JSON format describes a given "display file", which is a source file that is broken into individual "formats". Each format describes a screen that can be displayed independently. Formats have both screen-level and item-level properties that should be set. Items are a list of "widgets" (things like text boxes, drop-down boxes, buttons, etc) that are displayed to the user. The overall structure of this JSON document is as follows:

{
  "text": "Description of the whole display file goes here",
  "formats": [{
    "screen": { screen properties go here },
    "items": [
       array of items/widgets on this screen, with their properties
    ]
  },{
    "screen": { second screen's properties go here },
    "items": [
       array of items/widgets on the second screen
    ]
  }]
}

The child pages beneath this one provide details of each of these sections.