注目キーワード

【Arduino】切手サイズのコンピュータ「M5Stamp Pico」で、透過型OLEDを使ってみる!

すけろく
最近、透明で先の見えるディスプレイが
あるらしいな。
げんろく
ああ、薄暗いサングラスくらいの透過率で
先が見えるものがある
TOLED(Transparent OLED)と言うんだ。
すけろく
M5Stampからでも表示制御できるのかな。
げんろく
Arduinoでプログラムできるものがあるから、
M5Stamp Pico用に改造してみるか。

この記事では、M5Stamp Picoを使って、「透過型OLED(Transparent OLED)」に画像を表示させてみます。

M5Stamp Picoは、切手サイズのマイコンで、さまざまなものに組み込むことができるので、「透過型OLED(Transparent OLED)」ディスプレイもいろんな使い道ができそうです。

そこで、今回はWaveShare社の提供している「1.51inch Transparent OLED」を、「Arduino+M5Stamp Pico」で使用してみたいと思います。

M5Stamp Picoと接続する際の環境構成や、画像やテキストを描画させるためのプログラムを紹介します。

M5Stamp Picoは、Wi-Fi接続やBluetooth接続ができるので、できることが広がりそうですよ!

ぜひ、皆さんも挑戦してみてくださいね!

この記事の前提となるM5Stamp Picoのはじめかたについては、次の記事で紹介しています。

関連記事

すけろく 切手サイズのコンピューター。 なかなかいい響きだの~。 げんろく 何だそれは? すけろく 「M5Stamp Pico」だ。 ESP32系のマイコンを搭載した切手サイ[…]

今回使用したマイコンと部品はこちら!

M5Stamp Pico DIY Kit
切手サイズのマイコン本体とダウンローダーを含むキットです。
通信(WiFi/Bluetooth)機能搭載、Aruduino で開発できます。
省スペースなマイコンは、こちらがおススメです!

<付属品>

  • M5Stamp Pico本体
  • ダウンローダー
  • ピンヘッダ、コネクタ、Groveコネクタ、ケース取付用レンチ、シール

もちろん「M5Stamp Pico」の他のGPIOを使っても構成できます。
M5Stamp Picoの電源はダウンローダー経由で入力されています。「透過型OLED」への電源は、M5Stamp Picoの5Vポートから供給します。
実際にブレッドボードに接続したイメージは次の通りです。

ブレッドボード、ジャンパワイヤはこちらがおススメです!

created by Rinker
¥1,356 (2024/06/13 23:52:35時点 楽天市場調べ-詳細)
ジャンパケーブル メス-メス オス-オス メス-オス 100pcs (ケーブル長15cm)
created by Rinker
¥702 (2024/06/14 09:13:28時点 楽天市場調べ-詳細)
M5Stamp Picoや、e-Paper(電子ペーパー)をブレッドボードに接続する際には次のものを使用しています。
両端ロングピンヘッダ 1×40 (40P 6.1)
入手元:秋月電子
型番:PH-1x40SG(6.1/6.1)両端のピンが長いものになります。40ピンありますので、8ピン分を切って使うなどできます。
秋月電子さんの通販サイトURLはこちらです。

透過型OLEDをM5Stamp Picoで使うために必要な設定

今回は、Arduino IDEを使ってM5Stamp Picoにプログラムを書き込みます。

透過型OLEDの販売元であるWaveShare社が、Arduino向けサンプルプログラムを提供しています。

Arduino IDEのライブラリ管理機能ではインストールできません。

以下の手順でダウンロードし、サンプルプログラムを実行するまでに修正すべき点をご紹介します。


左のリンクから、WaveShare社のサイトにアクセスします。

サイトを下のほうにスクロールし、「Demo Example」にあるリンクをクリックします。ダウンロードが開始されます。
以下のリンクからも直接ダウンロードできます。
WaveShare社のダウンロード元
No image

OLED_Module_Code_(12).7z」というファイルがダウンロードできますので、解凍ツールで解凍します。
No image

