機能拡張ボードをArduinoIDEで開発(OLED編)

[概要] [CircuitPythonで開発] 　 [SD/RTC編] 〔Seeeduino XIAOの使い方に戻る〕

機能拡張ボード用のプログラムをCircuitPythonで開発&実験をしたかったが、メモリ不足で断念した。
やっぱりぃArduino IDEよねぇ、ってんでぇArduino IDEで開発&実験を行う。
尚、「wiki．Seeeduino XIAO Expansion board」を参考にします。

《ライブラリーの準備》

と言う事でぇ、このページで扱うライブラリ―をダウンロードして置きます。

・　[U8g2]ライブラリーでＯＬＥＤ用です。
　　このライブラリーはArduino IDEを起動させ、
　　IDEのメニューバーから[スケッチ]->[ライブラリをインクルード]->[ライブラリを管理]を選択して
　　ライブラリマネージャーウインドウ画面を操作してインストールします。

digitalio一覧


《ＯＬＥＤ》

機能拡張ボードに搭載の”0.96 128x64 有機EL OLED グラフィック表示ディスプレイ(SSD1306)”を
動作させてみます。ライブラリーには、"U8x8lib"と"U8g2lib"が含まれている様です。

（Ｕ８ｘ８ｌｉｂ）

このライブラリーのAPI説明はこちらを参照しましょう。
テキスト出力(文字)のみサポートしています。
8x8ピクセルグリッドに収まるフォントが基本です。
ディスプレイに直接書き込みます。 マイクロコントローラにバッファは必要ありません。
又、このライブラリーで使用可能なフォントはこちらを参照しましょう。

【とりあえず"Hello World"】

①　Seeeduino XIAOを機能拡張ボードに取り付けてから、PCとType-Cケーブルを接続します。

②　Arduino IDE開き、下記スケッチをコピーしてコンパイル & XIAOへの書き込みを行います。
------------------------------------------------------------
#include <U8x8lib.h>

// SSD1306をテキストモニターとして使用する為のコンストラクタ
U8X8_SSD1306_128X64_NONAME_HW_I2C u8x8(U8X8_PIN_NONE) ;

void setup(void) {
    u8x8.begin() ;
    u8x8.setFont(u8x8_font_chroma48medium8_r) ; // 8x8英数字フォント(00h-7Fh)
}
void loop(void) {
      u8x8.setCursor(0, 0) ;
      u8x8.print("Hello World!") ;
}
------------------------------------------------------------
テキスト文字列のみなら"U8x8"を勧めます、スケッチ容量も小さくできているのでぇ。
16x16フォントは、"u8x8_font_px437wyse700b_2x2_r"辺りです。
でかい数字のみのフォントは、"u8x8_font_inb33_3x6_n"辺りです。

　・u8x8.setCursor(uint8_t x, uint8_t y)
　　描画初めのカーソル位置に移動します。
　　カーソル位置とは、SSD1306なら128x64画面で128/8=16なので0-15の数値となります。
　　x : 横のカーソル位置(0-15)
　　y : 縦のカーソル位置(0-7)

　・u8x8_u16toa(int16_t v, uint8_t d)
　　数値をゼロサプレスした文字列を返します。
　　v : 数値を指定します
　　y : 桁数を指定します
　　return : 指定の桁数で数値をゼロサプレスした文字列を返します。
　　u8x8.print(u8x8_u16toa(12, 5)) ; // "00012"となります。

【シリアルモニター出力の様なサンプル】
------------------------------------------------------------
#include <U8x8lib.h>

int cnt ;

// SSD1306をテキストモニターとして使用する為のコンストラクタ
U8X8_SSD1306_128X64_NONAME_HW_I2C u8x8(U8X8_PIN_NONE) ;
// ターミナル（U8X8LOG）をセットアップ
// SSD1306は128(8x16)x64(8x8)、サイズ(幅*高さ)はディスプレイによって異なります。
#define U8LOG_WIDTH 16
#define U8LOG_HEIGHT 8
uint8_t u8log_buffer[U8LOG_WIDTH*U8LOG_HEIGHT] ;
U8X8LOG u8log ;

