Zum Hauptinhalt springen

Grafiken zeichnen

Was dieses Beispiel zeigt​

Zeichnen Sie gefüllte und umrandete Rechtecke, Kreise und Dreiecke, Text und ein Bitmap-Logo in mehreren Farben und zeigen Sie sie mit einem einzigen Refresh an. Das Logo stammt aus logoImg.h, die im Beispielordner neben dem Sketch liegt.

Beispielcode​

Select Board
Inkplate7SPECTRA_Simple.ino
#include "Inkplate.h"
#include "logoImg.h"

Inkplate display;

void setup()
{
    display.begin();
    display.clearDisplay();
    display.display();

    display.fillScreen(INKPLATE_WHITE);

    // Draw many rectangles
    display.fillRect(0, 0, 50, 50, INKPLATE_BLACK);
    display.fillRect(0, 50, 50, 50, INKPLATE_WHITE);
    display.fillRect(0, 100, 50, 50, INKPLATE_GREEN-1);
    display.fillRect(0, 150, 50, 50, INKPLATE_BLUE-1);
    display.fillRect(0, 200, 50, 50, INKPLATE_RED);
    display.fillRect(0, 250, 50, 50, INKPLATE_YELLOW);

    display.drawRect(55, 0, 50, 50, INKPLATE_BLACK);
    display.drawRect(55, 50, 50, 50, INKPLATE_WHITE);
    display.drawRect(55, 100, 50, 50, INKPLATE_GREEN-1);
    display.drawRect(55, 150, 50, 50, INKPLATE_BLUE-1);
    display.drawRect(55, 200, 50, 50, INKPLATE_RED);
    display.drawRect(55, 250, 50, 50, INKPLATE_YELLOW);

    // Draw many circles
    display.fillCircle(135, 25, 24, INKPLATE_BLACK);
    display.fillCircle(135, 75, 24, INKPLATE_WHITE);
    display.fillCircle(135, 125, 24, INKPLATE_GREEN-1);
    display.fillCircle(135, 175, 24, INKPLATE_BLUE-1);
    display.fillCircle(135, 225, 24, INKPLATE_RED);
    display.fillCircle(135, 275, 24, INKPLATE_YELLOW);

    display.drawCircle(190, 25, 24, INKPLATE_BLACK);
    display.drawCircle(190, 75, 24, INKPLATE_WHITE);
    display.drawCircle(190, 125, 24, INKPLATE_GREEN-1);
    display.drawCircle(190, 175, 24, INKPLATE_BLUE-1);
    display.drawCircle(190, 225, 24, INKPLATE_RED);
    display.drawCircle(190, 275, 24, INKPLATE_YELLOW);;

    // Draw many triangles
    display.fillTriangle(210, 50, 260, 50, 235, 0, INKPLATE_BLACK);
    display.fillTriangle(210, 100, 260, 100, 235, 50, INKPLATE_WHITE);
    display.fillTriangle(210, 150, 260, 150, 235, 100, INKPLATE_GREEN-1);
    display.fillTriangle(210, 200, 260, 200, 235, 150, INKPLATE_BLUE-1);
    display.fillTriangle(210, 250, 260, 250, 235, 200, INKPLATE_RED);
    display.fillTriangle(210, 300, 260, 300, 235, 250, INKPLATE_YELLOW);

    display.drawTriangle(210, 50, 260, 50, 235, 0, INKPLATE_BLACK);
    display.drawTriangle(210, 100, 260, 100, 235, 50, INKPLATE_WHITE);
    display.drawTriangle(210, 150, 260, 150, 235, 100, INKPLATE_GREEN-1);
    display.drawTriangle(210, 200, 260, 200, 235, 150, INKPLATE_BLUE-1);
    display.drawTriangle(210, 250, 260, 250, 235, 200, INKPLATE_RED);
    display.drawTriangle(210, 300, 260, 300, 235, 250, INKPLATE_YELLOW);

    // Show some pretty text
    display.setTextColor(INKPLATE_BLACK);
    display.setCursor(265, 0);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    display.setTextColor(INKPLATE_WHITE);
    display.setCursor(265, 50);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    display.setTextColor(INKPLATE_GREEN-1);
    display.setCursor(265, 100);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    display.setTextColor(INKPLATE_BLUE-1);
    display.setCursor(265, 150);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    display.setTextColor(INKPLATE_RED);
    display.setCursor(265, 200);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    display.setTextColor(INKPLATE_YELLOW);
    display.setCursor(265, 250);
    display.setTextSize(1);
    display.print("Welcome to Inkplate 7SPECTRA!");

    // Draw logo
    display.drawBitmap(0, 350, logo, logo_w, logo_h, INKPLATE_BLACK);
    display.drawBitmap(100, 350, logo, logo_w, logo_h, INKPLATE_GREEN-1);
    display.drawBitmap(200, 350, logo, logo_w, logo_h, INKPLATE_BLUE-1);
    display.drawBitmap(300, 350, logo, logo_w, logo_h, INKPLATE_RED);
    display.drawBitmap(400, 350, logo, logo_w, logo_h, INKPLATE_YELLOW);

    display.display();
}

void loop()
{
}