解凍後、以下のフォルダをコピーします。
「OLED_Module_Code_(12)」-「OLED_Module_Code」-「Arduino」-「OLED_1in51」
No Image

コピーしたフォルダを以下の場所にコピーします。
Arduinoのスケッチの標準の保存先は以下の場所です。
「Cドライブ」-「Users」-「”ユーザ名”」-「Documents」-「Arduino」
各ファイルを以下のとおり修正します。
<修正前>
#include <avr/pgmspace.h>


<修正後>
#include <pgmspace.h>


以下のファイルの内容を書き換えます。
※Arduinoで使用する場合はこの手順は不要です。
<対象ファイル>
・DEV_Config.h
・ImageData.c
・fonts.h
「fonts.h」の内容を書き換えます。
<修正後>

typedef struct
{
unsigned char index[27]; 
const char matrix[MAX_HEIGHT_FONT*MAX_WIDTH_FONT/8];
}CH_CN;

「fonts.h」の内容を書き換えます。
index[3]をindex[27]に変更します。
※Arduinoで使用する場合はこの手順は不要です。
「GUI_Paint.cpp」の内容を書き換えます。
<修正後>
void Paint_DrawString_CN
{
const char* p_text = pString;

「GUI_Paint.cpp」の内容を書き換えます。
unsigned char」を「char」に変更します。
※Arduinoで使用する場合はこの手順は不要です。
「DEV_Config.cpp」の内容を書き換えます。
削除対象
Serial.begin(115200);
・・・
Serial.println(“USE_SPI”);
・・・
Serial.println(“USE_I2C”);

「DEV_Config.cpp」の内容を書き換えます。
左のSerial系のコマンド部分を削除します。
※Arduinoで使用する場合はこの手順は不要です。
「DEV_Config.cpp」の内容を書き換えます。
<修正後>
#if USE_SPI_4W
//set OLED SPI
SPI.setDataMode(SPI_MODE3);
SPI.setBitOrder(SPI_MSBFIRST);
10
「DEV_Config.cpp」の内容を書き換えます。
MSBFIRST」を「SPI_MSBFIRST」に変更します。
※Arduinoで使用する場合はこの手順は不要です。
「OLED_1in51」の内容を書き換えます。
<追加後>
void setup() {
//set Serial
Serial.begin(115200);
11
「OLED_1in51」の内容を書き換えます。
Serial系のコマンド部分をSetup関数に追加します。
※Arduinoで使用する場合はこの手順は不要です。
「OLED_1in51」の内容を書き換えます。
<修正後>
void setup() {
・・・
 if((BlackImage = (UBYTE *)malloc(Imagesize)) == NULL) {
Serial.print(“Failed to apply for black memory…\r\n”);
return -1;
}
・・・
12
「OLED_1in51」の内容を書き換えます。
Setup関数にある「return 1;」を削除します。
※Arduinoで使用する場合はこの手順は不要です。
「DEV_Config.h」ファイルを以下の通り修正します。
<修正前>
#define OLED_CS 10
・・・
#define OLED_RST 8
・・・
#define OLED_DC 7


<修正後>
#define OLED_CS 19
・・・
#define OLED_RST 22
・・・
#define OLED_DC 21

13
「DEV_Config.h」の内容をM5Stamp Picoで使用するGPIOの情報に書き換えます。※別のGPIOピン番号にした場合は、読み替えてください。
以上で、M5Stamp Picoへの書き込みができる状態になります(2023年2月時点)

 M5Stamp Picoへの書き込み

  1. 「ファイル」メニューから「名前を付けて保存」で任意の名前を付けて保存します。
  2. 「ツール」メニューから「ボード」情報を確認し、M5Stamp Picoであるか確認します。
    「Partition Scheme」を「No OTA(Large APP)」に設定します。
    この際、「シリアルポート」にマイコンを接続したCOMポートが指定されているかも確認します。
  3. 「ツール」メニューから「シリアルモニタ」を選択してシリアルモニタを起動します。
  4. 「スケッチ」メニューから「マイコンボードに書き込む」を選択します。

 プログラム実行結果

M5Stamp Picoを起動すると、次のように透過型OLEDに表示されます。

さて、動作確認が終わったところで、いよいよ表示したい内容に変更しますよ~

M5Stamp Picoで透過型OLEDに画像を表示してみる

M5Stamp Picoを使って、透過型OLEDに画像を表示するプログラムを作成します。

表示する画像として、次のものを用意しました。

透過型OLEDへの画像表示プログラム

Arduino IDEを起動して、「ファイル」メニューから「新規ファイル」を選択し、表示されるスケッチに以下のように記述します。

 Arduino IDE スケッチ例

<プログラム本体>

<画像ファイル>

※「ImageData.c」という名前のファイルを以下の内容で書き換えます。

 M5Stamp Picoへの書き込み

  1. 「ファイル」メニューから「名前を付けて保存」で任意の名前を付けて保存します。
  2. 「ツール」メニューから「ボード」情報を確認し、M5Stamp Picoであるか確認します。
    「Partition Scheme」を「No OTA(Large APP)」に設定します。
    この際、「シリアルポート」にマイコンを接続したCOMポートが指定されているかも確認します。
  3. 「ツール」メニューから「シリアルモニタ」を選択してシリアルモニタを起動します。
  4. 「スケッチ」メニューから「マイコンボードに書き込む」を選択します。

 プログラム実行結果

M5Stamp Picoを起動すると、次のように透過型OLEDに表示されます。

背景が透けて見えつつ、画像の表示ができていますね!

編集後記

いかがだったでしょうか。

透過型OLEDを使うことで、ちょっと未来感のある見せ方をすることができます。これから組み込んでいくのが楽しみです。

今回の記事は以上になります。

最後まで、ご覧いただきありがとうございました。

今回使用したマイコンと透過型OLEDはこちら!

M5Stamp Pico DIY Kit
切手サイズのマイコン本体とダウンローダーを含むキットです。
通信(WiFi/Bluetooth)機能搭載、Aruduino で開発できます。
省スペースなマイコンは、こちらがおススメです!

<付属品>

  • M5Stamp Pico本体
  • ダウンローダー
  • ピンヘッダ、コネクタ、Groveコネクタ、ケース取付用レンチ、シール

つぎから購入する場合は、次のものを購入してもよいですね。

切手サイズのマイコン本体とピンヘッダなどのコネクタ類がついているキットです。通信(WiFi/Bluetooth)機能も搭載され、Aruduino で開発できます。
ダウンローダーが必要ない場合はこちらをどうぞ!

<付属品>

  • M5Stamp Pico本体
  • ピンヘッダ、コネクタ、Groveコネクタ、ケース取付用レンチ、シール

複数個を一度に購入する場合は、次のものをどうぞ!



M5Stamp Pico(5個入り)
切手サイズのマイコンです。とても小さく、組み込みに有効なサイズ感ですね。通信(WiFi/Bluetooth)も搭載されています。
開発環境(Aruduino IDE/MicroPython/UIFlow)も豊富でおススメです!
たくさん購入したい場合はこちらをどうぞ!

<付属品>

  • M5Stamp Pico本体
  • シール

Amazonで確認

created by Rinker
¥1,356 (2024/06/13 23:52:35時点 楽天市場調べ-詳細)
ジャンパケーブル メス-メス オス-オス メス-オス 100pcs (ケーブル長15cm)
created by Rinker
¥702 (2024/06/14 09:13:28時点 楽天市場調べ-詳細)

 

M5Stamp Pico の他の記事はこちらからどうぞ!

すけろく メダカもだいぶ増えたの~。 げんろく そうだな。 毎日の餌やりと、水替え、結構がんばっとるからな。 すけろく 水温は、第一弾で水温センサーを仕込んだから、 管理は楽になった。 げんろく そうだな。 よし、今回は、餌やりを自動化してみるか! 皆さん、お家で何か動植物を飼っていますか? 我が家のメダカもよく育っています。 前回の第一弾で、水槽内の水温を計測・記録するものを作りました。 おかげ […]

すけろく うーむ。 モーターを毎回同じくらい回転させることはできんのかな。 げんろく DCモーターや、サーボモーターだと、 回転量を正確に制御することは難しいぞ。 すけろく では、何か解決策はあるのかぇ? げんろく ステッピングモーターというものがある。 モーターの回転をステップとして制御できる。 今回はこのあたりを動かしてみるか。 この記事では、「M5Stamp Pico」を使って、「ステッピン […]

すけろく うーむ。 何とかならんか~ げんろく どうした? 電池を見つめて。 すけろく 電池を電源にしてM5Stampを使っているのだが、 一定間隔で動かしているのだが、電池の持ちが悪くてな。 げんろく うーむ。どれどれ。 Sleepさせていないのか?これだとずっとCPUが電力を消費するぞ。 よし、今回はDeepSleepの方法を使う方法を紹介しよう。 この記事では、「M5Stamp Pico」を […]

すけろく そういえば、LCDパネルがあるのだが、 使ってなかったな。 げんろく んー。 どれどれ、このコントローラICなら Arduinoで使えるな。 すけろく それなら、M5Stamp Picoで時計を表示したいな。 時刻同期は以前の記事でやっているし。 げんろく よし、やってみよう! この記事では、「M5Stamp Pico」を使って、「LCDモジュール」に時計を表示させてみます。 「M5St […]

すけろく んーどうしたものか。 げんろく どうした? 深刻な顔をして。 すけろく M5Stackにプログラムを書き込んだら 起動しなくなってな。 電源ON/OFFでも無理なのだ。 げんろく 書き込んだプログラムか、バッテリーの 過放電か。工場出荷時に戻してみてはどうだ? この記事では、M5Stackにプログラムを書き込んだ結果、うまく動作しなくなった場合の対処方法を記載します。 ご紹介するのは「工 […]

すけろく 最近、透明で先の見えるディスプレイが あるらしいな。 げんろく ああ、薄暗いサングラスくらいの透過率で 先が見えるものがある TOLED(Transparent OLED)と言うんだ。 すけろく M5Stampからでも表示制御できるのかな。 げんろく Arduinoでプログラムできるものがあるから、 M5Stamp Pico用に改造してみるか。 この記事では、M5Stamp Picoを使 […]

すけろく ちょっと!! e-Paper(電子ペーパー)ってディスプレイ制御は 独特なの? げんろく まあ、そりゃ違うわな。 ものが違うからの。 すけろく Raspberry Pi Pico向けのe-Paperを入手したが、 Arduino+M5Stamp Picoで使いたいのだ。 げんろく よし。 ではM5Stamp Picoで使ってみるか! この記事では、M5Stamp Picoを使って、e-P […]

すけろく M5Stamp Picoのことはじめに、 LEDを一つだけ光らせたが、やはりもっと派手にやりたいな。 げんろく 左様、わしも考えていたのだ。 LEDストラップを使って派手に光らせようではないか。 この記事では、M5Stamp PicoのGroveコネクタを使って、LEDが複数実装されたLEDストラップをいろいろな色やアニメーションで光らせてみます。 M5Stamp Picoはディスプレイ […]

すけろく WiFi接続は前回行ったが、次は時刻同期だな。 げんろく そうだな。IoTに正確な時刻は大切だ。 NTPサーバと時刻同期してみよう。 この記事では、M5Stamp PicoをアクセスWi-Fiアクセスポイントに接続し、インターネットの時刻サービスを使って時刻を同期する方法について紹介します。 M5Stamp Picoはディスプレイを持っていないため、主に処理時間やセンサーなどからデータを […]

すけろく 切手サイズのコンピュータに書き込むことはできな。 げんろく 次は、WiFi接続まわりを試してみよう。 基本はM5Stick Cと同じはずだ。 この記事では、M5Stamp Picoに実装されているWiFi機能を使って、Wi-Fiルータに接続する方法について紹介します。 この記事の前提となるM5Stamp Picoのはじめかたについては、次の記事で紹介しています。 Wi-Fi接続する際には […]