Animations and Tweening
156
TPDesign4 Touch Panel Design Software (v2.10 or higher)
Animation Wizard - Select Type (Step 1 of 6)
Select Button > Animation Wizard to start the wizard. This opens the first of six dialogs (Animation
Wizard - Select Type (Step 1 of 6)). Use the radio buttons in this dialog to specify the type of animation
to create (Bitmap or Icon).
Select Bitmap to use bitmaps in the animation.
Select Icon to use icons in the animation.
Select Chameleon Image to use (32-bit PNG) Chameleon images in the animation.
Animation Wizard - Create Sequence (Step 2 of 6)
Use this dialog to specify the images to be included in the animation, and set the sequence of the images.
The Sequence selection is set to "[custom]" by default, and there are no other options in this
drop-down list until at least one sequence has been created. Once you import a series of
images with identical names except for a post-fixed numeric indicator, they will be available
via this drop-down list.
To add the images that will comprise the animation sequence, click the Add button. This
opens the Select Resource dialog, where you can select which images to include in the
animation. Ctrl+click to select multiple files, or Shift+click to select the range of files between
two selections. Note that the only images that are available to choose from are those that have
been imported into the project, through the File > Import Resources option, or via the Import
button on the Resource Manager dialog (see Importing Images and Sounds to Your Project for
details).
In order for images to appear in the Sequence drop down for selection, the images that you use
to create the animation must be named in sequence (i.e. cool_button_spin01.jpg,
cool_button_spin02.jpg, cool_button_spin03.jpg, cool_button_spin04.jpg, etc.). Also, make
sure the numbering convention used for the files is consistent (i.e. don't mix "1" and "01" or
"001"). Although you can edit the sequence of the images in the animation manually, it makes
things easier if you take naming into consideration before importing the files.
You can bring existing animated GIF files into your project via a third-party application (for
example JASC® 's Animation Shop which comes bundles with Paint Shop Pro - version 7 or
higher; there are also many freeware applications available). The general concept is that you
start with an existing animated GIF image, and save each frame in the animation out as an
individual image file (resulting in a series of image files). Once extracted, these files can be
imported into your TPD4 project, and the original GIF animation can be simulated. Note that
since TPDesign4 does not support the (proprietary) .GIF file type, you will have to save the
frames out to a supported file type.
Click OK in the Select Resource dialog to return to the Animation Wizard - Create Sequence (Step
2 of 6) dialog. The image files you selected now appear in alpha-numeric order in the preview
window of this dialog. If the images were named consecutively, you shouldn't have to modify the
sequence at all.
Use the Move Left and Move Right buttons to re-arrange the image sequence (if necessary).
Use the Add and Remove buttons to add/remove selected images from the sequence (if
necessary).
Animation Wizard - Size & Position (Step 3 of 6)
Click Next to proceed to the Animation Wizard - Size & Position (Step 3 of 6) dialog. Use this dialog to
specify the size and position of the animation relative to the button that will contain it.
This dialog tells you two important pieces of information: the size of the animated image, and
the size of the button that will contain it. Use the radio buttons in the top-half of the dialog to
To Next Page
Loading...
Need help?
General
Weight and Dimensions
