Bangle.js【画面タップイベント】

タップイベントの設定

Bangle.jsで画面をタップした時に処理を行うコードです。

Bangle.on('touch', 関数名);

サンプルアプリ

画面がタップされた時にカウントアップするカウンターアプリのコードです。

// カウントを保持する変数
var count = 0;

// 画面の表示設定を行う関数
function setupDisplay() {
  g.clear(); // 画面をクリア
  g.setFontAlign(0, 30); // 文字位置の設定
  g.setFont("6x8", 5); // フォントの設定
  g.setColor(0, 0, 1); // フォントカラーの設定
}

// カウントの描画を行う関数
function drawCount() {
  g.drawString(count.toString(), g.getWidth() / 2, g.getHeight() / 2);
}

// 初期のカウントを表示する関数
function showInitialCount() {
  setupDisplay();
  drawCount();
}

// 指定したテキストを表示する関数
function showMessage(text) {
  setupDisplay();
  g.drawString(text, g.getWidth() / 2, g.getHeight() / 2);
  g.flip(); // 画面の更新
}

// カウントをインクリメントして表示する関数
function incrementCountAndShow() {
  count += 1;
  showMessage(count.toString());
}


// 初期表示
showInitialCount();

// タッチイベント
Bangle.on('touch', incrementCountAndShow);