| The Visual Form Designer (VFD from now on) is an application used to create forms to be used as data entry panels and/or form view reports. It is a GUI application geared toward end users, although it can be expanded by developers with custom components. Let's have a look at the user-specific features; developer-related material is available on this manual, in the developer section. First off, the basics: each form is composed by one or more pages, which in turn may host one or more components, to be used as decorative widgets, or representing the actual database fields. Pages have some properties that can be customized, such as the tab caption and colors, and an optional background image. In the following picture you can see a simple one-page form with some labels (DescLabel in VFD jargon) and text fields (called here FreeText components). |
| The upper part of the VFD is occupied by the program menu bar and toolbar (which contains the most used features for a direct access to them), then you can find on the center the actual form (in a WYSIWYG view), while the rest of the application space (left side) is filled up with several different controls. Let's have a look at them. The two radio buttons allow you to switch from select mode to add mode. In select mode you can select one or more components, say you want to move them around or change their properties, while in add mode you can add components to the form pages, after having choosed the desired component from the component palette (the yellow list on the middle of the left side of the program window). The help button is used to get help both for the select radio button (a list of keyboard and mouse bindings is then showed) and the various components. Each component has its own meaningful help text, of course, even third party ones (or at least they should). The lower part of the left-side column contains information about the form size; you can change it on the fly by pressing the Change Now button. VFD menus and features The File menu contains standard menu items, such as open form, save (updates the form on disk) and save as.. (store the form on disk after having choosed a new name and directory). The Edit menu hosts several features: cut, copy and paste are (program specific) clipboard commands that let you move components between pages, clone or just plain delete them. Select all and deselect all commands are used to select all of the components of a page (if you have several pages, only the components shown on the current page will be selected). The third menu, Components, contains all of the commands that let you work with, guess what, components. Some background is required in order to understand how to use these commands: when you select one single component, that will be instantly surrounded by a yellow border and it is called the reference component; if you select several components, the one selected last will still be yellow-bordered, while the others will be blue-bordered (deselected components are black-bordered). All of the align operations are considered relative to the reference component (the yellow bordered one). Note: the TAB sequence for the components as it will be seen by the user can be set by the form developer by selecting the components in the desired order before saving the form. Example: you have three components in a page, and you want the user to enter the last first, the the middle one, the the upper one; in this case you should select the last component, the select the middle one and finally select the upper one. When the user will switch between them with the TAB key, the last component, the middle one and then the upper one will get the focus (in this order). |
| Selecting the Custom Properties menu item you will get to customize the reference component properties, if any (customizing properties is a task entirely demanded to the components, therefore some will allow that, while some others won't); usually the custom properties are items such as fonts, captions, colors and such. Selecting the Assign DB Field you will be asked to select or provide a field name to which link your components; e.g: after you have assigned a field to a FreeText component, when you will choose to add a record in the database that uses the form, the FreeText component will be used to gather data for the assigned field. The align and center menu items are used to align the selected components to the reference one. The same size menu items are used to change the size of the selected components so that they will be exactly like the reference component. The fourth menu, Page, contains all of the commands that deal with pages. You can add, remove, reorder, import and export pages. When you export a set of pages, a new .mfr file will be created, and therefore you can use it as a form itself. Imported pages are placed after the last page, but you can of course reorder them. Other options in this page are used to customize the currently displayed page settings: you can change colors and fonts (but they will not be saved, since MaxBase overrides them), the tab color and caption and finally you can choose (or unset) a background image. The library menu is used to add and remove objects from the components palette. Adding a component is very easy: first of all, you should add its class files to the system classpath, then you should choose the add a component menu item and enter the fully qualified class name for the component. Right after that, the component will be displayed at the end of the components palette. Don't forget to save the palette state (with the save library menu item), or you new components will not show up the next time you start the VFD! The last menu, help, contains all of the help-related commands. From here, you can turn on and off all tips, or turn on the active ones (active tips are the ones that were still active when you decided to disable the tip system); currently, the only kind of online help for the VFD is given by means of the context-sensitive tips. Default VFD components The Visual Form Designer comes with a handful of default components that will hopefully cover all, or at least most, of your needs. More components will be added as the VFD is enhanced, and of course you can create your own ones! nrio.DescLabel (a simple label) Can be linked to a field? YES Has custom properties? YES |
| The DescLabel component can be used in two ways: normally, you will use it as a description for your fields and therefore you will not assign any field to it; when you create a form used for printing purposes, you can use DescLabel to represent the field contents because it has a customizable font size (unlike FreeText and FreeTextArea). Creating a small form using DescLabels with a small font gives a much better printed output than using FreeText components and scaling down a normal sized form. nrio.FreeText (your average input gatherer) Can be linked to a field? YES Has custom properties? NO |
| This is one of the most used components, along with DescLabel. The purpose of FreeText is quite simple: accept one line of text. All the characters in excess of the field length limits will be discarded. nrio.CBox (an on/off check box) Can be linked to a field? YES Has custom properties? YES |
| The CBox component can be used to represent field values in the on/off range. The value inserted in the database when the CBox is left unchecked is 0, otherwise it is 1. nrio.FreeTextArea (Accepts several lines of text) Can be linked to a field? YES Has custom properties? NO |
| The FreeTextArea is used to gather text-based input spanning on several lines. nrio.GUIDate (A smart date picker) Can be linked to a field? YES Has custom properties? NO |
| This component is used to present and get dates; by default, it uses the client machine locale settings to represent the date. Dates can be entered either by typing them, or just by clicking on the button on the right of this component, and selecting them from the calendar panel that comes down. GUIDate stores dates in the database using the YYYYMMDD format, which allows a correct sorting order. This component is Y2K immune. nrio.ImageLoader (Displays local or remote images by their URL or file name) Can be linked to a field? YES Has custom properties? NO |
| This component allows you to catalog and display images: it accepts an image file name or URL and displays the corresponding image (if available) in the main component area. Note: The image file name/URL, not the actual image pixel data, is stored on the database. nrio.MaskedText (Accepts one line of controlled input) Can be linked to a field? YES Has custom properties? YES |
| MaskedText is a text-based component similar to FreeText; the main differences are that: A) The component colors can be specified by the user. B) You can specify text rules to be obeyed during data typing stage. The person designing the form can specify a mask for data input: the total number of characters to be entered and their type. The mask is a string (entered as a custom property) in which each character can be one of the following: A) # means one digit. B) A (capital 'a') means one upper-case character. C) a (lower-case 'a') means one lower-case character. D) @ means one digit or one character (both upper and lower cases are accepted). E) Every other character will be reproduced as it is. Example: ##-####-######## can be used to accept phone numbers, and the user will see (from left to right) three underscore lines, a minus sign, four underscore lines, a minus sign, eight underscore lines. nrio.StaticChoice (A fixed list of items, multiple selection of items is not allowed) Can be linked to a field? YES Has custom properties? YES |
| StaticChoice is used when you want to present the user with a list of possible values (defined by the person designing the form); only one item can be selected at a given time, and the caption (string) of the selected item is stored in the database during data input. nrio.StaticList (A fixed list of items, multiple selection of items is allowed) Can be linked to a field? YES Has custom properties? YES |
| StaticList is used when you want to present the user with a list of possible values (defined by the person designing the form); one or more items can be selected at a given time, and the caption (string) of the selected items is stored in the database during data input, with a space separating the strings. |