12.1 Introduction
WorkShop Visual includes a number of tools which assist you in your task of building a user interface and linking it to your application. This chapter describes AppGuru and WorkShop Visual Capture. These tools are powerful stand-alone utilities which work in conjunction with WorkShop Visual. They provide a way of starting a design - AppGuru gives you the basis of a new design while WorkShop Visual Capture gives you the design of an existing application.
If you wish to find out more information on other tools in WorkShop Visual, see the following chapters and sections:
12.2 AppGuru
AppGuru provides a fast way to create a standard interface by giving you access to pre-defined user interface components. Sets of components are stored within templates. You can create your own templates and make them available to other users. Each component is represented in AppGuru by a toggle button and a pixmap. You select which components you would like in your user interface by setting the appropriate toggle button. AppGuru then loads those components into your current WorkShop Visual session.
12.2.1 Templates
One pre-defined template is provided with AppGuru. You can, however, provide your own. This is explained in the Creating Your Own AppGuru Templates section on page 413. AppGuru not only helps you get started with your design, it can also help you keep your interface in line with current user interface style guide conventions.
12.2.2 Default Template Versus User-Defined Templates
The default template provided gives you a general purpose user interface and is suitable for most applications. Adding your own templates is only relevant if you wish all your applications to have a consistent user interface of your choosing - to reflect corporate styles, for example.
12.3 Using AppGuru
This section describes how to use AppGuru with the default template. If you add your own templates, the way in which you then use AppGuru is identical - only the components change.
AppGuru is invoked from the "Tools" menu. The menu item "AppGuru" is a pull-right menu containing the list of available templates. If you have not added any of your own templates, this menu will only contain the default template.
When the default template is selected, the following window appears:
Figure 12-1 AppGuru's Window with Default Template
There are two main areas on AppGuru's window: the component toggles, shown in Figure 12-2, and the associated pixmaps, shown in Figure 12-3.
Figure 12-2 Component Toggles
Each component toggle relates to a particular part of the user interface. The default template components are dealt with in more detail below:
Figure 12-3 Component Pixmaps
The pixmap for a component represents the appearance of that component within the application.
12.4 Component Toggles
The component toggles provide a means of specifying which elements you wish to have in your application.
The components described in this section are taken from the default template. See the Creating Your Own AppGuru Templates section on page 413 for details on using your own templates.
12.4.1 Menubar component
Selecting this option adds a standard menubar at the top of your application window with four cascade buttons labeled File, Edit, View and Help. Each of these has a pulldown menu containing items relevant to those categories.
12.4.2 Toolbar component
This creates a toolbar in your application window with some standard tool icons for New, Open, Save, Print, Cut, Copy, Paste and Help.
12.4.3 Status line component
This creates a status line at the bottom of the application window. This is similar to the WorkShop Visual status line which is described in the Status Line section on page 19.
12.4.4 Tool Palette component
This creates a separate palette of buttons which can be configured to represent different functions.
12.4.5 File Dialogs component
This creates three dialogs:
AppGuru also creates links from the "Open File" and "Save File" options in the File menu to the respective dialogs.
12.4.6 About Box component
Selecting this option adds an about box dialog to your application interface. In addition, AppGuru adds a callback linking the "On Version..." item from the "help" menu to this dialog.
12.5 Creating Your Own AppGuru Templates
A template is a save file created by WorkShop Visual, combined with a set of resources specified in the WorkShop Visual resource file. The save file specifies what is in the template, and the resources specify what can be done to the template within AppGuru.
In the WorkShop Visual resource file, there is a section devoted to AppGuru templates. This specifies which templates are available, the files in which they are contained, and what components within these templates are fixed, i.e. must always be selected.
To create your own template:
- 1. Start WorkShop Visual
- 2. Create a design which contains everything you will want to put into the template.
- 3. Add the AppGuru resources to a resource file which will be picked up by WorkShop Visual. (See Setting up the X Resource File section on page 228.)
If you want to make the new template available to all users of your WorkShop Visual on your system, change the resource file for WorkShop Visual which is in:
$VISUROOT/lib/locale/<YourLocale>/app-defaults
where $VISUROOT is the root of your WorkShop Visual installation and YourLocale is the name of your locale( default "C").
If you only want to use the template yourself, change the file named .Xdefaults in your home directory.
Note - There are other ways of making the X Window System pick up resources for your application. You should refer to your system documentation to work out which method is best for you.
12.5.1 Resources Used by AppGuru
visu.templates
This resource lists the available templates in a comma-separated list. Each template name is used as a key to look up other resources relevant to that template.
The resources for individual AppGurue templates are as follows (replace instances of <template> with the name of the template and instances of <component> with the name of a component in the template):
visu.tm_appguru_menu*<template>.labelString
This resource defines the name of the template as it will appear in the "AppGuru" pull-right menu, which is in the "Tools" menu in WorkShop Visual.
visu.<template>.saveFile
This resource tells AppGuru where to find the save file which contains the template. This must be the full pathname. You can include environment variables; they will be expanded.
visu.<template>.template
This specifies the list of components in a template. The list is comma-separated. A component is a part of the template which can be included or excluded depending on the setting of its associated toggle. Each component is represented by a pixmap (in the pictorial representation of the template) and a toggle button for specifying whether the component should be included or excluded.
visu.<template>.pixmapDirectory
This tells AppGuru where to look for the pixmap files which are used in creating the pictorial representation of the design in the AppGuru dialog. This must be the full pathname and can include environment variables.
visu.<template>.<component>.toggleLabel
This specifies the name of a particular component; it is used to provide a text label for the toggle in the AppGuru dialog which controls the inclusion/omission of the component.
visu.<template>.<component>.pixmap
This specifies the pixmap which is used within the AppGuru dialog to represent the component; it takes the form x, y, width, height, filename, where filename is relative to the pixmap directory described above.
visu.<template>.<component>.widgets
This specifies the list of widgets which make up this component - it takes the form of a comma-separated list. Usually this would be the root widget of the hierarchy for this component. Sometimes this might incorporate other widgets. In the default template supplied with WorkShop Visual the "File Dialog" component includes the File Dialog itself together with the buttons in the "File" menu which have links to the File Dialog (the "Open", "Close" etc.)
visu.<template>.extraPixmaps
Templates can include widgets which the user is not allowed to filter out. For example, the default template has a main window, a number of components which can be used within it, and a number of utility dialogs. The main window is always present in any design generated from this template. The extraPixmaps resource specifies the pixmap(s) which are to be used to represent the non-filterable components. The format is x, y, width, height, filename, x, y, width, height, filename.
12.6 WorkShop Visual Capture
WorkShop Visual Capture allows you to capture dialogs from a running Motif application and drag them into WorkShop Visual. Whether the application has been "hand-crafted" or designed using a GUI builder, WorkShop Visual Capture can create an "xd" file of the application's design.
WorkShop Visual Capture is available from the "Tools" menu. You can also use this tool from the command line as described in the Using WorkShop Visual Capture from the Command Line section on page 422.
12.6.1 Before Using WorkShop Visual Capture
For successful operation of WorkShop Visual Capture, the Motif application you wish to record must have been dynamically linked with the Xt library (libXt). On many UNIX implementations, you can find out whether the application has been dynamically or statically linked with libXt by typing:
ldd AnApplication
If the output mentions libXt, the application has been dynamically linked with the Xt library and can be used with WorkShop Visual Capture. If this library is not present, the application has probably been statically linked with the Xt library. You will have to re-link your application with the Xt shared library if you want to use WorkShop Visual Capture.
WorkShop Visual Capture is completely non-intrusive and will not affect either the performance or the behavior of an application.
12.7 Capture Dialog
When you select "WorkShop Visual Capture" from the "Tools" menu, a dialog is displayed allowing you to type the name of a Motif application to be captured into the text box next to the button labelled "Executable". There is also a text box allowing you to type any arguments you wish to be passed to the application. This dialog is shown in Figure 12-4.
Figure 12-4 Capture/Replay Application Prompt
When you press "OK", your PATH is searched for the named executable. If it is not in your PATH or you are not sure where to find the application, press the button labelled "Executable". This produces a file selection box containing an extra scrolled list, as shown in Figure 12-5. Each item in this list is a directory from your PATH. This path list, however, is the path set up for you when you run WorkShop Visual and may contain some extra directories required by WorkShop Visual. When you exit WorkShop Visual your PATH is the same as it was before running the application. When you select a directory from this list, any files in the directory are shown in the scrolled list labelled "Files".
Figure 12-5 Capture/Replay File Selection Box
You can also run the dialog from the command line. This is explained in the WorkShop Visual Capture section on page 605.
This WorkShop Visual Capture dialog is shown in Figure 12-6. It has two pages - one for WorkShop Visual Capture and one for WorkShop Visual Replay. You can change between pages by selecting from the option menu labelled "Page". For details on the dialog when you are using WorkShop Visual Replay see Chapter 13, "WorkShop Visual Replay".
Figure 12-6 Capture Dialog
The text to the right of "Shell" displays the name of the currently active Shell of the associated application. This is the Shell which will be captured when you press the "Capture" button. Beneath the "Capture" button is an area containing the captured Shells in the current directory.
12.7.1 Saving and Accessing Captured Shells
By default, when applications are captured, files containing the captured design are created in a temporary unnamed directory.
Warning - The temporary directory (and its contents) is removed automatically when you exit the application. If you want to preserve your work, you should be working in a named directory (see below).
Use the "Directory" menu to create a new directory, open an existing one or save the current directory under a different name.
When you open a directory, the dialog displays any captured designs that are contained there. Captured designs are displayed as "thumbnail" sketches of the Shell which was captured.
Using the operations in the "Edit" menu, designs can be cut or copied from one directory and pasted into another. The "Clear" command deletes the selected design.
By convention, captured designs are given the filename suffix ".xd", although this suffix is not displayed in the WorkShop Visual Capture dialog.
Note - A corresponding ".xpm" file is created with each captured dialog design. This is to enable WorkShop Visual Capture to display the "thumbnail" sketch of the dialog in the window holding area.
12.7.2 Using WorkShop Visual Capture
This section is a set of step-by-step instructions showing you how to use WorkShop Visual Capture to capture the design of the user-widget configuration utility supplied with WorkShop Visual, visu_config.
- 1. Select "WorkShop Visual Capture" from the "Tools" menu.
- 2. Type visu_config into the Command field of the Command Execution Dialog and press "Ok".
- The WorkShop Visual Capture tool searches your path (the list of directories set by the PATH environment variable) for the named application, and invokes the first one it finds. Both the visu_config and Capture dialogs are displayed.
- Note that the Capture dialog is effectively attached to the visu_config program, so when you exit the visu_config application, WorkShop Visual Capture also exits.
- 3. Press "Capture" in the Capture dialog.
- A thumbnail sketch of the active Shell of visu_config appears in the Capture dialog. To capture other dialogs, simply display them in visu_config and then press "Capture" again. Each dialog is added to the window holding area in the WorkShop Visual Capture dialog.
- 4. To see the design in WorkShop Visual, drag (using mouse button 2) the thumbnail from the window holding area of the Capture dialog into WorkShop Visual's construction area.
- As you do this, the Shell and its hierarchy appear in WorkShop Visual.
Your WorkShop Visual widget hierarchy now contains the widget structure of the initial visu_config dialog along with all associated resources. The dynamic display looks like visu_config. If you captured any sub-dialogs, they can also be dragged into the WorkShop Visual construction area. They are added as separate dialogs.
12.7.3 Application Modal Dialogs
If your application runs an Application Modal dialog, you will not have access to the WorkShop Visual Capture interface and therefore cannot use the Capture button. Instead, you must press the "hot key". By default, this is set to the F5 function key in the WorkShop Visual resource file. The hot key is translated to the function which effects the capture. The resource file entry is shown below:
*xdsTranslations:"<Key>F5: xdsInteractiveCaptureShell()"
You can change this to another key by editing the WorkShop Visual resource file (which changes it for every user) or by editing the .Xdefaults file in your home directory (which changes it just for you).
Note - If you would like more information on translations, you are advised to consult Chapter 4.3.2 in Volume Four of the "X Toolkit Intrinsics Programming Manual" published by O'Reilly and Associates, or any other comparable book.
12.7.4 Captured Information
You can see straight away that WorkShop Visual Capture has captured the appearance of visu_config. In fact, more than that has been captured. Here is a list of what you have:
WorkShop Visual Capture gives you everything you need for the design of a Motif application. Callbacks, links and other dynamic actions associated with the application are not captured.
12.8 Using WorkShop Visual Capture from the Command Line
WorkShop Visual Capture is supplied as a stand-alone application called visu_capture. Type: visu_capture -x to display basic information about the tool.
The following line gives an example of how WorkShop Visual Capture can be used:
visu_capture -f MyCaptureDesign.xd AnApplication
MyCaptureDesign.xd is the name of the file which will contain the captured application. This file will use WorkShop Visual's save file format. AnApplication is the name of the application you wish to capture.
