Please enable JavaScript to view this site.

CWT User Interface Design Handbook

Navigation: TFT Controls

PiezoButton (TFT)

Scroll Prev Top Next More

<TFT:PiezeButton        Name='AcceptButton'>

Description

The PiezeButton control represents a software controlled button in the user interface. The TFT display found in CWT Compact with Colour display can use up to 4 software controlled buttons in each display panel and each button can be assigned a different function in each panel

Next to these buttons are two buttons for Accept and Cancel available placed ate either side of the soft buttons

Reject
Button

Bottom
One

Bottom
Two

Bottom
Three

Bottom
Four

Accept
Button

Figure 29. Soft Buttons

Each button control is rendered to the display as a rectangle and it is possible to put a describing text inside each rectangle. When the customer presses on a piezo button adjacent to a button control rectangle, the click action defined for that button will be executed. The software has a number of click actions that can be assigned to the buttons.

 

Properties

All properties that can be defined for a button are listed below.

Alignment

Type/Value: “Near”, “Centre” or “Far”

Description:The Alignment property defines the justification of the text inside the button control rectangle.

       “Near”        =  Left justified

       “Far”        =  Right justified

       “Centre” = Centred

ButtonLocationName

Type/Value: LeftFour,
BottomOne, BottomTwo, BottomThree, BottomFour,
RightFour,
WakeUpButton,
TopHatSensor,
StnDispSensor,
BarCodeReaderGoodScan,BarCodeReaderBadScan,
StartButton,
CardDataInputData

Description:The CWT Compact is equipped with six fixed piezo buttons below the display. an Accept button, four programmable buttons, and a Reject button . The start button, top hat sensor and STN Display sensor can also be mapped as PiezoButtons.

The ButtonLocationName property is used to connect a physical piezo button with the corresponding button control.

Click

Type/Value: A string of any length representing the function to call

Description:The Click property defines the action to be performed when a customer presses the button. Button click-function lists all the available click actions.

ClickSound

Type/Value: A string of any length

Description:If the ClickSound property is defined as a valid path to a sound file in the wave (.wav) format, the sound file will be played when the button is pressed. The path is usually given as ClickSound=“\Storage Card\Media\Sound\soundfile.wav”. If no path is defined, or if it is invalid, no sound will be played when the button is pressed.

ExternalButtonTrigger

Type:integer
Description:ExternalButtonTrigger is a key press sent from cdscore by id. These numbers are the same as in chapter Soft Buttons.

When an external button is pressed with the corresponding id this button will perform its click action.

Font

Type/Value: Font formatting string.

See Pre-installed fonts in CWT for available fonts

Description:The Font property defines the font used to render the text on the display as well as the size of the text and the font style. This property can be set for each button control.

Font name, font size and style are all set with the format: “FontName, FontSize, style=FontStyle”.

Examples: “Arial, 24pt, style=Regular”.

NOTE: You can use any custom True Type font by placing the font file in the folder “\Storage Card\Media\Fonts\” and using the font name for that particular font file.

Height

Type/Value: Unsigned integer with value range 0–128 (default 19)

Description:Sets the height of the rectangle rendered as a background of the button control. The 19 pixels default height matches the height of the physical piezo buttons.

KeyIndex

Type/Value: Integer value

Description:Used in combination with the Click property to specify the button behaviour when pressed.

KeyValue

Type/Value: String of any length

Description:Used in combination with the Click property to specify the button behaviour when pressed. KeyValue is a generic string that has different uses depending on the click action specified. For information on how KeyValue is used, see the click action details in Button click-function.

Name

Type/Value: A string of any length

Description:Button name. Must be unique within a panel.

Text

Type/Value: A string of any length

Description:The Text property is used to define a static text rendered on top of the button control background rectangle.

TextModeName

Type/Value: “WhiteText”, “BlackText” (default)

Description:The TextModeName property defines if the text shall be rendered in black (default) or in white. If the text is rendered in white the button control background rectangle will automatically become black.

NOTE: White text is the default mode if TextModeName is not defined for a button control.

Width

Type/Value: Unsigned integer with value range 0–260 (default 50)

Description:Defines the width of the button control rectangle on the display. The default width is 50 pixels, but the width can, for instance, be reduced to create more space for other controls.

 

Control information

Each Button must be assigned a click action to be able to execute anything when the button is pressed. The terminal software has a number of pre-defined click actions for buttons. Some of the click actions use the KeyValue and IndexValue properties. The pre-defined click-functions are described in Button click-function.

 

Examples

The first example is a normal accept button that has the key name “AcceptButton” to make use of the visible/invisible feature described in Button click-function. The click action is “OnAccept” and KeyValue is not defined because accept is the normal setting if the terminals has no external pay units. The button is in position “RightFour” and when pressed, the wave sound file acceptbutton.wav will be played.

<TFT:PiezeButton Name='AcceptButton'
  Text='Accept'
  ButtonLocationName='RightFour'
  ClickSound='\Storage Card\Media\sound\acceptbutton.wav'
  Click='OnAccept'/>

The next example is a typical definition of a zero purchase button that is only visible and active when the customer can get a free time ticket.

The button is in position "BottomOne". No sound is played when the button is pressed. To get the visible/invisible functionality of the button, set Name=“ZeroPurchaseButton”. The click action is still "OnAccept" because the customer accepts the purchase, but the difference compared to a normal accept is that no ticks have been paid:

<TFT:PiezoButton Name='ZeroPurchaseButton'
  Text='Free'
  ButtonLocationName='BottomOne'
  Click='OnAccept'/>

The payment service panel, article panel and tariff package panel have a function to automatically connect different identities to buttons. This allows the creator of the user interface to place depending of the model some buttons in the article panel for instance and then let the software connect the actual article identities to the buttons. If you define more buttons than available articles, the unused buttons will not be shown because they are not used.

Note:
If defining more buttons than available space the exceeding buttons will not be visible.

To use this functionality the button names must match the predefined rules in the software:

Buttons in the article panel must have one of the names “Article1” to “Article4”.

Buttons in the payment service panel must have one of the names “PaymentService1” to “PaymentService4”.

Buttons in the tariff package panel must have one of the names “TariffPackage1” to “TariffPackage4”.

Example

The example is a complete article panel for the CWT Compact that uses this functionality with 3 buttons defined. Leave the Text parameter empty in the button definition. This will cause the software to automatically assign the name of the article (or payment service or tariff package depending on the panel) to the button's Text property. The click action “OnArticleSelectAndConfirm” is assigned to all the buttons to allow the customer to select the article and confirm the selection in the same step to be able to proceed to the next step in the purchase in an easy way.

<TFT:Panel Name='ArticlePanel'>
  <Controls>
    <TFT:PiezoButton   Name='Article1'
        Text=''
        ButtonLocationName='BottomOne'
        Click='OnArticleSelectAndConfirm'
        ClickSound='\Storage Card\Media\sound\button.wav'/>
    <TFT:PiezoButton   Name='Article2'
        Text=''
        ButtonLocationName='BottomTwo'
        Click='OnArticleSelectAndConfirm'
        ClickSound='\Storage Card\Media\sound\button.wav'/>
    <TFT:PiezoButton   Name='Article3'
        Text=''
        ButtonLocationName='BottomThree'
        Click='OnArticleSelectAndConfirm'
        ClickSound='\Storage Card\Media\sound\button.wav'/>
  </Controls>
</TFT:Panel>