ロボット【Pepper（ペッパー）】htmlとimage

ご無沙汰してま～す ٩( ‘ω’ )و

今回はタイトルにあるようにhtmlとimageについて比較していこうと思います ヾ(・ω・ )

何を比較するのかというと、ShowApp等でhtmlを表示し、HTMLのボタンクリック信号をRaiseEventでPepper側に送るのと、ShowImageでimageを表示してTabletTouchで信号を受け取ることについての比較になります ( ･ㅂ･)و ̑̑

まずソースを見ていくと、html側は

<script>
  function init(){
    QiSession( function (s) {
      session = s;
    });
  }
  function yesClick() {
    session.service("ALMemory").then(
      function (ALMemory){
        ALMemory.raiseEvent("toPepper/yesClickSignal", "");
      }
    );
  }
  function noClick() {
    session.service("ALMemory").then(
      function (ALMemory){
        ALMemory.raiseEvent("toPepper/noClickSignal", "");
      }
    );
  }
</script>

<中略>

<div onclick="yesClick()">
  <img src="images/yes.png">
</div>
<div onclick="noClick()">
  <img src="images/no.png">
</div>

Choregrapheのボックス側は

こんな感じになります ヾ(・ω・ )

image側はというと

こんな感じで、TabletTouchは座標設定できるよう拡張してものを使用しています ( ･ㅂ･)و ̑̑

さて、ここでどちらのほうがいいかという話ですが、

現状の私の意見としては、前述のhtmlで処理するほうが良いという結果と考えています ヾ(・ω・ )

理由としては、ファイルの容量とクラス生成の数の違いにあります ヾ(・ω・ )

html側のファイルを見てみると、htmlファイル(3KB)、Yesボタンイメージファイル(24KB)、Noボタンイメージファイル(28KB)の計55KBに対し、

image側はYesNoButtonイメージファイル(156KB)となります (/ω＼)

ファイルが１つなのに画像サイズが大きい為、このような結果となりました (๑•﹏•)

次にクラス生成の数でみると、Choregrapheのボックスの数でみてもらえればいいですが、html側3ボックスに対し、image側は5ボックス使用しています (・ε・｀)

image側のTabletTouchボックスを更に加工して1ボックスとしても、html側の数には及びません (/ω＼)

私の経験の話ですが、Pepperを取扱い始めた当初は座標チェックテストを行って、後述のimage側の処理を採用していた為、今作っているアプリにもその名残があったりするのですが、上にある通りなので、最近ではimage側の作りからhtml側の作りに書き換える作業等を行っています (/ω＼)

皆さんも後から修正することにならないよう、前以てどちらがいいか検討し、作ってもらえたらなぁと思います ლ(´ڡ`ლ)

福岡でロボット開発といえば、株式会社システムトランジスタ
（通称シストラ）ロボティクス部マキマキのカキコミでした～ ＿φ(・ω・ )