Biblio­thek ubg2

Lese­zeit: 11 Minu­ten

Die Biblio­thek u8g2 kann eine Viel­zahl von OLED-Displays ansteu­ern.

Hier sol­len die Dis­plays mit den Chip­sät­zen SSD1306 und SH1106 und I2C betrach­tet wer­den.
Die Biblio­thek kennt zwei ver­schie­de­ne Modi den Bild­schirm anzu­spre­chen:

Page buf­fer mode: lang­sam, wenig Spei­cher­be­darf

Full screen buf­fer mode schnell, sehr hoher Spei­cher­be­darf mit dem Hin­weis Speicherplatz- und Sta­bi­li­täts­pro­ble­me

Sie unter­schei­den sich in der Initia­li­sie­rung und in der Pro­gram­mie­rung:

Page buf­fer mode (1 hin­ter NONAME)

// 1,3 Zoll SH1106
U8G2_SH1106_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

// 0,96 Zoll SSD1306
U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

Full screen buf­fer mode (F hin­ter NONAME)

// 1,3 Zoll SH1106
U8G2_SH1106_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

// 0,96 Zoll SSD1306
U8G2_SSD1306_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

Dar­stel­lung der Inhal­te:

Page buf­fer mode:

// Farbe weiß
u8g2.setDrawColor(1);

u8g2.firstPage();
do
{
  // Rahmen mit abgerundeten Ecken an den Bildschirmrändern zeichnen
  u8g2.drawRFrame(0, 0, 128, 64, 5);
}
while (u8g2.nextPage());

Full screen buf­fer mode:

// Farbe weiß
u8g2.setDrawColor(1);

u8g2.clearBuffer();

// Rahmen mit abgerundeten Ecken an den Bildschirmrändern zeichnen
u8g2.drawRFrame(0, 0, 128, 64, 5);

u8g2.sendBuffer();

Metho­den der Biblio­thek u8g2

