Working With Buttons
107
PDesign4 Touch Panel Design Program
Creating a Custom Slider (Multi-Bargraph Buttons)
Multi-State Bargraph buttons work differently than regular Bargraph buttons. Note that when you
draw a Multi-State Bargraph button, that there is no slider indicated on the button (in the Design
View window).
Also note that unlike regular bargraph buttons, there are no slider-oriented settings to make in the
Properties Control window. This is because multi-state bargraph buttons, like multi-state General
buttons, use up to 255 states to animate the button action. In the case of Bargraph buttons, you'll be
animating a change in levels as opposed to a push/release, as on Multi-State General buttons.
Rather than assign a prepared slider, like you would for a normal Bargraph button, you can animate
an icon across the states to serve as a custom slider.
Custom sliders on Multi-state Bargraph Buttons work on the panel basically the same as regular
sliders. You adjust a level, you touch the bargraph button and move the slider up and down (or side
to side on a horizontal Bargraph button).
To create a custom slider:
1. Create a Multi-State Bargraph button.
2. Select State 1 in the Properties Control Window (States tab), or in the State Manager window.
3. Apply a Icon Slot assignment to State 1.
4. Set the Icon Justification to Absolute.
5. In the Image and Text Positioning dialog (right-click on the button and select Image and Text
Positioning), move the icon into the position that you want to be the "start position" for the
bargraph slider. The start position for Multi-State Bargraph buttons is always the bottom of the
bargraph (representing the minimum level setting).
6. Add States to the button (up to 255 total), duplicating State 1 (containing the icon). Generally,
you'll want to delete the "extra" state at the end of the sequence, which does not contain the
icon (the original State 2 setting).
7. In the State Manager window, Ctrl+click to select just the first and last states.
Time and Date buttons do not display any text when viewed in TPDesign4. The time
or date is only visible once the project is loaded on a touch panel.
One key difference between regular and Multi-State Bargraph buttons is the way they
work on the panel. The button action is the same (press the bargraph slider and drag
to adjust the level), but while regular bargraph buttons can be set as either horizontal
or vertical, Multi-State Bargraph buttons are always oriented vertically. The user will
always press and drag the slider up and down to adjust the level. Keep this in mind
when setting up a custom slider. Always begin the icon animation starting (at State 1)
at the bottom position, and ending at the top.
Keep in mind that the more states used to animate the movement of the icon, the
smoother and more accurate the slider will be. The range of motion (i.e. the size of
the button that the icon will travel across) needed for the slider should be taken in to
consideration as well. A "short" bargraph button would require less states to create a
smooth motion than a "long" one (that for example spans the entire touch panel
page).
To Next Page
Loading...
Need help?
General
