パーツライブラリ - SSD1306

---

2021/12/20公開

最近SSD1306搭載のOLEDモジュールを手に入れたのでこちらの記事のソースを元にさせていただき、通常の外部パーツライブラリとして使えるように改修してみました。
表示領域の拡張や無印obniz搭載のOLEDの劣化対策などにお使いください。
なお当方で動作確認したのは下記画像のモジュールです。(基板裏面にGM009605v4.2のシルク印刷有り)
おそらくSSD1306搭載モジュールであればこれ以外でも動くとは思いますが未確認です。

クラス名は"SSD1306"です。
パーツライブラリの組込方法は公式ドキュメント「外部のパーツライブラリを取り込む」も参考にしてください。

wired("SSD1306", {gnd, vdd, scl, sda, address} )

---

OLEDモジュールに接続します。
sclはSCKと同じ意味です。
addressにはI2Cの接続先アドレスを指定してください。(省略時は0x3C)

<script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
<script src="ssd1306.js"></script>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
  // パーツライブラリの登録
  Obniz.PartsRegistrate(SSD1306);

  var oled = obniz.wired("SSD1306", { gnd:0, vdd:1, scl:2, sda:3, address:0x3c });
}
</script>

[await] clear()

---

表示内容をクリアします。

<script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
<script src="ssd1306.js"></script>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
  // パーツライブラリの登録
  Obniz.PartsRegistrate(SSD1306);

  var oled = obniz.wired("SSD1306", { gnd:0, vdd:1, scl:2, sda:3, address:0x3c });
  oled.display.clear();
}
</script>

[await] drawing(mode)

---

描画をバッファリングします。

<script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
<script src="ssd1306.js"></script>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
  const canvas = document.getElementById("c");
  const ctx = canvas.getContext("2d");

  // パーツライブラリの登録
  Obniz.PartsRegistrate(SSD1306);

  var oled = obniz.wired("SSD1306", { gnd:0, vdd:1, scl:2, sda:3, address:0x3c });

  oled.display.drawing(false);

  ctx.font = "20px Avenir";
  ctx.fillText("hoge", 0, 40);
  oled.display.draw(ctx);

  oled.display.drawing(true);
}
</script>

[await] draw(ctx)

---

CanvasのContextの内容を描画します。

<script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
<script src="ssd1306.js"></script>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
  const canvas = document.getElementById("c");
  const ctx = canvas.getContext("2d");

  // パーツライブラリの登録
  Obniz.PartsRegistrate(SSD1306);

  var oled = obniz.wired("SSD1306", { gnd:0, vdd:1, scl:2, sda:3, address:0x3c });

  ctx.font = "20px Avenir";
  ctx.fillText("hoge", 0, 20);
  ctx.fillText("fuga", 0, 40);
  oled.display.draw(ctx);
}
</script>

<script src="https://unpkg.com/obniz@3.x/obniz.js"></script>
<script src="ssd1306.js"></script>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");

obniz.onconnect = async function () {
  const canvas = document.getElementById("c"); // Bodyに"c"というidのCanvasタグがあるものとする
  const ctx = canvas.getContext("2d");

  // パーツライブラリの登録
  Obniz.PartsRegistrate(SSD1306);

  var oled = obniz.wired("SSD1306", { gnd:0, vdd:2, scl:4, sda:6, address:0x3c });

  ctx.font = "20px Avenir";
  ctx.fillText("hoge", 0, 20);
  ctx.fillText("fuga", 0, 40);
  oled.display.draw(ctx);
}
</script>

ssd1306.js

---

戻る