Metho­de Anwei­sungPara­me­ter
OLED star­tenbegin();
Bild­schirm­brei­te fest­stel­lenget­Dis­play­Width();
Bild­schirm­hö­he fest­stel­lenget­Dis­play­H­eight();
Bild­schirm dun­kel schal­tenclear­Dis­play();
Zei­chen­far­be fest­le­gensetdrawColor(Parameter)0 → schwarz
1 → weiß
Kon­trast ein­stel­lensetContrast(Parameter)0 ... 255
Anzei­ge dre­hensetDisplayRotation(U8G2_*);U8G2_0 → 0 Grad
U8G2_1 → 90 Grad
U8G2_2 → 180 Grad
U8G2_3 → 270 Grad
Anzei­ge spie­geln (180 Grad)flipMode(Parameter);0 → nor­ma­le Aus­rich­tung
1 → 180 Grad dre­hen
wirk­sam erst bei einer Rota­ti­on
Cur­sor in die lin­ke obe­re Ecke set­zenhome();
ein­zel­nen Pixel zeich­nendrawPixel(x-Achse, y-Achse)
Linie zeich­nendrawLine(StartX, Star­tX, EndeX, EndeY);
hori­zon­ta­le Linie zeich­nendrawHLine(StartX, Star­tY, Län­ge);
ver­ti­ka­le Linie zeich­nendrawVLine(StartX, Star­tY, Län­ge);
Recht­eck zeich­nendrawFrame(StartX, Star­tY,, Brei­te, Höhe);
abge­run­de­tes Recht­eck zeich­nendrawRFrame(StartX, Star­tY, Brei­te, Höhe, Ecken­ra­di­us);
aus­ge­füll­tes Recht­eck zeich­nendrawBox(StartX, Star­tY, Brei­te, Höhe);
Kreis zeich­nendrawCircle(MittelpunkX, Mit­tel­punk­tY, Radi­us);
Aus­ge­füll­ten Kreis zeich­nendrawDisc(MittelpunkX, Mit­tel­punk­tY, Radi­us);
Ellip­se zeich­nendrawEllipse(StartX, Star­tY, Radi­usX, Radi­usY);
XBM-Bild anzei­gendrawXBM(StartX, Star­tY, Brei­te, Höhe, Array_Bilddatei);
Cur­sor set­zensetCursor(x-Achse, y-Achse);
Schrift­artu8g2.setFont(Schriftart)Bei­spie­le für funk­tio­nie­ren­de Schrift­ar­ten:
Schrift­hö­he in Pixeln (px)
6px: u8g2_font_5x7_tr
7px: u8g2_font_torussansbold8_8r
8px: u8g2_font_ncenB08_tr
10px: u8g2_font_t0_15b_me
12px: u8g2_font_helvB12_tf
13px: u8g2_font_t0_22_te
14px: u8g2_font_helvB14_tf
17px: u8g2_font_timB18_tf
18px: u8g2_font_lubB18_tr
20px: u8g2_font_courB24_tf
23px: u8g2_font_timB24_tf
25px: u8g2_font_helvR24_tf
32px: u8g2_font_logisoso32_tf
42px: u8g2_font_fub42_tf
58px: u8g2_font_logisoso58_tf
62px: u8g2_font_logisoso62_tn
Text schrei­benprint("Text");
drawStr(StartX, Star­tY ,"Text");
Schreib­rich­tungsetFontDirection(Wert);0 → nor­mal aus­ge­rich­tet
1 → 90 ° gedreht
2 → 180 ° gedreht
3 → 270 ° gedreht
draw(XBM();draw­Disc();draw­Cir­cle();draw­Li­ne();

wei­te­re Schrift­ar­ten: ➨ https://​git​hub​.com/​o​l​i​k​r​a​u​s​/​u​8​g​2​/​w​i​k​i​/​f​n​t​l​i​s​t​all
Du musst aus­pro­bie­ren, wel­che Schrift­ar­ten dar­ge­stellt wer­den kön­nen!

# include <U8g2lib.h>

// 1,3 Zoll SH1106
U8G2_SH1106_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

// 0,96 Zoll SSD1306
// U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

int BildschirmBreite = u8g2.getDisplayWidth();
int BildschirmHoehe = u8g2.getDisplayHeight(); 

// Smiley XBM erstellt mit GIMP
# define SmileyBreite 46
# define SmileyHoehe 45
static unsigned char Smiley[] = 
{
   0x00, 0x00, 0xfe, 0x1f, 0x00, 0x00, 0x00, 0xc0, 0xff, 0xff, 0x00, 0x00,
   0x00, 0xf0, 0x07, 0xf8, 0x03, 0x00, 0x00, 0xfc, 0x00, 0xc0, 0x0f, 0x00,
   0x00, 0x3e, 0x00, 0x00, 0x1f, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x7c, 0x00,
   0xc0, 0x07, 0x00, 0x00, 0xf8, 0x00, 0xe0, 0x01, 0x00, 0x00, 0xe0, 0x01,
   0xf0, 0x00, 0x00, 0x00, 0xc0, 0x03, 0x70, 0x00, 0x00, 0x00, 0x80, 0x03,
   0x38, 0x7e, 0x00, 0x80, 0x1f, 0x07, 0x38, 0xff, 0x00, 0xc0, 0x3f, 0x07,
   0x9c, 0xff, 0x01, 0xc0, 0x3f, 0x0e, 0x9c, 0xe7, 0x01, 0xc0, 0x39, 0x0e,
   0x8e, 0xc3, 0x01, 0xc0, 0x30, 0x1c, 0x8e, 0xe3, 0x01, 0xc0, 0x31, 0x1c,
   0x86, 0xf7, 0x01, 0xc0, 0x3b, 0x18, 0x87, 0xff, 0x01, 0xc0, 0x3f, 0x38,
   0x07, 0xff, 0x00, 0x80, 0x3f, 0x38, 0x03, 0x7e, 0x00, 0x80, 0x1f, 0x30,
   0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
   0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
   0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
   0x07, 0x00, 0x00, 0x00, 0x00, 0x38, 0x07, 0x20, 0x00, 0x00, 0x01, 0x38,
   0x06, 0x70, 0x00, 0x80, 0x03, 0x18, 0x0e, 0xf0, 0x00, 0xc0, 0x01, 0x1c,
   0x0e, 0xe0, 0x03, 0xf0, 0x01, 0x1c, 0x1c, 0xc0, 0x3f, 0xfc, 0x00, 0x0e,
   0x1c, 0x80, 0xff, 0x7f, 0x00, 0x0e, 0x38, 0x00, 0xfc, 0x1f, 0x00, 0x07,
   0x38, 0x00, 0xc0, 0x03, 0x00, 0x07, 0x70, 0x00, 0x00, 0x00, 0x80, 0x03,
   0xf0, 0x00, 0x00, 0x00, 0xc0, 0x03, 0xe0, 0x01, 0x00, 0x00, 0xe0, 0x01,
   0xc0, 0x07, 0x00, 0x00, 0xf8, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x7c, 0x00,
   0x00, 0x3e, 0x00, 0x00, 0x1f, 0x00, 0x00, 0xfc, 0x00, 0xc0, 0x0f, 0x00,
   0x00, 0xf0, 0x07, 0xf8, 0x03, 0x00, 0x00, 0xc0, 0xff, 0xff, 0x00, 0x00,
   0x00, 0x00, 0xfe, 0x1f, 0x00, 0x00 
};

// Schneemann XBM erstellt mit GIMP
# define SchneemannBreite 28
# define SchneemannHoehe 62
static unsigned char Schneemann[] = 
{
   0x00, 0xf0, 0x01, 0x00, 0x00, 0xfc, 0x07, 0x00, 0x00, 0x0e, 0x06, 0x00,
   0x00, 0x06, 0x0c, 0x00, 0x00, 0x02, 0x08, 0x00, 0x00, 0x03, 0x18, 0x00,
   0x00, 0x03, 0x18, 0x00, 0x00, 0x03, 0x18, 0x00, 0x00, 0x03, 0x38, 0x00,
   0xe0, 0xff, 0xff, 0x03, 0x00, 0xfe, 0x0f, 0x00, 0x00, 0x0f, 0x1e, 0x00,
   0x80, 0x03, 0x1c, 0x00, 0x80, 0x01, 0x38, 0x00, 0xc0, 0x19, 0x37, 0x00,
   0xc0, 0x1c, 0x37, 0x00, 0xc0, 0x18, 0x27, 0x00, 0xc0, 0x00, 0x20, 0x00,
   0xc0, 0x08, 0x21, 0x00, 0xc0, 0xf9, 0x31, 0x00, 0xc0, 0xf1, 0x38, 0x00,
   0x80, 0x03, 0x38, 0x00, 0x80, 0x07, 0x1c, 0x00, 0x00, 0x1f, 0x0f, 0x00,
   0x00, 0xfc, 0x07, 0x00, 0x00, 0xfc, 0x03, 0x04, 0x00, 0xff, 0x0f, 0x06,
   0x80, 0x07, 0x1e, 0x06, 0xc0, 0x03, 0x3c, 0x03, 0xe0, 0x00, 0x70, 0x03,
   0xf0, 0x00, 0xf0, 0x01, 0x70, 0x00, 0xe0, 0x00, 0x38, 0x00, 0xc0, 0x01,
   0x38, 0xf0, 0xc0, 0x01, 0x18, 0xf0, 0xe0, 0x01, 0x18, 0xf0, 0xb0, 0x01,
   0x0c, 0x70, 0x30, 0x03, 0x0c, 0x00, 0x18, 0x03, 0x0c, 0x00, 0x18, 0x03,
   0x0e, 0x00, 0x08, 0x07, 0x06, 0x00, 0x0f, 0x06, 0x06, 0x00, 0x0f, 0x06,
   0x06, 0x30, 0x06, 0x06, 0x06, 0x70, 0x00, 0x06, 0x06, 0xf0, 0x00, 0x06,
   0x06, 0xf0, 0x00, 0x06, 0x0e, 0x60, 0x00, 0x07, 0x0c, 0x00, 0x00, 0x03,
   0x0c, 0x00, 0x00, 0x03, 0x0c, 0x00, 0x00, 0x03, 0x0c, 0x00, 0x00, 0x03,
   0x18, 0x00, 0x80, 0x01, 0x38, 0x60, 0xc0, 0x01, 0x38, 0xf0, 0xc0, 0x01,
   0x78, 0xf0, 0xe0, 0x00, 0xf0, 0xf0, 0xf0, 0x00, 0xf0, 0x00, 0x70, 0x00,
   0xe0, 0x03, 0x7c, 0x00, 0xe0, 0x07, 0x3e, 0x00, 0xe0, 0xff, 0x3f, 0x00,
   0xc0, 0xff, 0x1f, 0x00, 0x00, 0x00, 0x00, 0x00 
};

void setup()
{
  // Zufallsgenerator starten
  randomSeed(A0);
  
  // Display starten
  u8g2.begin();

  // Kontrast maximal 255
  u8g2.setContrast(200);
}

void loop()
{
  // Farbe weiß
  u8g2.setDrawColor(1);

  // Smiley
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(40, 10, SmileyBreite, SmileyHoehe, Smiley);
  }
  while (u8g2.nextPage());
  delay(2000);
  // Schneemann
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(50, 1, SchneemannBreite, SchneemannHoehe, Schneemann);
  }
  while (u8g2.nextPage());
  delay(2000);

  // Pixelmuster
  u8g2.firstPage();
  do
  {
    for (int i = 0; i < 500; i ++)
    {
      int x = random(1, BildschirmBreite);
      int y = random(1, BildschirmHoehe);
      u8g2.drawPixel(x, y);
    }
  }
  while (u8g2.nextPage());
  delay(2000);

  // u8g2.setFont(u8g2_font_t0_22_te);
  u8g2.setFont(u8g2_font_unifont_t_symbols);

  // Text horizontal
  u8g2.firstPage();
  do
  {
    u8g2.setFontDirection(0);
    u8g2.setCursor(2, BildschirmHoehe / 2);
    u8g2.print("Text");
  }
  while (u8g2.nextPage());
  delay(2000);

  // Text 90 Grad gedreht
  u8g2.firstPage();
  do
  {
    u8g2.setFontDirection(1);
    u8g2.setCursor(BildschirmBreite / 2, 2);
    u8g2.print("Text");
  }
  while (u8g2.nextPage());
  delay(2000);
  // Text 180 Grad gedreht
  u8g2.firstPage();
  do
  {
    u8g2.setFontDirection(2);
    u8g2.setCursor(BildschirmBreite - 2, BildschirmHoehe / 2);
    u8g2.print("Text");
  }
  while (u8g2.nextPage());
  delay(2000);

  // Text 270 Grad gedreht
  u8g2.firstPage();
  do
  {
    u8g2.setFontDirection(3);
    u8g2.setCursor(BildschirmBreite / 2,  BildschirmHoehe - 2);
    u8g2.print("Text");
  }
  while (u8g2.nextPage());
  delay(2000);

  // Kreise
  u8g2.firstPage();
  do
  {
    for (int i = 2; i < BildschirmHoehe / 2; i += 3)
    {
      u8g2.drawCircle(BildschirmBreite / 2, BildschirmHoehe / 2, i);
    }
  }
  while (u8g2.nextPage());
  delay(2000);

  // Rahmen
  u8g2.firstPage();
  do
  {
    for (int i = 2; i < BildschirmHoehe; i += 4)
    {
      u8g2.drawFrame(0, 0, i, i);
    }
  }
  while (u8g2.nextPage());
  delay(2000);
  // vertikale Linie
  u8g2.firstPage();
  do
  {
    for (int i = 0; i < BildschirmBreite; i += 4)
    {
      u8g2.drawVLine(i, 0, BildschirmBreite - 1);
    }
  }
  while (u8g2.nextPage());
  delay(2000); 

  // horizontale Linie
  u8g2.firstPage();
  do
  {
    for (int i = 0; i < BildschirmHoehe; i += 4)
    {
      u8g2.drawHLine(0, i, BildschirmBreite - 1);
    }
  }
  while (u8g2.nextPage());
  delay(2000);

  // ausgefüllte Kreise
  u8g2.firstPage();
  do
  {
    int Radius = 5;
    int StartX = 10;
    int StartY = 10;
    while (StartX < BildschirmBreite - Radius)
    {
      for (int i = StartY; i < BildschirmBreite - Radius; i += 20)
      {
        u8g2.drawDisc(StartX, i, Radius);
      }
      StartX += 10;
    }
  }
  while (u8g2.nextPage());
  delay(2000);
  // Linien
  u8g2.firstPage();
  do
  {
    for (int i = 0; i < BildschirmBreite; i += 5)
    {
      u8g2.drawLine(0, i, 128, 64);
    }
    for (int i = BildschirmBreite; i > 0; i -= 5)
    {
      u8g2.drawLine(BildschirmBreite, i, 0, 0);
    }
  }
  while (u8g2.nextPage());
  delay(2000);
}

