IO: アニメーション

obnizはインターネッと経由でIOの操作を行うため、高速なIOのON/OFF切り替えなどを行うことはできません。
例えばLEDのダイナミック点灯をするために1msごとにIOをON/OFFしたい場合などです。
そこで、obnizにはIOアニメーションという事前にIOに対して行いたいことをまとめてobnizに登録できる機能があります。
これを利用することで高速なIO切り替えをインターネット速度に依存せずに行うことができます。

loopアニメーション

現在のobniz.jsでは登録した動きを繰り返す"loop"アニメーションに対応しています。
今回はこれを利用してLEDのダイナミック点灯を行ってみます。

登録するには以下のようにします。

obniz.io.animation("ANIMATION_NAME", "loop", [
  {
    duration: 10,
    state: function(index){
    }
  },{
    duration: 10,
    state: function(index){
    }
  }
])

ANIMATION_NAMEはアニメーションの名前になります。違う名前で複数のアニメーションをobnizに覚えさせることができます。
覚えると言ってもobnizの電源が切れてしまえば忘れてしまうので、動いている間の話になります。
loopがアニメーションが繰り返しであることを意味しています。止めない限りずっと繰り返されます。

最後にある配列が繰り返しさせるIOの動きになります。それぞれ状態と、何msその状態を続けるのか。そしてioをどんな状態にするのかを指定します。この関数の中でobniz.io0.output(true)などを書くことで状態を設定します。

試しにLEDをダイナミック点灯してみましょう。
ダイナミック点灯とは目に見えないほど高速につけたり消したりすることで
明るさを調整したり、1つのIOだけで複数のLEDを制御する方法です。

今回はLEDを2つ使います。もちろんいつもどおり抵抗入りのLEDです。

0と10がそれぞれアノードなので、以下のプログラムで2つとも点灯できます。

var obniz = new Obniz("OBNIZ_ID_HERE");
obniz.onconnect = async function () {
  obniz.io1.output(false);
  obniz.io11.output(false);
  obniz.io0.output(true);
  obniz.io10.output(true);
}

では、アニメーションを使って、1秒ごとに交互に点灯させてみましょう。

var obniz = new Obniz("OBNIZ_ID_HERE");
obniz.onconnect = async function () {
  obniz.io1.output(false);
  obniz.io11.output(false);
  obniz.io.animation("test", "loop", [
    {
      duration: 1000,
      state: function(index){
        obniz.io10.output(false);
        obniz.io0.output(true);
      }
    },{
      duration: 1000,
      state: function(index){
        obniz.io0.output(false);
        obniz.io10.output(true);
      }
    }
  ])
}

どうでしょうか。片方をONにしたらもう片方をOFFにする、
そしてこの状態が1秒続くように設定しています。

それが終わったら反対に1秒です。

これで交互にLEDが点灯すると思います。

しかし、1秒程度ですとなにもアニメーションなんて使わなくてもobniz.wait()を使ってもできてしまいます。
今度は時間をもっと短くして高速に点灯させます。

var obniz = new Obniz("OBNIZ_ID_HERE");
obniz.onconnect = async function () {
  obniz.io1.output(false);
  obniz.io11.output(false);
  obniz.io.animation("test", "loop", [
    {
      duration: 1,
      state: function(index){
        obniz.io10.output(false);
        obniz.io0.output(true);
      }
    },{
      duration: 10,
      state: function(index){
        obniz.io0.output(false);
        obniz.io10.output(true);
      }
    }
  ])
}

どうでしょうか。durationの時間を変えてみました。
io10の方がio1よりもずっと長くtrueになっているので、右側のLEDのほうが明るいと思います。

LEDが目に見えてチカチカすることがあると思います。これは速度が足りないのではなく、obnizがWi-Fiの通信などに気を取られていると一瞬動作が止まることがあるので、それによりアニメーションが止まるとこのようにチカチカすることがあります、

停止と再開

アニメーションを一時停止したり、再開することも可能です。以下の関数から可能です。

obniz.io.animation("animation-1", "pause") // 一時停止
obniz.io.animation("animation-1", "resume") // 再開
obniz.io.animation("animation-1", "loop") // 終了

早速使ってみましょう。

var obniz = new Obniz("OBNIZ_ID_HERE");
obniz.onconnect = async function () {
  obniz.io1.output(false);
  obniz.io11.output(false);
  obniz.io.animation("test", "loop", [
    {
      duration: 1,
      state: function(index){
        obniz.io10.output(false);
        obniz.io0.output(true);
      }
    },{
      duration: 10,
      state: function(index){
        obniz.io0.output(false);
        obniz.io10.output(true);
      }
    }
  ])

  await obniz.wait(2000);
  obniz.io.animation("test", "pause")


  await obniz.wait(2000);
  obniz.io.animation("test", "resume")


  await obniz.wait(2000);
  obniz.io.animation("test", "loop")
}

このようにすると2秒ほどLEDが2つとも少し暗く点灯し、
次にどちらかのLEDがついた状態で停止します。

これはpauseされて、どちらかの状態で止まったからです。

そしてまた2秒後に動き出し、最後に終了します。
終了した際にもLEDは消えるのではなくどちらかのLEDがついた状態になると思います。
一時停止も終了も、どちらもアニメーションを止めるだけで、止めた後どうしたいかまでは書いていないので、最後の状態で停止するわけです。
LEDを消す場合はアニメーションを一時停止したり、終了した後に、LEDを消すようなプログラムを書く必要があります。



Next : PWM: use pwm

You will Get in Few Days

Circuit for Starter “obniz Board” is available on Amazon and other online stores.
You can get it at below

Our products and resellers

Forum

Visit our developer’s forum to discuss and discover technologies.

Forum

Contact

Feel free to contact out support and technical team.

Contact us