Instruction manual
Table Of Contents
- TPDesign3 Touch Panel Design Program (Version 3.16)
- Product Information
- Window and Toolbar Reference
- Designing Panel Pages
- Defining your Preferences
- Creating a New Project
- Setting Panel Properties
- Importing Bitmaps
- Importing Icons
- Creating/Editing an Icon
- Managing Fonts
- Creating a New Page
- Setting Page Properties
- Creating a Button
- Assigning Button Color Properties
- Selecting a Button Color
- Changing Button Borders
- Adding Button Text
- Adding a button type
- Selecting an Icon
- Selecting a Picture
- Changing Button Size
- Locking the Position of a Button
- Copying and Pasting Buttons
- Setting General Button Properties
- Setting Joystick Button Properties
- Setting Bargraph/Slider Control Button Properties
- Setting Brightness Button Properties
- Setting Date Button Properties
- Setting Time Button Properties
- Setting Keyboard Button Properties
- Setting Keypad Button Properties
- Setting Panel Setup Button Properties
- Setting Sensors Setup Button Properties on CP4 panels
- Setting Video Setup Button Properties
- Setting VGA Video Setup Button Properties
- Setting Video Window Button Properties
- Setting Video Joystick Button Properties
- Defining External Buttons
- Verifying Channel Assignments
- Creating a Popup Page
- Managing a Popup Page
- Run Simulation
- Downloading a Project to a Touch Panel
- Uploading a Project from a Touch Panel
- HTML Conversion and Server Download

Designing Panel Pages
32
TPDesign3 Touch Panel Program
the button to indicate it is a battery level indicator if the Show Function Codes option
(Edit > Preferences) has been selected on the Applications tab.
11. Click OK to accept any changes made and return to the main program.
Setting Brightness Button Properties
The Brightness button provides the attributes required to control the brightness level of a touch
panel that has bright adjust capabilities built in.
1. Draw a button on the working page by using the Button Draw tool from the Main toolbar; then,
select the border style and colors.
2. Click the Brightness button from the Button Types toolbar. The button is now a Brightness
button.
3. Double-click the brightness button to open the Button Properties dialog box.
4. Under Channel Code, enter the Device and Channel number or click Channel-Assign.
5. Under Variable Text address, assign a Device, Channel, or click VarText-Assign.
6. Under String Output, enter any required data.
7. Click OK to accept any changes made and return to the main program.
Setting Date Button Properties
1. Draw a button on the working page by using the Button Draw tool from the Main toolbar; then,
select the border style and colors.
2. Click the Date button from the Button Types toolbar. The button is now a Date button.
3. Double-click the Date button; the Button Properties dialog box appears.
4. Under Channel Code, enter the Device and Channel number or click Channel-Assign.
5. Under Variable Text address, assign a Device, Channel, or click VarText-Assign.
6. Enter any required data in the String Output field.
7. Click OK to accept any changes made and return to the main program.
Setting Time Button Properties
1. Draw a button on the working page by using the Button Draw tool from the Main toolbar; then,
select the border style and colors.
2. Click the Time button from the Button Types toolbar. The button is now a Time button.
3. Double-click the time button; the Button Properties dialog box appears.
4. Under Channel Code, enter the Device and Channel number or click Channel-Assign.
5. Under Variable Text address, assign a Device, Channel, or click VarText-Assign.
6. Select the Enable Blinking Colon option if you want the colon separator blink when the time is
shown.
7. Enter any required data in the String Output field.
8. Click OK to accept any changes made and return to the main program.