Bei­spiel Bild­schirm dre­hen:

# include <U8g2lib.h>

// 0,96 Zoll SSD1306
U8G2_SH1106_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

// 1,3 Zoll SH1106
// U8G2_SSD1306_128X64_NONAME_1_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

int BildschirmBreite = u8g2.getDisplayWidth();
int BildschirmHoehe = u8g2.getDisplayHeight();

// Smiley
# define SmileyBreite 46
# define SmileyHoehe 45
static unsigned char Smiley[] = 
{
  0x00, 0x00, 0xfe, 0x1f, 0x00, 0x00, 0x00, 0xc0, 0xff, 0xff, 0x00, 0x00,
  0x00, 0xf0, 0x07, 0xf8, 0x03, 0x00, 0x00, 0xfc, 0x00, 0xc0, 0x0f, 0x00,
  0x00, 0x3e, 0x00, 0x00, 0x1f, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x7c, 0x00,
  0xc0, 0x07, 0x00, 0x00, 0xf8, 0x00, 0xe0, 0x01, 0x00, 0x00, 0xe0, 0x01,
  0xf0, 0x00, 0x00, 0x00, 0xc0, 0x03, 0x70, 0x00, 0x00, 0x00, 0x80, 0x03,
  0x38, 0x7e, 0x00, 0x80, 0x1f, 0x07, 0x38, 0xff, 0x00, 0xc0, 0x3f, 0x07,
  0x9c, 0xff, 0x01, 0xc0, 0x3f, 0x0e, 0x9c, 0xe7, 0x01, 0xc0, 0x39, 0x0e,
  0x8e, 0xc3, 0x01, 0xc0, 0x30, 0x1c, 0x8e, 0xe3, 0x01, 0xc0, 0x31, 0x1c,
  0x86, 0xf7, 0x01, 0xc0, 0x3b, 0x18, 0x87, 0xff, 0x01, 0xc0, 0x3f, 0x38,
  0x07, 0xff, 0x00, 0x80, 0x3f, 0x38, 0x03, 0x7e, 0x00, 0x80, 0x1f, 0x30,
  0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
  0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
  0x03, 0x00, 0x00, 0x00, 0x00, 0x30, 0x03, 0x00, 0x00, 0x00, 0x00, 0x30,
  0x07, 0x00, 0x00, 0x00, 0x00, 0x38, 0x07, 0x20, 0x00, 0x00, 0x01, 0x38,
  0x06, 0x70, 0x00, 0x80, 0x03, 0x18, 0x0e, 0xf0, 0x00, 0xc0, 0x01, 0x1c,
  0x0e, 0xe0, 0x03, 0xf0, 0x01, 0x1c, 0x1c, 0xc0, 0x3f, 0xfc, 0x00, 0x0e,
  0x1c, 0x80, 0xff, 0x7f, 0x00, 0x0e, 0x38, 0x00, 0xfc, 0x1f, 0x00, 0x07,
  0x38, 0x00, 0xc0, 0x03, 0x00, 0x07, 0x70, 0x00, 0x00, 0x00, 0x80, 0x03,
  0xf0, 0x00, 0x00, 0x00, 0xc0, 0x03, 0xe0, 0x01, 0x00, 0x00, 0xe0, 0x01,
  0xc0, 0x07, 0x00, 0x00, 0xf8, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x7c, 0x00,
  0x00, 0x3e, 0x00, 0x00, 0x1f, 0x00, 0x00, 0xfc, 0x00, 0xc0, 0x0f, 0x00,
  0x00, 0xf0, 0x07, 0xf8, 0x03, 0x00, 0x00, 0xc0, 0xff, 0xff, 0x00, 0x00,
  0x00, 0x00, 0xfe, 0x1f, 0x00, 0x00
};

