Skip to content

Using Buttons

christie goh edited this page Mar 12, 2019 · 4 revisions

You can specify the behaviour of each button on the watch when the page is active (visible to the user) by implementing the functions below. This is essentially overriding them from the basePage.js.

When the user clicks one of the buttons, top, bottom, left, right, or face the corresponding method will be called.

  rightButtonEvent() {
  }

  leftButtonEvent() {
  }

  topButtonEvent() {
  }

  bottomButtonEvent() {
  }

  faceButtonEvent() {
  }

for example the leftButtonEvent() is overridden on the client/src/js/pages/contactsPage/contactsPage.js

  leftButtonEvent() {
    this.navigate('/');
  }

Long Hold Button Event

When you click on any of the buttons and hold it for longer than 750 milliseconds, you trigger the hold button events instead.

  rightButtonEventHold() {
  }

  leftButtonEventHold() {
  }

  topButtonEventHold() {
  }

  bottomButtonEventHold() {
  }

  faceButtonEventHold() {
  }

Double Click Event

Two rapid clicks of the buttons trigger the double click event.

  rightButtonEventDoubleClick() {
  }

  leftButtonEventDoubleClick() {
  }

  topButtonEventDoubleClick() {
  }

  bottomButtonEventDoubleClick() {
  }

  faceButtonEventDoubleClick() {
  }
Clone this wiki locally