void setup(void) {
    cnt = 0 ;
    u8x8.begin() ;
    u8x8.setFont(u8x8_font_chroma48medium8_r) ; // 8x8英数字(00h-7Fh)
    u8log.begin(u8x8, U8LOG_WIDTH, U8LOG_HEIGHT, u8log_buffer) ;
    // 0：改行で画面を更新します。1：文字ごとに画面を更新します
    // u8log.setRedrawMode(1) ;
}
void loop(void) {
    // 毎回１０行出力したら画面をクリアします。
    if ((cnt % 10)==0) u8log.print("\f") ;
    u8log.print("count = ") ;
    u8log.print(cnt) ;
    u8log.print("\n") ; // 改行
    cnt++ ;
    delay(1000) ;
}
------------------------------------------------------------
この例は、[ファイル]->[スケッチ例]->[U8g2]->[u8x8]->[Terminal]を基に作成しています。
[スケッチ例]を動作させる時は、
"U8x8lib"なら
　U8X8_SSD1306_128X64_NONAME_HW_I2C u8x8(U8X8_PIN_NONE) ; を追加します。
"U8g2lib"なら
　U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0,5,4) ; を追加します。
　又は、U8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0,5,4) ;を追加します。

※　[スケッチ例]の[DrawLog]はu8g2で行った物の様です、これも参考にしましょう。

【U8X8でキャラクターも表示できるよサンプル】
------------------------------------------------------------
#include <U8x8lib.h>

// SSD1306をテキストモニターとして使用する為のコンストラクタ
U8X8_SSD1306_128X64_NONAME_HW_I2C u8x8(U8X8_PIN_NONE) ;

void setup(void) {
    u8x8.begin() ;
}
void loop(void) {
    int c ;

    u8x8.setFont(u8x8_font_chroma48medium8_r) ;
    u8x8.setInverseFont(1) ; // ピクセルを反転する
    u8x8.drawString(0, 2, "Weather") ;
    u8x8.setInverseFont(0) ; // 反転を戻す
    u8x8.setFont(u8x8_font_open_iconic_weather_4x4) ; // お天気キャラフォント
    for(c = 0; c < 6; c++ ) {
        // お天気のキャラクターを表示します。
        u8x8.drawGlyph(0, 4, '@'+c) ;
        delay(1500) ;
    }
    // ２バイト分のタイルを描画します。
    uint8_t tiles[16] = { 0x0f,0x0f,0x0f,0x0f,0xf0,0xf0,0xf0,0xf0, 1, 3, 7, 15, 31, 63, 127, 255} ;
    u8x8.drawTile(1, 0, 2, tiles) ;

    delay(1500) ;
}
------------------------------------------------------------
お天気マークキャラクタフォントは、"u8x8_font_open_iconic_weather_4x4"辺りです。

　・u8x8.setInverseFont(uint8_t is_enable)
　　反転して描画します。
　　is_enable : 文字のピクセル反転を有効(1)、文字は黒で背景は白です。
　　　　　　　　無効(0)、文字は白で背景は黒(通常パターン？)です。

　・u8x8.drawString(uint8_t x, uint8_t y, const char *s)
　　文字列を描画します。
　・u8x8.draw1x2String(uint8_t x, uint8_t y, const char *s)
　　1x2は、縦が2倍のサイズを描画します。
　・u8x8.draw2x2String(uint8_t x, uint8_t y, const char *s)
　　2x2は、縦・横が2倍のサイズを描画します。
　　x : 横のカーソル位置(0-15)
　　y : 縦のカーソル位置(0-7)
　　*s: 文字列を指定します。

　・u8x8.drawGlyph(uint8_t x, uint8_t y, uint8_t encoding)
　　1つの文字を描画します。
　　この関数も、縦が2倍と縦・横が2倍のサイズの描画有ります。
　　x : 横のカーソル位置(0-15)
　　y : 縦のカーソル位置(0-7)
　　encoding : １文字を指定

　・u8x8.drawTile(uint8_t x, uint8_t y, uint8_t cnt, uint8_t *tile_ptr)
　　1つ又は複数のタイルを描画します。
　　タイルは8x8ピクセルのビットマップです。 タイルは正確に8バイトです。
　　タイルのメモリレイアウトは、ターゲットディスプレイのメモリアーキテクチャによって異なります。
　　尚、メモリレイアウトの構成はこちらを参照ください。
　　x　: 横のカーソル位置(0-15)
　　y　: 縦のカーソル位置(0-7)
　　cnt: 出力するタイルのバイト数
　　*tile_ptr:タイルの描画パターンデータを指定します。

