Gravio 4でLチカ

[前回](https://qiita.com/zrock/items/8498edcbdd3e93bdfbb0)はGraivo 4をインストールしてGravio 3との簡単な比較をしてみました。
今回はIoTでは定番のLチカやってみます。LチカとはLEDをチカチカさせることですね。GravioはBasicプラン以上でセンサーだけでなくライトもレンタルできるようになったので、簡単にLチカができるようになりました。

ということで、今回はこの2つを使います。
![PXL_20210120_014842050.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/7ce285e4-f695-a473-194f-01bae990673f.jpeg)

# 使用環境

* Windows 10 20H2 (19042.746)
* Gravio HubKit v4.1.4049.0
* Gravio Studio v4.1.5432.0
* Gravioライト
* Gravioワイヤレススイッチ

※GravioライトとGravioワイヤレススイッチはBasicプラン(月額500円)を契約するとレンタルすることができます。

# 手順
## スイッチとライトをペアリング
まずはGravio Studioを起動して、Hubをダブルクリックして接続します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/235909a5-29b5-eca8-9a06-39cdf16526f3.png)

接続後はデバイスタブが表示されますので、右上のアイコンからデバイス一覧のダイアログを開きます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/a32bd11a-f588-41a8-76f0-4fe7b0db41c5.png)

デバイスレンタル時に送られてくるUSB接続のGravioレシーバーを接続しておくとこのように Serialのところに**Zigbee**と表示されますので、ここをクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/c9e6b0b4-cbc6-d835-d189-07b7dc7979a3.png)

ペアリングボタンが表示されるので、クリックしてペアリングを実行します。
ペアリングボタンをクリックするとGravioレシーバーが60秒間ペアリングモードになります。この間に各デバイスの方もペアリングモードにすることでペアリングが行われます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/f13a6e48-ded3-8606-5869-08cd55a68db3.png)
ワイヤレススイッチの場合はこのボタンを5秒間長押ししてリセットしてください。青いLEDがチカチカしてペアリングモードに入ります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/63e53846-6381-8eb2-d6b9-c2c3d3dd65ff.png)

Graioライトの方は、ボタンが裏側にあります。こちらもボタンを5秒間長押しするとリセットされ、ペアリング状態になります。

ペアリングが完了すると下のようにセンサーが一覧に表示されます。表示されない場合は、ペアリング処理をもう一度試してみてください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/b175386b-fdb0-e9ac-8365-625fb020ec61.png)

また、ペアリングについては、[Gravioセンサーセットアップ](https://www.gravio.com/jp/sensor-setup-guide)に詳しく書かれているので見てみてください。

## Gravioライトを点灯する
Gravioライトを点灯させてみます。こちらはアクションを作成することになります。
ツールバーの一番右端のアイコンをドロップダウンして、「すべてのアクション」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/d1a80dbf-cdfb-a2aa-fff6-86dc59c7c24f.png)

アクション一覧の画面に移動しますので、「＋」アイコンをクリックしてアクションを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/faa422a1-ed4b-1e88-e971-745d31c1def4.png)

ダイアログでアクション名を入力します。ここでは「TurnOnLight」とします。説明も書いておくとあとからわかりやすいので書いておきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/343737fc-0723-1339-e370-c3daa6340310.png)

OKボタンをクリックするとアクションが作成されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/052c4374-9878-b4d9-a441-a0cd9b2d99ae.png)

作成されたアクションをダブルクリックするとアクションの編集画面に移動します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/ae24e6c5-51dd-b903-ed0b-8610d40d109b.png)

Gravioライトを点灯するためのコンポーネントを追加します。「ステップの追加」の下の「＋」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/3ceddc10-f132-9f94-553b-78192f4a50b0.png)

コンポーネントライブラリの中から**Gravio Light**を選択し、「選択」ボタンをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/9e590fe1-6916-c6b1-568c-ea9d33a48c86.png)

コンポーネントが追加され、プロパティが表示されるので、「オン」のチェックボックスをチェックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/a53e68e7-9702-c243-f0b2-7ad7f2b9e97d.png)

さて、実行してみます。実行前に、Gravioライトをペアリングしたあと、緑色でチカチカ点滅していると思いますので、一度裏側のボタンを短く押します。ライトが消えると思いますので、もう一度押します。
その後、右上の「▶」ボタンをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/a868e250-e089-1bd9-dd8a-d9cd9510eff8.png)

いかがでしょう？Gravioライトが赤く点いたと思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/35424965-9463-7b16-9ac1-0cd241d1f4d9.png)

プロパティの「カラー」「輝度」を色々変えて実行してみると、様々な色になるので遊んでみてください。

## Gravioライトを消灯する
同様の手順で、Gravioライトを消すアクションも作ってみましょう。
アクション名は**TurnOffLight**とし、どうように**Gravio Light**コンポーネントを配置します。今回は消灯ですので、「オン」のチェックは外したままでOKです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/fc1ecdfe-e8c5-1c98-d869-5de45e71bc30.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/b282758f-085b-2d3c-a2f3-784c11383b30.png)
実行して消灯するか確認してみましょう。

