Default language.

Creating floating panels


This section describes the procedures to create the three types of floating panels.

 To create a modeless floating panel (a "drawer")

  1. Create a collapsible horizontal panel holder with fixed-size panels. 

    For the first panel:

    • Make sure that it is a fixed width that is sufficient for the content (for example, a cell-based table). This is done by setting the Initial Size, Maximum Size, and Minimum Size properties equal to the same value.
    • Set the Slack Distribution Order to 10 (a relatively low priority).
    • Turn off the built-in header. (Set the Header State property to Hidden.)
    • Set the Border Thickness property to 0.
    • Set the Background Color property as needed.

    For the second panel (which is the side bar):

    • Make sure that it is fixed width.
    • Make sure it contains:
      • Vertically-oriented text trim (optional)
      • A close button (If this is not available to users, they will not be able to close the panel.)
      • An expand button
  2. To position the panel holder, set the X property to 0, and set the Y property as needed.
    The panel holder can be contained by a panel field (such as a body area) or by the entire view (if the location must be maintained even if the header area of the view changes dynamically).
  3. Set the panel's Float Style property to Modeless.
  4. Create the content of the panel (for example, add a cell-based table or any other fields).
    To move an existing field to a panel, select the field, right-click, and select Move Field To. Then, select the panel's name from the dialog box that appears, and click OK.
  5. Create workflow to:
    • Alternately hide and show the correct button (close or expand), depending on the state of the panel.
    • Expand or collapse the first panel when the buttons are clicked.
    • Refresh the content (if the panel includes a table). The workflow can be invoked when the window is loaded, or when the panel is expanded. Using a temporary variable, workflow could be invoked only the first time that the panel is expanded.

 To create a dialog floating panel

  1. Create a panel or panel holder that will act as a dialog box.
  2. Set the panel's Float Style property to Dialog.
    The panel is displayed in zoom mode , and the panel does not appear on the form.

    BackToView.gif
    To return to the form, click Back to View. To work with the panel again, select it from the Outline view.
  3. To allow the panel to be resizable, set the Minimum Height and Minimum Width properties to values greater than 20.
  4. Create the content in the panel.
    To move an existing field to a panel, select the field, right-click, and select Move Field To. Then, select the panel's name from the dialog box that appears, and click OK.
  5. Create buttons for actions in the dialog box (for example, Previous, Next, OK, Cancel, or Close).
  6. Create a Change Field active link action that opens the panel (for example, when a button or field is clicked).
  7. Create workflow for each button in the panel.

 To create a tooltip floating panel

  1. Create a panel that will act as a tooltip.
  2. Set the panel's Float Style property to Tooltip.
    The panel is displayed in zoom mode (as shown in the following figure), and the panel does not appear on the form.
    To return to the form, click Back to View. To work with the panel again, select it from the Outline view.
  3. Create the content in the panel.
    To move an existing field to a panel, select the field, right-click, and select Move Field To. Then, select the panel's name from the dialog box that appears, and click OK.
  4. Create a Change Field active link action that opens the panel (for example, when a button or field is clicked).
  5. (Optional) Create workflow that will take users to another form or application.
  6. (Optional) Create workflow that will close the panel.
    For example, you might add a Close button. (Note that any mouse action outside of the tooltip will close it, so a Close button is not necessary.)

 

Tip: For faster searching, add an asterisk to the end of your partial query. Example: cert*