（Ｕ８ｇ２ｌｉｂ）

このライブラリーのAPI説明はこちらを参照しましょう。
全てのグラフィック手順(線/ボックス/円の描画)が含まれています。
多くのフォントをサポートします。 (ほぼ)フォントの高さに制限はありません。
ディスプレイをレンダリングするには、マイクロコントローラにメモリが必要です。
メモリバッファには、ページ単位バッファと画面フルサイズ分のバッファがあります。
又、このライブラリーで使用可能なフォントはこちらを参照しましょう。

【グラフィック出力を使った文字列の出力例のサンプル】
------------------------------------------------------------
#include <U8g2lib.h>

int cnt ;

// SSD1306をグラフィックディスプレイとして使用する為のコンストラクタ
// メモリバッファ(RAM)は１ページ分の128b分確保
// ローテーション(画面回転)なし、SCL=5番ピン　SDA=4番ピン
U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0,5,4) ;

void setup(void) {
  cnt = 0 ;
  u8g2.begin() ;
}
void loop(void) {
  u8g2.firstPage();
  do {
    u8g2.setFont(u8g2_font_ncenB14_tr) ; // 英数字(00h-7Fh)
    u8g2.drawStr(0,15,"Hello World!") ;
    u8g2.setFont(u8g2_font_unifont_t_symbols) ;
    u8g2.setCursor(50, 35) ; // 50:x座標 35:y座標(文字の左下墨)
    u8g2.print(cnt) ;
  } while ( u8g2.nextPage() ) ;
  cnt++ ;
  delay(1000) ;
}
------------------------------------------------------------
この例は、SSD1306の１ページ分(全部で８ページ)のメモリを確保して利用しているので
メモリバッファが少なくてすむと言う所でしょうか。
  u8g2.firstPage();
  do {
      ここに１画面分の描画を行います。
  } while ( u8g2.nextPage() ) ;
  必ずこのセットで行います。ディスプレイには１ページ単位で出力しています。
　・u8g2.setCursor(uint8_t x, uint8_t y)
　　描画初めの座標位置に移動します。
　　座標位置とは、SSD1306なら128x64で128なので0-127の数値となります。
　　x : 横の座標位置(0-127)
　　y : 縦の座標位置(0-63)

　・u8g2.drawStr(u8g2_uint_t x, u8g2_uint_t y, const char *s)
　　文字列を描画します。
　　座標位置は最初文字の左下側です注意、文字高さが8なら(0,7)座標が１行目となります。
　　x : 描画初め横の座標位置(0-127)
　　y : 描画初め縦の座標位置(0-63)
　　*s: 文字列を指定します。

【やっぱりぃ日本語が表示させたいぞぉなサンプル】
------------------------------------------------------------
#include <U8g2lib.h>

// SSD1306をグラフィックディスプレイとして使用する為のコンストラクタ
// メモリバッファ(RAM)は１ページ分の128b分確保
// ローテーション(画面回転)なし、SCL=5番ピン　SDA=4番ピン
U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0,5,4) ;

void setup(void) {
  u8g2.begin() ;
  u8g2.enableUTF8Print() ; // Arduino print()関数のUTF8サポートを有効にする
  u8g2.setFont(u8g2_font_b12_t_japanese2) ; // 日本語フォント高さ12bit
}
void loop(void) {
  u8g2.firstPage() ;
  do {
    u8g2.setCursor(0, 12) ;
    u8g2.print("Hello World!") ; // 記号、英数字は小文字なら表示する
    u8g2.setCursor(0, 24) ;
    u8g2.print("こんにちは世界さん") ; 
    u8g2.setCursor(0, 36) ;
    u8g2.print("ｷﾑﾗ　キムラ　きむらっち") ; // "ｷﾑﾗ"とスペースは表示しない
    u8g2.setCursor(0, 48) ;
    u8g2.print("木村繁裕") ;
    u8g2.setCursor(0, 60) ;
    u8g2.print("ａＢｃ＝％℃±＋－＊／．，；：＿") ; // 全く表示しない
  } while ( u8g2.nextPage() ) ;
  delay(1000) ;
}
------------------------------------------------------------
表示しない文字が有る事に注意です。
日本語フォント高さ10bit："u8g2_font_b10_t_japanese2"です。
日本語フォント高さ16bit："u8g2_font_b16_t_japanese2"です。
ボルドーフォントは"u8g2_font_b10_b_t_japanese2"とぉ"_b_"を付けたフォントになります。