void setup()
{
  // Display starten
  u8g2.begin();

  // Farbe weiß
  u8g2.setDrawColor(1);
}

void loop()
{
  // Position 0 Grad
  u8g2.clearDisplay();
  u8g2.setDisplayRotation(U8G2_R0);
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(40, 10, SmileyBreite, SmileyHoehe, Smiley);
  }
  while (u8g2.nextPage());
  delay(2000);

  // Position 90 Grad
  u8g2.clearDisplay();
  u8g2.setDisplayRotation(U8G2_R1);
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(10, 30, SmileyBreite, SmileyHoehe, Smiley);
  }
  while (u8g2.nextPage());
  delay(2000);

  // Position 180 Grad
  u8g2.clearDisplay();
  u8g2.setDisplayRotation(U8G2_R2);
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(40, 10, SmileyBreite, SmileyHoehe, Smiley);
  }
  while (u8g2.nextPage());
  delay(2000);

  // Position 270 Grad
  u8g2.clearDisplay();
  u8g2.setDisplayRotation(U8G2_R3);
  u8g2.firstPage();
  do
  {
    u8g2.drawXBM(10, 30, SmileyBreite, SmileyHoehe, Smiley);
  }
  while (u8g2.nextPage());
  delay(2000);
}

Letzte Aktualisierung: 6. Jul 2020 @ 9:51