※うまく行かない場合は、一度「オン」をチェックして、もう一度外してみてください。

## スイッチと連動させてみる
最後にこの点灯、消灯をワイヤレススイッチと連動させてみます。
### エリアとレイヤーを作成
右上のツールバーからデバイスタブに移動します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/3df0b85b-51bb-c9ca-74fc-13bafa40331d.png)
デバイスタブに移動したら、ここでエリアとレイヤーを作成し、スイッチを登録します。こうすることでスイッチからのデータを受信できるようになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/8e42c8eb-694f-c377-d48a-f2c2f5d69593.png)
ツールバーの「＋」ボタンをクリックすると、「エリアの追加」が表示されるのでクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/853fe477-f420-86ee-1480-133224ac98a1.png)

「エリアの追加」が表示されるので、そのまま「保存」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/becd3dea-726b-5805-77ed-1feeabf18e22.png)
エリアが追加され、「レイヤーの追加」が表示されるので、一覧から「**Aqara-SingleButton**」を選択し、「保存」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/7ae76180-8e07-5ed6-ab5f-15e1f2eb6ccc.png)
このようにエリアとレイヤーが追加されました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/f1bd1207-befc-e812-0590-7da32937997a.png)
ここで、エリアとはいわゆるエリア、フロアだとか部屋だとかと考えてください。レイヤーとはセンサーの種類と考えてもらえばわかりやすいかなと思います。

### ワイヤレススイッチをレイヤーにバインド
データを受信するために、ワイヤレススイッチを作成したレイヤーに割り当てます。
レイヤーを選択した状態で、「論理デバイス」と書かれているバーの右端の「＋」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/0b46a0d2-2d1c-e869-3819-3c266b9b470c.png)
すると「物理デバイスのバインド」が表示されるので該当するボタンを選択して「設定」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/313e8fcf-715d-0646-e152-bb0ee059db87.png)
設定したら、右上の「✕」をクリックしてダイアログを閉じてください。デバイスが一覧に表示されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/1db6143c-241b-85ec-1204-ea2e8c981ab9.png)

最後に右端のワイヤレススイッチをクリックしてボタンを有効にしておきます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/2d311319-4db8-7e0a-87e3-db0f56e24f4b.png)

### ワイヤレススイッチからのデータを確認
スイッチからデータを受信できているかどうかを確認します。下のツールバーから「データビューア」をクリックしてデータビューアーに移動します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/d0f28dc1-49ef-fdcd-50a7-92d6d419f7f4.png)
右上の「LIVE」アイコンをクリックしてライブビューモードに変更します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/6e5b08cf-8cdf-b449-e02e-fbe66766998c.png)
ボタンをクリックするとデータが受信できていることが確認できると思います。ダブルクリックしたり、長押ししたりしてみると、それぞれのデータが受信できていることもわかると思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/cef00743-7d4a-533e-37da-dca227e0c1b5.png)

### トリガーを作成してワイヤレススイッチとライトを連動
さて、ここまで来たらあとはスイッチとライトの点灯するアクションを連動させるだけです。これにはトリガーを使います。
下のツールバーから「**トリガー**」をクリックして、トリガータブに移動します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/dfedc365-2dd5-0af5-f8e8-56e7a0bfd154.png)
右上のアイコンからトリガーを作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/3ac90b3e-62a4-e1ac-44cd-9b881c69de2d.png)

トリガ－には次のように設定します。

| プロパティ |値 |
|:-----------|:------------|
| トリガー名  | ライトを点灯|
| エリア     | エリア１|
| キーレイヤー| レイヤー１     | 
| Button Press| Single Press      |
| アクション名 | TurnOnLight |


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/f0e964e8-13f4-ce1d-a036-64331d6e61c6.png)

ざっくり説明すると、**「エリア１」の中の「レイヤー１」のボタンから「Single Press」の値を受信したときに「TurnOnLight」を実行するというトリガー「ライトを点灯」** を作成するということになります。

保存するとトリガーが追加されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/f669a823-05e0-7e7b-fb4d-add0c43f68be.png)
作成直後は無効になってますので、右端のスイッチで有効にするのを忘れないでください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/7588772f-5444-44df-6715-20ee124a5670.png)

さあ、では、ボタンをクリックしてライトを点灯してみましょう。いかがでしょうか？
同じようにボタンのダブルクリックに消灯のアクションを連動させると簡単な照明システムができますね。ぜひやってみましょう。
![LEDTurnOnOff.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/41603/268c468b-8119-9f59-fb6b-ae78ea7441c8.gif)


# まとめ
長々と書いてきましたが、Gravio 4でLチカはそんなに難しくありません。ポイントは、次のとおりです。なれてくれば5分程度でできるようになるでしょう。

1. スイッチとライトのペアリング
2. ライトを点灯・消灯するアクションを作成
3. エリア、レイヤーを作成してスイッチをバインド
4. トリガーを作成してスイッチとアクションを連動