　・u8x8.enableUTF8Print(void)
　　Arduino print()関数のUTF8サポートをアクティブにします。
　　有効にすると、print()関数に渡される文字列にUnicode記号が許可されます。
　　通常、この関数はbegin()の後に呼び出します。
　　これを記述しないと漢字が表示されません！！

【図形の出力例のサンプル】
------------------------------------------------------------
#include <U8g2lib.h>

// SSD1306をグラフィックディスプレイとして使用する為のコンストラクタ
// メモリバッファ(RAM)は128X64バイト(画面フルサイズ分)
// ローテーション(画面回転)なし、SCL=5番ピン　SDA=4番ピン
U8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0,5,4) ;

void setup(void) {
  u8g2.begin() ;

  u8g2.clearBuffer();             // バッファのクリア
  u8g2.drawFrame(0, 0, 127, 63) ; // 四角形(塗りつぶさない)
  u8g2.drawEllipse(63,31,40,10) ; // 楕円(塗りつぶさない)
  u8g2.drawDisc(63,31,10) ;       // 円(塗りつぶす)
  u8g2.sendBuffer();              // バッファ内容をOLEDに送る
}
void loop(void) {
}
------------------------------------------------------------
この例は、SSD1306の画面フルサイズ分(8192バイト)のバッファメモリを確保しています。

※　[スケッチ例]の[GraphicsTEST]を動作させましょう、これも参考になるでしょう。

【主な図形関連関数】
　描画は現在のカラーインデックス(setDrawColor)を使用してピクセルを描画します。
　カラーインデックス0はピクセルをクリアし、カラーインデックス1はピクセルを設定します。

　・u8g2.drawPixel(u8g2_uint_t x, u8g2_uint_t y)
　　点を描画します。
　　x : 描画する横の座標
　　y : 描画する縦の座標

　・u8g2.drawLine(u8g2_uint_t x0, u8g2_uint_t y0, u8g2_uint_t x1, u8g2_uint_t y1)
　　2点の間に線を引きます。
　　x0 : 線の引き初めの横座標
　　y0 : 線の引き初めの縦座標
　　x1 : 線の引き終わりの横座標
　　y1 : 線の引き終わりの縦座標

　・u8g2.drawBox(u8g2_uint_t x, u8g2_uint_t y, u8g2_uint_t w, u8g2_uint_t h)
　　四角形を描画します、四角形内は塗りつぶします。
　・u8g2.drawFrame(u8g2_uint_t x, u8g2_uint_t y, u8g2_uint_t w, u8g2_uint_t h)
　　四角形を描画します、四角形内は塗りつぶしません。
　　x : 四角形左上隅の横の座標
　　y : 四角形左上隅の縦の座標
　　w : 四角形の横の幅長さ
　　h : 四角形の縦の高さ

　・u8g2.drawRBox(u8g2_uint_t x, u8g2_uint_t y, u8g2_uint_t w, u8g2_uint_t h,
　　　　　　　　　　　u8g2_uint_t r)
　　四角形の角を丸く描画します、四角形内は塗りつぶします。
　・u8g2.drawRFrame(u8g2_uint_t x, u8g2_uint_t y, u8g2_uint_t w, u8g2_uint_t h,
　　　　　　　　　　　　 u8g2_uint_t r)
　　四角形の角を丸く描画します、四角形内は塗りつぶしません。
　　x : 四角形左上隅の横の座標
　　y : 四角形左上隅の縦の座標
　　w : 四角形の横の幅長さ
　　h : 四角形の縦の高さ
　　r : 丸角の半径を指定します。

　・u8g2.drawTriangle(int16_t x0, int16_t y0, int16_t x1, int16_t y1, int16_t x2,
　　　　　　　　　　　　int16_t y2)
　　三角形を描画します、三角形内は塗りつぶします。
　　三角の頂点、三角の右角、三角の左角の順にx,yの座標を指定します。

