instruction manual TPDesign3 Touch Panel Design Program (Version 3.
Software Warranty Agreement PRE-RELEASE CODE. Portions of the AMX Software may, from time to time, as identified in the AMX Software, include PRE-RELEASE CODE and such code may not be at the level of performance, compatibility and functionality of the final code. The PRERELEASE CODE may not operate correctly and may be substantially modified prior to final release or certain features may not be generally released. AMX is not obligated to make or support any PRE-RELEASE CODE.
Table of Contents Table of Contents Product Information .................................................................................................1 Features ............................................................................................................................ 1 Minimum System Requirements ....................................................................................... 1 Supported Platforms for HTML..........................................................................
Table of Contents Selecting a Picture .......................................................................................................... 26 Image Positioning................................................................................................................... 26 Changing Button Size ..................................................................................................... 27 Using the size to picture feature...................................................................
Product Information Product Information TPDesign3 is a 32-bit Windows® application that enables you to create touch panel pages in minutes. You can use TPDesign3 to import fonts, bitmaps, and icons for use in your file pages and then download the newly created files to either a touch panel or the Internet. TPDesign3 provides point-and-click touch panel programming and page printing.
Product Information ! 75 MB (150 MB recommended) of free hard-disk space ! VGA monitor running a minimum resolution of 800x600 ! Mouse or equivalent pointing device Supported Platforms for HTML Web Servers Touch panel files exported as Inactive HTML are compatible with any Web Server. A Web Client can run these same files locally, without the need for a Web Server. Files exported as Active WebLinx HTML require a Web Server capable of processing ASP scripts that use VBScript.
Product Information FIG. 1 Example touch panel page shows a page with a DVD button. When pressing this button, the desired result is to go to a preconstructed page (or popup page) that allows you to change preferences for the DVD (FIG. 2). The page flip to the DVD popup page (DVD CONTROL) is selected for the Destination. Therefore, in an actual operation of the program, pressing the DVD button creates a page flip to the popup page called DVD CONTROL that contains buttons that control the DVD.
Product Information 4 TPDesign3 Touch Panel Program
Window and Toolbar Reference Window and Toolbar Reference TPDesign3 Windows The first elements available in the Workspace are the Main Menu bar, Toolbar buttons, and Status bar. Double-clicking any area of the Status bar causes the feedback and page flip displays to change to location and size displays. FIG. 3 shows the Status bar elements and identifies the data shown by each. Main Menu bar Toolbar buttons Workspace Status bar elements FIG.
Window and Toolbar Reference Main Menu Provide access to all functional features applicable within a project file. ! File menu items are used on the Project files. • NEW creates a new project file and opens a New Workfile dialog box. • OPEN opens an existing project file. • CLOSE closes an open project. • SAVE saves an open project file with the default information for the name. • SAVE AS saves an open project in a selected folder location, with a manually entered file name, and as a selectable file type.
Window and Toolbar Reference • BITMAPS opens the Bitmap Manager dialog box. Use this dialog to view all of the bitmaps contained in the project file. • ICONS opens the Icon Manager dialog box. Use this dialog to view all of the icons contained in the project file. • PANEL MEMORY shows the amount of memory used in the touch panel. • PANEL EXPLORER shows the files that comprise the current project. • PROPERTIES sets default settings for the touch panel file. ! Page menu options are used on panel pages.
Window and Toolbar Reference • ALIGN sets the alignment on multiple buttons. • MAKE SAME SIZE makes the Height/Width/or both features of selected buttons the same. • HORIZONTAL SPACING adjusts the horizontal spacing of selected buttons. • VERTICAL SPACING adjusts the vertical spacing of selected buttons. ! Windows options give the user the ability to cascade the open page windows from upper right to lower left. Cascading allows you to view all of the window title bars.
Window and Toolbar Reference Standard Toolbar Buttons (Cont.) Delete Page Deletes a touch panel page from the project file currently being developed. Add Popup Page Adds a popup page to the project file currently being developed. Delete Popup Page Deletes a popup page from the project file currently being developed, Manage Popup Page Displays, selects, and edits popup pages created within the currently displayed project file.
Window and Toolbar Reference Main Toolbar Buttons (Cont.) External Buttons Opens the External Buttons dialog box. Channel Maps Opens the Channel Map dialog box to view current channel assignments. Button Borders Toolbar You can use the Button Borders toolbar to add different border styles to selected buttons. The Button Borders toolbar is not selectable from any drop-down menu. It is movable and can be placed in either a vertical or horizontal position.
Window and Toolbar Reference Button Borders Toolbar Buttons (Cont.) Double Shadow Changes the selected button border to double shadow. Single Diamond Changes the selected button border to single diamond. Double Diamond Changes the selected button border to a double diamond. 3D Single Rectangle Changes the selected button border to a 3-dimensional rectangle. 3D Double Rectangle Changes the selected button border to a 3-dimensional double rectangle.
Window and Toolbar Reference Button Types Toolbar Buttons (Cont.) Bargraph Changes an active button into a bargraph button. Sets the button to a bargraph or slider. Data for the bargraph or slider response comes from the Central Controller. This response is unavailable for one-way ViewPoint panels. Brightness Changes an active button into a brightness button. Sets the button to open the Brightness page. This page shows the color palette. Date Changes an active button into a date button to a page.
Window and Toolbar Reference Hotkey Shortcut Information This table lists and describes the different hotkey functions available in TPDesign3. Hotkeys and their Descriptions Hotkey Description F1 Gives you access to the On-Line Help. F2 Toggles the Main Toolbar On/Off. F3 Toggles the Button Borders Toolbar On/Off. F4 Toggles the Button Types Toolbar On/Off. F5 N/A F6 Toggles the Fonts Toolbar On/Off.
Window and Toolbar Reference 14 TPDesign3 Touch Panel Program
Designing Panel Pages Designing Panel Pages This section allows you to quickly create a project, page, button, and then download the project to a touch panel via AXlink. The project file programs consist of individual pages (screens) containing jumps to other pages, links to popup pages, or control commands for devices. Defining your Preferences Before beginning the development of any project, you must first define the panel preferences that will govern the touch panel project.
Designing Panel Pages In order to use graphical representations of both bitmaps and icons, it is recommended that you select the Use Graphical Dialogs options. This allows lists to appear in their graphical rather than textual form. 5. If you want a graphic (such as your company logo) printed in the boilerplate section when you choose to print, select and then select the graphic file on your computer to be used. Then click OK. The boilerplate section is an area on the bottom of printed panel pages.
Designing Panel Pages 3. Enter all relevant information. The data entered in these fields is used to construct the project filename. The information entered is used to construct the project filename. For example, if you enter: AMX01 (dealer ID), Audiovista Inc (company name), SO#12345 (sales order number), rev 3 (revision number), BUD (your initials). When you save the project file, the filename would be: AMX01,Adiovista Inc,SO#12345,rev 3,BUD.tpd. 4. Click OK to close the Project Properties dialog box.
Designing Panel Pages 7. Under Output Strings, enter the Startup, Wakeup, and Sleep strings associated with the touch panel program/project. 8. Select the Date and Time Format. 9. Click to display the Select Color palette; select the color to be used as default for all pages associated with this touch panel program/project. This background page color has precedence over the Page Color setting in the Default Colors tab (as long as it is saved with the project). Importing Bitmaps 1.
Designing Panel Pages 5. You can now Cut, Copy, Paste, Delete, Export, and Rename images in the Bitmap Manager. The Bitmap library cannot contain any bitmaps with identical names. ! If the Default Names for Object Copies field is selected in the Preferences - Application tab, then the newly copied/pasted bitmap will have Copy of added before the original name.
Designing Panel Pages 3. Click Open when you're done selecting the icon files. A warning message appears if the icon exceeds the panel screen dimensions assigned to the project file. 4. You can now Cut, Copy, Paste, Delete, Export, and Rename images in the Icon Manager. Icons can have duplicate names because they are identified by position in the library. Once an icon is copied, you can only paste it into an open position in the manager dialog box.
Designing Panel Pages 5. Once the font appears in the Fonts In Panel field, it is now possible to Copy, Paste, Cut, and Delete the font from the library. Creating a New Page When TPDesign3 opens, the program constructs the first page (Main Page). Pages can be designed as a control panel in itself. You can add buttons, bargraphs, sliders, and drawings to a touch panel page, and then designate the control functions for each object.
Designing Panel Pages This alteration of the page color overrides that of the Preferences - Default Colors tab setting for Page Color, as long as the project session is OPEN. TPDesign3 has the ability to copy page elements to another page or drawing application. Creating a Button Since all touch panel page objects are buttons, begin with button construction. The button type is determined by selecting the choices from the Button Types toolbar. 1.
Designing Panel Pages Selecting a Button Color Using the Button Colors dialog box sets the button color properties for a single or group of selected buttons. If any other buttons are created, their color properties default to either the Default Colors or Button Colors Scheme properties. 1. Select Colors from either the Button drop-down or right-click Button option menus to open the Button Colors dialog box (FIG. 8).
Designing Panel Pages Adding Button Text 1. Select Text from either the Button drop-down or right-click Button option menus to open the window. Each screen handles the text properties for the separate On and Off States. The Text, Font Style, and Justification field options appear on the right of the Off State dialog box. These features can be separately applied to selected buttons.
Designing Panel Pages 8. If you want to change any combination of the text, font, and/or justification for selected buttons (best used on multiple buttons), select the corresponding fields from the right of the Off State dialog box. These features work independently of each other and act on any selected buttons from the panel project. 9. Click OK to accept your changes and return to the main menu. Adding a button type Buttons are typically assigned two main properties: a border and a type.
Designing Panel Pages 4. Click in the On State Icon field (title turns red); choose an icon from the listing to assign the On State of the button. Repeat this step for the Off State. 5. You can clear the individual or both states by using either the Clear or Clear Both buttons at the top of the Select Icon dialog box. The On/Off States of a button can have the same icon assigned to them. 6. Click OK to accept your changes and return to the main menu. Selecting a Picture 1.
Designing Panel Pages 4. Click and select any icons or pictures within the button display window to begin moving them. They can be moved by either using the Nudge Controls arrows or by selecting the image and dragging it to its new position with your mouse. The X, Y image location appears below the nudging buttons (based on the current button size). 5. Click OK to accept your changes and return to the main menu. Changing Button Size 1. Select a button by clicking on it. 2.
Designing Panel Pages Locking the Position of a Button 1. Select a button or group of button from the panel page. 2. Click on the Lock button from the Main Toolbar. Make sure the buttons being locked into position are actively selected. These buttons will not move from their locked position unless they are unlocked using the same steps used to fix them into place. Copying and Pasting Buttons Define the paste parameters for copied buttons: 1.
Designing Panel Pages Allows you to Hide or Show the button location window Window identifies button’s location on the page FIG. 14 Button Properties dialog box Axcess software uses the channel code number to identify the button and its operation. 4. Enter a value for the Channel Code Device (the panel's AXlink base address) and Channel, or select Channel-Assign. To use a device value higher than 1, set the devices used in the Panel properties to a value higher than 1. 5.
Designing Panel Pages Creating a Page Flip Page flips let you select an object on a page and "flip" to another page in the project. You must have two or more pages in your project to setup a page flip. To create page flips: 1. Select or draw a button to use for activating a page flip. Then, double-click the button to display the Button Properties dialog box (FIG. 14). 2. Under Page Flip, select Standard. 3. For Destination, use the drop-down list selection and click the destination page. 4.
Designing Panel Pages 9. Enter any String Output (if necessary). 10. Click OK to accept any changes made and return to the main program. Setting Bargraph/Slider Control Button Properties Bargraph/slider controls are level monitors and adjustable level controls that you can configure to monitor or adjust things such as audio outputs and lighting levels. You can create vertical and/or horizontal bargraphs/slider controls with the buttons on the toolbar (FIG. 16).
Designing Panel Pages 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.
Designing Panel Pages Setting Keyboard 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 Keyboard button from the Button Types toolbar. The button is now a Keyboard button. 3. Double-click the Keyboard button; the Button Properties dialog box appears. 4. Under Channel Code, enter the Device and Channel number or click Channel-Assign. 5.
Designing Panel Pages 7. Click OK to accept any changes made and return to the main program. Setting Video Setup 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 Video Setup button from the Button Types toolbar. The button is now a Video Setup button. 3. Double-click the Video Setup button; the Button Properties dialog box appears. 4.
Designing Panel Pages 4. Enter the Device and Channel numbers and required String Output information. 5. For panels with more than one video window, select Slot ID to open the Slot ID dialog box (FIG. 19). Use this dialog box to assign different video buttons to different video windows. Select the appropriate video window; then, click OK to return to the Button Properties dialog box. Multiple windows are only available if you are using an AXB-TPI display driver box FIG. 19 Slot ID dialog box 6.
Designing Panel Pages Defining External Buttons This feature is only available on touch panels that support external pushbuttons. If your touch panel project doesn't support external pushbuttons, that feature will be inaccessible from the Panel dropdown menu. 1. Select External Buttons to open the External Buttons dialog box (FIG. 21). This dialog is only displayed if the panel type supports external buttons. The number of buttons displayed depends on the type of touch panel being used for the project.
Designing Panel Pages Verifying Channel Assignments Confirm you have assigned channel values to various buttons, through the use of the Button Properties dialog box. To confirm the channels (CODE) and level numbers assigned to each of the touch panel buttons in your project, use Channel Maps 1. Select a button and click the Channel Maps button from either the Panels drop-down menu or Main toolbar to open the Channel Map Locator for the current project.
Designing Panel Pages 4. Click the popup page from the dialog window and hold down the left mouse to drag the popup page where you want it. (Note that the Left and Top values change). 5. Select Reference Background Page using the drop-down menu and click the page name. This shows you what the popup page will look like on any given full-sized page and is for visual reference only. The Reference Background page is the page containing the button that activates the popup page. 6.
Designing Panel Pages 5. Connect an AXlink cable from the Central Controller to the touch panel's rear AXlink connector. 6. Set the touch panel to the Main page. Verify that the Baud Rate (in the Protected Setup page on the panel) is set to the same communication speed set in the Comm Settings tab. 7. Click Connect from the Mode section of the Actions tab. The program retrieves all available touch panels connected to the system. 8. Select the touch panel you want to download the project to and click Begin.
Designing Panel Pages HTML Conversion and Server Download Once you are done creating your project in TPDesign3, you are ready to convert the file contents to HTML and transfer it to an outside FTP server. 1. Click Save As HTML from the File drop-down menu to open the HTML Conversion Options dialog box (FIG. 24). Browse button Emulate External Buttons enables/disables the emulation of external buttons. This feature is only valid for Static and WebLinx HTML exports FIG.
Designing Panel Pages 9. Once completed, click FTP Transfer to begin the process of transferring the information to an outside server via FTP. 10. Enter the IP Address or Host Name. This routes the information being transferred to the specific address or host that corresponds to the external FTP server. Refer to the Downloading to a NetLinx Master on a LAN section for more information on downloading to a NetLinx Master. The file transfer capabilities of TPD3 are to any FTP-capable destination.
033-004-1427 12/02 ©2002 AMX Corporation. All rights reserved. AMX, the AMX logo, the building icon, the home icon, and the light bulb icon are all trademarks of AMX Corporation. AMX reserves the right to alter specifications without notice at any time. *In Canada doing business as Panja Inc. AMX reserves the right to alter specifications without notice at any time.