Der Sketch übergibt INKPLATE_GREEN-1 und INKPLATE_BLUE-1 als Farben. Die Farbkonstanten sind Indizes von 0 bis 5, daher ist INKPLATE_GREEN-1 der Index 4 (Blau) und INKPLATE_BLUE-1 der Index 3 (Rot). Verwenden Sie die Konstanten allein, wenn Sie Grün und Blau haben möchten.

Verwendete Funktionen​

Inkplate()returns None

Erstellt das Inkplate-Objekt. Inkplate 7SPECTRA hat nur einen einzigen Sechs-Farben-Modus, daher erwartet der Konstruktor kein Modus-Argument.

ReturnsKonstruktor; kein Rückgabewert.

display.begin()returns void

Initialisiert die Bibliothek, die Peripherie und den Framebuffer. Rufen Sie sie einmal in setup() auf; spätere Aufrufe werden ignoriert.

ReturnsNichts.

display.clearDisplay()returns void

Füllt den Framebuffer mit Weiß. Das Panel wird dadurch nicht verändert; rufen Sie dafür anschließend display() auf.

ReturnsNichts.

display.display(bool _leaveOn = 0)returns void

Sendet den gesamten Framebuffer an das Panel und aktualisiert es. Der Sketch ruft sie einmal am Anfang auf, um das Panel zu löschen, und einmal am Ende, um die Formen anzuzeigen.

ReturnsNichts.

display.fillScreen(uint16_t color)returns void

Füllt den gesamten Framebuffer mit einer Farbe.

ReturnsNichts.

display.fillRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color)returns void

Zeichnet ein gefülltes Rechteck mit der oberen linken Ecke bei (x, y).

ReturnsNichts.

display.drawRect(int16_t x, int16_t y, int16_t w, int16_t h, uint16_t color)returns void

Zeichnet einen Rechteckumriss mit der oberen linken Ecke bei (x, y).

ReturnsNichts.

display.fillCircle(int16_t x0, int16_t y0, int16_t r, uint16_t color)returns void

Zeichnet einen gefüllten Kreis mit dem Mittelpunkt bei (x0, y0) und dem Radius r.

ReturnsNichts.

display.drawCircle(int16_t x0, int16_t y0, int16_t r, uint16_t color)returns void

Zeichnet einen Kreisumriss mit dem Mittelpunkt bei (x0, y0) und dem Radius r.

ReturnsNichts.

display.fillTriangle(int16_t x0, int16_t y0, int16_t x1, int16_t y1, int16_t x2, int16_t y2, uint16_t color)returns void

Zeichnet ein gefülltes Dreieck durch die drei Eckpunkte.

ReturnsNichts.

display.drawTriangle(int16_t x0, int16_t y0, int16_t x1, int16_t y1, int16_t x2, int16_t y2, uint16_t color)returns void

Zeichnet einen Dreiecksumriss durch die drei Eckpunkte.

ReturnsNichts.

display.setTextColor(uint16_t c)returns void

Legt die Textfarbe für die folgenden print()-Aufrufe fest.

ReturnsNichts.

display.setCursor(int16_t x, int16_t y)returns void

Legt fest, wo der nächste ausgegebene Text beginnt, in Pixeln von der oberen linken Ecke.

ReturnsNichts.

display.setTextSize(uint8_t s)returns void

Legt die Textvergrößerung fest; 1 ist die Basisschrift mit 5×7 Pixeln.

ReturnsNichts.

display.print(value)returns size_t

Gibt Text an der Cursorposition in den Framebuffer aus, wie Serial.print().

ReturnsAnzahl der ausgegebenen Bytes.

display.drawBitmap(int16_t x, int16_t y, const uint8_t bitmap[], int16_t w, int16_t h, uint16_t color)returns void

Zeichnet eine 1-Bit-Bitmap mit der oberen linken Ecke bei (x, y): Gesetzte Bits übernehmen die Farbe, gelöschte Bits bleiben unverändert.

ReturnsNichts.

Parameter

TypNameBeschreibung
int16_tx, yObere linke Ecke in Pixeln.
const uint8_t[]bitmapDas Bitmap-Array, hier logo aus logoImg.h.
int16_tw, hBreite und Höhe der Bitmap, hier logo_w und logo_h.
uint16_tcolorFarbe für die gesetzten Bits.

Alle Zeichenfunktionen stammen aus der Adafruit-GFX-Klasse, auf der die Bibliothek aufbaut. Ihr Argument color ist eine der sechs Farbkonstanten.

Was Sie erwarten können​

Das Panel wird zuerst auf Weiß aktualisiert. Nach dem zweiten Refresh zeigt der linke Teil des Bildschirms sechs Reihen mit Formen, neben jeder Reihe die Zeile „Welcome to Inkplate 7SPECTRA!“ und darunter fünf Kopien des Logos. Von oben nach unten sind die Reihen schwarz, weiß, blau, rot, rot und gelb, bedingt durch die oben erläuterten Farbwerte mit -1. Die weiße Reihe ist auf dem weißen Hintergrund unsichtbar. Der Sketch gibt nichts im Serial Monitor aus.

🔗Vollständiges Beispiel öffnen

examples/Inkplate7SPECTRA/Basic/Inkplate7SPECTRA_Simple

→