　・u8g2.drawCircle(u8g2_uint_t x0, u8g2_uint_t y0, u8g2_uint_t rad,
　　　　　　　　　　　uint8_t opt = U8G_DRAW_ALL)
　　円を描画します、円内は塗りつぶしません。
　・u8g2.drawDisc(u8g2_uint_t x0, u8g2_uint_t y0, u8g2_uint_t rad,
　　　　　　　　　　　uint8_t opt = U8G_DRAW_ALL)
　　円を描画します、円内は塗りつぶします。
　　x0 : 中心点位置の横座標
　　y0 : 中心点位置の縦座標
　　rd : 描画する円の半径を指定します。
　　opt: 半弧描画オプション
　　　　　U8G_DRAW_ALL　　　　　= 円全体を描画します。
　　　　　U8G2_DRAW_UPPER_RIGHT = 円の上右側1/4のみ描画します。
　　　　　U8G2_DRAW_UPPER_LEFT　= 円の上左側1/4のみ描画します。
　　　　　U8G2_DRAW_LOWER_RIGHT = 円の下右側1/4のみ描画します。
　　　　　U8G2_DRAW_LOWER_LEFT　= 円の下左側1/4のみ描画します。

　・u8g2.drawEllipse(u8g2_uint_t x0, u8g2_uint_t y0, u8g2_uint_t rx, u8g2_uint_t ry,
　　　　　　　　　　　 uint8_t opt)
　　楕円を描画します、楕円は塗りつぶしません。
　・u8g2.drawFilledEllipse(u8g2_uint_t x0, u8g2_uint_t y0, u8g2_uint_t rx,
　　　　　　　　　　　　　　 u8g2_uint_t ry, uint8_t opt)
　　楕円を描画します、楕円内は塗りつぶします。
　　x0 : 中心点位置の横座標
　　y0 : 中心点位置の縦座標
　　rx : 描画する楕円の横半径を指定します。
　　ry : 描画する楕円の縦半径を指定します。
　　opt: 半弧描画オプション(上記参照)

【写真を表示させた～いのサンプル】
------------------------------------------------------------
#include <U8g2lib.h>

