This section describes the function and the usage of the frames-grid, which is part of the ToolTipsFactory Animation-Editor.
Navigation
The main function of the frames-grid is to list all frames of the current movie-clip (Animation) in the correct sequential order and to provide the means to easily navigate within movies composed of even hundreds or thousands of frames. The navigation is facilitated by the fact that the frames-grid not only displays the frame-number and other information but also a thumbnail-image, which makes it easier to distinguish the different scenes.
(Picture 1)
As can be seen in Picture 1, the frames-grid displays various information for the listed frames. This columns and the information they display are described in the table below:
| Column | Description |
| Nr | This column displays the sequential frame-number. This number is the absolute position of the frame within the Animation, it is not the ID of a frame. The frames in an Animation are always counted up by one from 0 to the last frame. If a frame is moved to another position in the sequence, it gets a new Frame-Nr. |
| Time (ms) |
This value defines how long a given frame will be displayed before the animation-engine moves to the next frame. This DisplayTime is defined in milliseconds (1000 ms = 1 second). The accuracy of this value is 10 milliseconds in the ideal case, but depends heavily on the speed of the computer, the frame-size (pixels) and the actual CPU-load. Animations with large frames tend to slow-down the rendering of the movie. |
| Size (W * H) |
This column shows the Width and Height (pixels) of the frame. For optimal performance and minimal resources size, this values (specially the Width) should not exceed too much the expected size of the tooltips, which are supposed to display the Animation. |
| Size (kBytes) |
The size of the given image in kilobytes. This is an approximate value. It is mainly used to estimate the impact a given frame will have on the compiled application. |
| Image | Shows a thumbnail of the frame. The image is scaled isotropically to fit the column-height. |
The navigation in the frames-grid is intuitive. It is possible to use the vertical scroll-bar, move up- and down with the corresponding arrow-keys, or use the [Page Up]- and [Page Down]-keys to scroll the frames page-wise.
Thumbnail images
If the displayed thumbnail-images are to small, to see any significant details needed to differentiate the frames, it is possible to resize the height of the grid-rows. In order to do this, it is necessary to move the mouse-pointer in the row-caption between two rows. As soon as the displayed cursor changes to a vertical double arrow, it is possible to change the height of the rows by clicking (left) and dragging the appearing horizontal line as shown below:
As soon as the mouse-button is released, all rows will be resized to the desired height and the thumbnail-images scaled up or down accordingly. The following image shows how this looks:
How much the thumbnail-images can be scaled-up depends also from the width of the frames-grid. The width of the frames-grid can not be changed directly, but it is adapted to the size of the main Animation-Editor window. If the Animation-Editor is maximized it is possible to get even larger thumbnails:
The Frames-grid status-line
Right under the frames-grid, the frames-grid status-line is displayed. The values shown there, provide some information about the whole Animation:
| Value | Description |
| Frames | The total number of frames. |
| Time (ms) | The length of the movie in milliseconds. This is the sum of the display-time of all frames. This value is important in so far, that it would be pointless to specify a shorter AutoPopDelay-time for a tooltip that should display the given Animation - the Animation would never be displayed in its full length, because the tooltip would be turned off before. |
| Size (KB) | The estimated (file-) size of all images in kilobytes. This gives a hint on the space the Animation will be using when compiled into the resources of the hosting application. (Because the Animation-object is serialized and all binary data, such as images is encoded as Base64, the effective space used by the Animation will be about 50% higher as the displayed value.) |
Frames handling
The frames-grid offers several functions to handle frames. It is possible to delete, copy and move single frames or even groups of selected frames. These functions are accessible either through the context-menu available in the frames-grid (right mouse-button) or through shortcuts. The context-menu (with the available shortcuts) is shown in the picture below:
(Picture 8)
These functions are discussed more detailed in the following sections. But before any of these functions can be applied, one or more frames have to be selected.
Frame selection
Selected Frames are marked with a light-orange background shading, as shown in Picture 7.
To select a single frame, you have to click into the the row-caption of the frame:
The active frame (that's the frame with the little blue arrow-head in the row-caption) can also be selected (and deselected) by pressing the [Space]-bar on the keyboard.
A single selected frame can be deselected with [Ctrl] and a click into the row-caption. ([Ctrl]+Click can be used to switch the selection on and off.)
To select a whole sequence of frames, just select the first frame of the sequence, hold the [Shift]-key and select the last frame of the sequence. This will mark all frames in-between as selected:
(Picture 7)
All frames can also be selected at once with the [Ctrl]+A shortcut or through the context-menu (see Picture 8).
A selected sequence can be deselected by either selecting another single frame or by deselecting the individual frames. To deselect all selected frames at once, it's also possible to use the [Ctrl]+U shortcut or the corresponding entry from the context-menu (see Picture 8).
Delete Frames
Selected frames can simply be deleted by pressing the [Delete]-key. Of course the deletion of frames has to be confirmed by the user, in order to prevent the unintentional removal of frames:
Copy, Cut & paste Frames
Selected frames can be copied to the clipboard with either [Ctrl]+C or the corresponding entry from the context-menu.
The selected frames can also be cut-out of the current Animation with [Ctrl]-X or through the corresponding entry in the context-menu. This has the same effect as using the [Delete]-key, but without asking for confirmation. The main difference is, that the cut-out frames are copied to the clipboard and are available to be pasted into another location in either the same Animation or into a new one.
To paste frames (cut or copied) from the clipboard, select the location, where the frame(s) from the clipboard have to be inserted. [Ctrl]+V will then insert the frames from the clipboard above of the selected frame. The frames hold in the clipboard can be inserted repeatedly if required.
Drag & Drop
Selected frames can also be copied by "Drag & Drop". They just have to be grabbed with the mouse-pointer (left mouse-button pressed) and pressed [Ctrl]-key. If the start of the drag-operation is recognized by the frames-grid, a small plus-symbol will appear next to the mouse-pointer:
With the [Ctrl]-key held down, it is now possible to drag the copies of the selected frames to the desired position. As soon as the frame is reached, where the dragged frames should be inserted, the mouse-button is released - and the copied frames inserted.
It is also possible to move selected frames to another position in the time-line by "Drag & Drop". For this, the selected frames have to be grabbed with the mouse-pointer (left mouse-button pressed) and the [Shift]-key held down. If the start of the drag-operation is recognized by the frames-grid, a small empty rectangle will appear next to the mouse-pointer:
With the [Shift]-key still pressed, the cut-out frames can then be dragged to their destination. As soon as the position, where the frames have to be moved to, is reached, the mouse-button can be released and the dragged frames will be definitely moved from their old position to the new one.
Editing
The main function of the frames-grid is to organize the frames along the timeline. Except for the values displayed in the Time-column, all displayed values have only an informative function and can not be modified. The DisplayTime is the only value that can directly be edited in the frames-grid. To edit the value, the cursor has just to be placed into the Time-cell of the selected frame. As soon as the value changes, the row-caption will reflect the fact that something has been modified:
The change can then be committed by leaving the current frame or the modification can be undone by pressing the [Esc]-key.