How to show the time on a button

Touch Portal How to Guides

This guide will show you how to have the current time on your button.

Step 01: Create a button

We start by creating a button and add the title "Time". We need to have a title for the mobile device to pick up the button.

Step 02: Add a Dynamic Text Updater event

To update the button text without interaction we need to use the event called "Dynamic Text Updater".

Step 03: The Dynamic Text Updater

This event will change the text of the button every couple of hundreds of milliseconds with the text specified in the text field. This not make much sense when using static text but it can be really handy when using Touch Portal States. In our case we want to add the time state to our button. Press the plus button next to the text field.

Step 04: Add the 24-hour Time state

You will now see a large list of all sorts of variables you can use to enrich your text. Scroll through the list of states and select the "Time in 24 hour format".

Step 05: Display the time

The text field of the Dynamic Text Updater will now have a code that represents the 24 hours state we have just selected. If you save the button and refresh the page on your device you will see the button being updated continuously with the current time.

Optional step: Adding extra text

You can add text to the field as well as states. Just keep the code intact and it will be substituted by the correct value. Lets add some text:

End Result

Back to Guide Overview