static const unsigned char HANA[] U8X8_PROGMEM = {
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x7F, 0xFE, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x7F, 0xFC, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x3F, 
  0xFC, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 
  0xFF, 0xFF, 0x1F, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x1F, 0xF0, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x0F, 0xE0, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x0F, 
  0xE0, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 
  0xFF, 0xFF, 0x07, 0xC0, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0x0F, 0xC0, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0x7F, 0xF7, 0x07, 0xC0, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xC0, 0x0F, 
  0x80, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 
  0xFF, 0x00, 0x0F, 0x80, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0x00, 0x0E, 0x80, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x00, 0x0C, 0x80, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x00, 0x10, 
  0x80, 0xCF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 
  0xFF, 0x01, 0x00, 0x80, 0x01, 0xFC, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0x01, 0x00, 0x80, 0x00, 0xFE, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x03, 0x00, 0x00, 0x00, 0xFE, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x03, 0x00, 
  0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 
  0xFF, 0x07, 0x00, 0x04, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0x0F, 0x00, 0x06, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x1F, 0x08, 0x0F, 0x80, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xBF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0x3F, 0xF0, 
  0x0B, 0xC0, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0xFC, 0xFF, 0xFF, 0xFF, 0x3F, 
  0x7F, 0x7A, 0xF0, 0x1B, 0xE0, 0xFF, 0xFF, 0xFF, 0xFF, 0xBF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0x1F, 0x00, 0xF0, 0x31, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 
  0x0F, 0xFE, 0xFF, 0xEF, 0xFF, 0x3F, 0x0F, 0x00, 0x70, 0x30, 0xF8, 0xFF, 
  0xFF, 0xFF, 0xFF, 0x1F, 0xFE, 0xFF, 0xCF, 0xFF, 0x3F, 0x0F, 0x00, 0x30, 
  0x00, 0xF0, 0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0xFA, 0xFF, 0xC3, 0xFF, 0x3F, 
  0x0F, 0x00, 0x78, 0x00, 0xF0, 0xFF, 0xFF, 0xFF, 0xFF, 0x17, 0xF8, 0xFF, 
  0xC0, 0xFF, 0x3F, 0x1F, 0x00, 0x7C, 0x00, 0xF0, 0xFF, 0xFF, 0xFF, 0xFF, 
  0x0F, 0xF0, 0xFF, 0x80, 0xFF, 0x3F, 0x3F, 0x00, 0x20, 0x00, 0xF0, 0xFF, 
  0xFF, 0xFF, 0xFF, 0x07, 0xC0, 0x7F, 0x80, 0xFF, 0x3F, 0x7F, 0x00, 0x60, 
  0x00, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0x07, 0x80, 0x3F, 0x80, 0xFF, 0x3F, 
  0xFF, 0x00, 0x20, 0x00, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0x03, 0x04, 0x3F, 
  0x80, 0xFF, 0x3F, 0xFF, 0x01, 0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0x01, 0x00, 0x1F, 0x80, 0xFF, 0x3F, 0xFF, 0x07, 0x80, 0x81, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0x03, 0x00, 0x1E, 0x80, 0xFF, 0x3F, 0xFF, 0x07, 0xC0, 
  0xE3, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x05, 0x00, 0x1C, 0x80, 0xFF, 0x3F, 
  0xFF, 0x07, 0xE0, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x22, 0x00, 0x18, 
  0xC0, 0x1F, 0x3E, 0xFF, 0x07, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0x67, 0x00, 0x08, 0xC0, 0x03, 0x3E, 0xFF, 0x0F, 0xFC, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFB, 0x00, 0x18, 0xC0, 0x01, 0x3F, 0xFF, 0xDF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x7F, 0x40, 0x00, 0x60, 0x00, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xDF, 0xFF, 0x3F, 0x00, 0x00, 
  0x00, 0x00, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x1F, 0xFC, 
  0x1F, 0x80, 0x82, 0x00, 0x80, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0x1F, 0xF8, 0x01, 0x80, 0xEF, 0x01, 0x00, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0xF0, 0x00, 0x80, 0xFF, 0x01, 0x80, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0xE0, 0x00, 0x80, 0xFF, 
  0x03, 0xC0, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x1F, 0x00, 
  0x00, 0xC0, 0xFF, 0x1F, 0xC0, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0x0F, 0x00, 0x00, 0xC0, 0xFB, 0x0F, 0xF0, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0x80, 0x00, 0xE0, 0x07, 0x0F, 0xF8, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0x00, 0x01, 0xC0, 0x13, 
  0x06, 0xFE, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0x00, 
  0x01, 0xC0, 0x23, 0xC6, 0xFF, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0x0F, 0x00, 0x01, 0x80, 0x07, 0xC7, 0xFF, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0x00, 0x00, 0x00, 0x0F, 0x03, 0xFF, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x0F, 0x00, 0x00, 0x00, 0xD7, 
  0x07, 0xFC, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x1F, 0x00, 
  0x00, 0x80, 0x20, 0x00, 0xFC, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0xFF, 0x1F, 0x00, 0x00, 0x00, 0x20, 0x00, 0xFC, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0x00, 0x00, 0x00, 0x70, 0x00, 0xF8, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x7F, 0x00, 0x00, 0x00, 0xF8, 
  0x00, 0xF8, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x01, 0x70, 0x20, 
  0x18, 0x00, 0xFC, 0x01, 0xF8, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x7F, 
  0x00, 0x80, 0x20, 0x1C, 0x00, 0xFC, 0x03, 0xF8, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0x3F, 0x00, 0x00, 0x00, 0x01, 0x00, 0xFE, 0xCF, 0xFD, 0x3F, 
  0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x3F, 0x00, 0x00, 0x20, 0x00, 0x00, 0xFF, 
  0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x7F, 0x00, 0x00, 0x28, 
  0x80, 0x00, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 
  0x00, 0x00, 0x0C, 0x40, 0x80, 0xFF, 0xFF, 0xFF, 0x3F, 0xFF, 0xFF, 0xFF, 
  0xFF, 0xFF, 0xFF, 0x01, 0x00, 0x07, 0x00, 0xC0, 0xFF, 0xFF, 0xFF, 0x3F, 
  };

