マイクロビットの表示装置は25個のLEDだけですので、長いメッセージはスクロールする必要があります。今回はMicro:bitにOLEDディスプレイを接続して、メッセージを表示する例を紹介します。
当記事は、シリーズでマイクロビット(Micro:bit)のプログラミングについて紹介しています。初めての方はこちらをご覧ください。
Micro:bit V2、Makecode、SSD1306Makecode拡張機能が更新された事により、記事の内容が古くなりましたので、記事を更新しました。当記事は以下のバージョンにのみ対応しますので、注意してください。Micro:bit V2用の記事はこちらです。
Micro:bit V1.5 Micro:bit V1.5とV2.0の違いはこちらを参照してください。
Makecode V1.0 こちらからMakecode V1.0 にアクセスできます。
使用するOLED有機ELディスプレイについて
今回使用したのは、『HiLetgo 0.96″ I2C シリアル 128×64 OLED LCDディスプレイSSD1306液晶』という製品です。今回の製品は最後に纏めて、購入先を紹介しています。
当サイトでも紹介しているArduino対応として販売されています。I2Cというインターフェースで接続できます。Micro:bitにもI2Cインターフェースがありますので、今回それを利用します。今までの記事でブロックエディターやMicropythonを紹介してきましたが、I2Cの説明については省いていましたので、今回紹介します。
I2Cはネット上に色々情報がありますが、以下のサイトが参考になります。ちょっと難しいですが。
Micro:bitとOLED有機ELディスプレイの接続
Micro:bitとディスプレイは、SCL、SDA、VCC、GNDの4本の線で接続します。
実際の接続状態
Makecode(V1使用)にOLED有機ELディスプレイ用拡張機能を追加
1.Makecodeを開きます
2.以下の画面になりますので、『新しいプロジェクト』をクリックします。
3.新しいプロジェクトをクリックすると、以下のような画面となりプログラムができるようになります。
4.拡張機能を追加するために、高度なブロックをクリックして開いたメニューの一番下の『拡張機能』をクリックします。
5.以下のような拡張機能の選択画面になりますので、検索窓に『SSD1306』と入力して検索をクリックします。
6.いくつかの拡張機能が表示されますので、『ssd1306-with-reset』をクリックします。
7.以下のように、LEDブロックの下に『OLED12864_I2C』ブロックが追加されました。残念ながら日本語化されていませんが、次のステップで各ブロックの説明をします。
この拡張機能の情報はこちら(英語版)です。
Makecodeで実際にプログラムしてみる
レッスン内容『OLED有機ELディスプレイにメッセージと図形を表示する』
Micro:bitのホームページにI2Cのレッスンがありませんので、以下のプログラムを作っていきたいと思います
Aボタンを押したら『Hello! と図形』を表示して、Bボタンを押したら画面をクリアするプログラムです。
レッスン目標
子供たちは、次のことができるようになります。
- OLED有機ELディスプレイを使って、メッセージを表示したり図形を表示することができる
ステップ1
まず、OLEDディスプレイのI2Cアドレスを指定して初期化をします。今回使用のOLEDディスプレイは『60』を使用します。他の命令を実行する前に必ず必要です。ブロック種類選択メニューから『OLED12864_I2C』を選択して、『init OLED with addr 60』ブロックを選択します。この初期化により、ディスプレイは 64 x 32 ドットで1ドットは4ピクセルにセットされます。
『init OLED with addr 60』ブロックを『最初だけ』ブロックに組み込みます。ワークスペースは以下のようになります。『ずっと』ブロックは使いませんので、削除しておいてください。
ステップ2
Aボタンを押したときの処理を作ります。ブロック種類選択メニュー『入力』から『ボタンAが押されたとき』ブロックを選択し、次にブロック種類選択メニューから『OLED12864_I2C』を選択して、『show string at x 0 y 0 text “Hello!” color 1』(文字列を表示する)ブロックを選択し、『ボタンAが押されたとき』ブロックに組み込みます。ワークスペースは以下のようになります。
次に、図形を表示するブロックをプログラムしますが、この部分は関数として呼び出す形にします。高度なブロック種類選択メニュー『関数』から『関数を作成する』をクリックします。(関数にする理由は、ボタンAが押されたときブロックが長過ぎて見にくいためと複雑なプログラムを作る際に再利用ができるからです)
『新たに作成する関数の名前:』画面が表示されますので、例えば『ずけい』と名前を入力してOKをクリックします。
ずけい関数ブロックがワークスペースに表示されます。ワークスペースは以下のようになります。
ステップ3
ここから、関数ブロックに作図するブロックを組み込んでいきます。以下のような四角と縦線をHello!の右に表示する例です。
①ブロック種類選択メニュー『OLED12864_I2C』から『draw a lectangle at x1 0 y1 0 x2 60 y2 30 color 1』ブロックを選択して『関数ずけい』ブロックに組み込み、x1=45、y1=0、x2=54、y2=9、color=1 と指定します。この指定は上図の四角を描画します。
②ブロック種類選択メニュー『OLED12864_I2C』から『draw a vertical line at x 0 y 0 number 10 color 1』ブロックを選択して『関数ずけい』ブロックに組み込み、x=63、y=10、number=5、color=1 と指定します。この指定は上図の縦線を描画します。
ワークスペースは以下のようになります。
これで関数ずけいは完成です。次に拡張ブロック種類選択メニュー『関数』から『関数を呼び出す ずけい』ブロックを選択します。
そして、『関数を呼び出す ずけい』ブロックを『ボタンAが押されたとき』ブロックに組み込みます。ワークスペースは以下のようになります。
ステップ4
ステップ3同様に、ボタンBが押された時に、画面をクリアするプログラムを作ります。ブロック種類選択メニュー『入力』から『ボタンBが押されたとき』ブロックを選択し、次にブロック種類選択メニューから『OLED12864_I2C』を選択して、『clear』(OLEDディスプレイを消去)ブロックを選択し、『ボタンBが押されたとき』ブロックに組み込みます。ワークスペースは以下のようになります。
ステップ5
Makecodeの左下でプログラム名を決めて保存ボタンを押します。この例では『OLED_TEST』としました。
ダウンロードフォルダーに『microbit-OLED_TEST.hex』というファイルが出来上がっていますので、Micro:bitにコピーします。これでメッセージを表示することができますので、試してみてください。Aボタンを押すと以下の写真のようにOLED有機ELディスプレイに表示されます。Bボタンを押すと画面が消されます。
チャレンジ
これでレッスンは終了ですが、チャレンジとして以下をやってみてください。
- レッスン『温度を計ってみよう』の温度をLEDではなくOLED有機ELディスプレイに表示するように変えてみる。
上記の回答は、次の記事で紹介します。次の記事ではOLEDのその他のブロックについて補足します。
最後まで記事をお読みいただきありがとうございます。
記事の改善に役立てたいと思いますので、よろしければアンケートにご協力ください。
今回の記事に使用したMicro:bit以外の製品は以下になります。
コメントを書く