// SSD1306をグラフィックディスプレイとして使用する為のコンストラクタ
// メモリバッファ(RAM)は128X64バイト(画面フルサイズ分)
// ローテーション(画面回転)なし、SCL=5番ピン　SDA=4番ピン
U8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0,5,4) ;

void setup(void) {
  u8g2.begin() ;

  u8g2.clearBuffer() ; // バッファのクリア
  u8g2.setDrawColor(0) ;
  u8g2.drawXBM(5, 0, 118, 64, HANA) ;
  u8g2.sendBuffer() ;  // バッファ内容をOLEDに送る
}
void loop(void) {
}
------------------------------------------------------------
このサンプルは、写真を128(118)x64白黒BMPファイルに加工し、XBM形式のビットマップデータに
変換した物を貼り付けました。

変換方法を簡単に説明して置きます。
①　私は"GIMP2"を使いました。写真を開きます。
②　[画像]->[モード]->[インデックス]でウインドウを開き”モノクロ2階調”を選択して、
　　[変換]をクリックします。
③　適当にトリミングします。
　　(私の持っている"Digital Photo Professional 4"なら128x64にキッチリトリミングできるのだがぁ..)
④　[画像]->[画像の拡大・縮小]で128x64以内に縮小します。
⑤　[ファイル]->[名前を付けてエクスポート]でファイルを保存します。
　　(GIMPならこの時にXBM型式で保存可能です、⑥操作はいらないね！)
⑥　ここからXBMファイルに変換しましょう。
⑦　変換したファイルを"メモ帳"辺りで開き、HEX部分のデータをスケッチに貼り付けます。

　・u8g2.drawXBM(u8g2_uint_t x, u8g2_uint_t y, u8g2_uint_t w, u8g2_uint_t h,
　　　　　　　　　　 const uint8_t *bitmap)
　　XBMビットマップ型式を描画します。
　　x : 描画する開始位置の横座標
　　y : 描画する開始位置の縦座標
　　w : 画像の横サイズ
　　h : 画像の縦サイズ
　　*bitmap: ビットマップの先頭へのポインタ

【その他のビットマップのサンプル】
------------------------------------------------------------
#include <U8g2lib.h>

const uint8_t bmp[] PROGMEM = {
  0b00000000,
  0b00000000,
  0b01100110,
  0b11100111,
  0b11111111,
  0b01111110,
  0b00111100,
  0b00011000
};

// SSD1306をグラフィックディスプレイとして使用する為のコンストラクタ
// メモリバッファ(RAM)は128X64バイト(画面フルサイズ分)
// ローテーション(画面回転)なし、SCL=5番ピン　SDA=4番ピン
U8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0,5,4) ;

void setup(void) {
    u8g2.begin() ;

    u8g2.clearBuffer() ; // バッファのクリア
    u8g2.setFont(u8g2_font_unifont_t_symbols);
    u8g2.drawUTF8(5, 20, "Snowman: ?");
    u8g2.drawStr(5,41,"Table clock:");
    u8g2.drawGlyph(110, 41, 0x23F0);
    u8g2.drawStr(5,58,"Heart:");
    u8g2.drawXBM(60,50,8,8,bmp) ;
    u8g2.sendBuffer() ;  // バッファ内容をOLEDに送る
}
void loop(void) {
}
------------------------------------------------------------
　・u8g2.drawUTF8(u8g2_uint_t x, u8g2_uint_t y, const char *s)
　　この関数は止めた方が良いかもぉ？、UTF8フォントが使えないのでぇ．．．．
　　？の所はこちらを参照ください、そこからコピーしてArduino IDEには貼り付けられます。

　・u8g2.drawGlyph(u8g2_uint_t x, u8g2_uint_t y, uint16_t encoding)
　　1つの文字(キャラクタ)を描画します。
　　x : 描画する開始位置の横座標
　　y : 描画する開始位置の縦座標
　　encoding : 指定したフォントの文字のUnicode値
　　　　　　　 "u8g2_font_unifont_t_symbols"フォントの内容はこちらを参照ください。




【きむ茶工房ガレージハウス】
 Copyright (C) 2006-2021 Shigehiro Kimura All Rights Reserved.