Icon¶
Beschreibung¶
Icons sind Grafiken/ Bilder, die vom Entwickler eingefügt werden können, um diese auf Elementen anzeigen zu lassen.
Mit dieser Klasse lassen sich diese Grafiken anzeigen und erstellen. Es existieren außerdem eine Reihe an vordefinierten Icons.
Die Klasse erbt von Item.
Funktionen¶
Icon (const unsigned char** bitmap, const uint16_t w, const uint16_t h, const double scale = 1, const Color& color = Color(0,0,0)) |
|
Icon (const unsigned char** bitmap, const double scale = 1, const Color& color = Color(0,0,0)) |
|
Icon* |
create (const std::string str, const double scale, const Color& color) |
Icon* |
createIcon (const std::string str, const double scale, const Color& color) |
void |
draw (uint16_t x, uint16_t y, Display* disp, const Color& color) override |
void |
draw (uint16_t x, uint16_t y, Display* disp) override |
void |
drawOn (uint16_t x, uint16_t y, Display* disp) override |
void |
drawOff (uint16_t x, uint16_t y, Display* disp) override |
uint16_t |
getWidth () override |
uint16_t |
getHeight () override |
void |
setResolution (const uint16_t width, const uint16_t height, const bool override = false) override |
Variablen und Konstanten¶
const unsigned char** |
|
const „Color“ |
|
uint8_t |
|
const std::vector<uint16_t> |
icon_resolutions = { 8, 8, 16, 16, 24, 24, 32, 32, 40, 40, 48, 48, 56, 56, 64, 64, 72, 72, 80, 80, 88, 88, 96, 96 } |
Funktionen Beschreibung¶
Icon(const unsigned char** bitmap, const uint16_t w, const uint16_t h, const double scale = 1, const Color& color = Color(0,0,0))¶
1Icon::Icon(const uint8_t** bitmap, const double scale, const Color& color):
2 Item(scale),
3 bitmap(bitmap),
4 color(color)
5 {}
Der Konstruktor wird bei der Erzeugung eines neuen Icon Objektes aufgerufen. Als Parameter nimmt der Konstruktor eine Bitmap (bitmap), in der die Grafik gespeichert ist, den Skalierungsfaktor
(scale), welcher die Größe der Grafik beeinflusst und die Farbe, die die Bitmap erhalten soll (color).
In der Initialisierungsliste werden die Variablen bitmap und color mit den korrespondierenden Variablen initialisiert,
außerdem erfolgt der Aufruf vom Item Konstruktor mit scale als Argument.
Icon(const unsigned char** bitmap, const double scale = 1, const Color& color = Color(0,0,0))¶
1Icon::Icon(const uint8_t** bitmap, const uint16_t w, const uint16_t h, const double scale, const Color& color):
2 Item(scale),
3 bitmap(bitmap),
4 color(color)
5 { setResolution(w, h); }
Der Konstruktor wird bei der Erzeugung eines neuen Icon Objektes aufgerufen. Als Parameter nimmt der Konstruktor eine Bitmap (bitmap), in der die Grafik gespeichert ist,
die Breite (w) und Höhe (h) der Grafik, einen Skalierungsfaktor (scale), welcher die Größe der Grafik beeinflusst und die Farbe, die die Bitmap erhalten soll (color).
In der Initialisierungsliste werden die Variablen bitmap und color mit den korrespondierenden Variablen initialisiert, ebenso
erfolgt der Aufruf vom Item Konstruktor mit scale als Argument.
Außerdem wird die setResolution Funktion aufgerufen.
Icon* create(const std::string str, const double scale, const Color& color);¶
1Icon* Icon::create(const std::string str, const double scale, const Color& color) {
2 // if (str == "arrow_right") return new Icon(60, 60, arrow_right, color);
3 // if (str == "settings") return new Icon(60, 60, arrow_right, color);
4 // return nullptr;
5 return createIcon(str, scale, color);
6}
Diese Funktion nimmt den String str, welcher den Namen des Icons enthalten soll, den Skalierungsfaktor scale, welcher die Größe des Icons beeinflusst und die Farbe color, welche die Farbe des Icons bestimmt.
Sie ruft die createIcon Funktion auf und übergibt die genannten Parameter als Argumente. Die create Funktion hat sonst keine Funktionalität, sie existiert nur, um den Code etwas übersichtlicher zu gestalten,
da sich createIcon in einer anderen Datei befindet. Dort befinden sich auch mehr Informationen zum Aufbau des str.
Icon* createIcon(const std::string str, const double scale, const Color& color)¶
1Icon* createIcon(const std::string str, const double scale, const Color& color) {
2 #ifdef ICONPACK_default
3 if (str == "back") return new Icon(ICON_back, scale, color);
4 if (str == "ButtonClick") return new Icon(ICON_ButtonClick, scale, color);
5 if (str == "number") return new Icon(ICON_number, scale, color);
6 if (str == "reload") return new Icon(ICON_reload, scale, color);
7 if (str == "RoundButton") return new Icon(ICON_RoundButton, scale, color);
8 if (str == "settings") return new Icon(ICON_settings, scale, color);
9 if (str == "slider") return new Icon(ICON_slider, scale, color);
10 if (str == "text") return new Icon(ICON_text, scale, color);
11 #endif // default
12
13 #ifdef ICONPACK_light
14 if (str == "bulbOff") return new Icon(ICON_bulbOff, scale, color);
15 if (str == "bulbOn") return new Icon(ICON_bulbOn, scale, color);
16 #endif // light
17
18 return nullptr;
19}
Diese Funktion ist für das Erstellen von Icon Objekten zuständig. Als Parameter nimmt sie den String str,
welcher den Namen des Icons enthalten soll, den Skalierungsfaktor scale, welcher die Größe des Icons beeinflusst und die Farbe color, welche die Farbe des Icons bestimmt.
#ifdef ICONPACK_default
if (str == "back") return new Icon(ICON_back, scale, color);
if (str == "ButtonClick") return new Icon(ICON_ButtonClick, scale, color);
if (str == "number") return new Icon(ICON_number, scale, color);
if (str == "reload") return new Icon(ICON_reload, scale, color);
if (str == "RoundButton") return new Icon(ICON_RoundButton, scale, color);
if (str == "settings") return new Icon(ICON_settings, scale, color);
if (str == "slider") return new Icon(ICON_slider, scale, color);
if (str == "text") return new Icon(ICON_text, scale, color);
#endif // default
Um zu entscheiden, welche Art von Icon erstellt werden soll, werden mit if Abfragen mögliche Strings geprüft. Diese Bibliothek stellt
insgesamt 10 verschiedene, konfigurierte Icons bereit. Die Icons werden in Bitmaps angegeben und lassen sich in
icon_bitmaps.h finden.
Im Rahmen dieser Dokumentation, schauen wir uns in beispielhafter Weise das back Icon in seiner kleinsten Form genauer an.
const unsigned char _ICON_back_8_8[] PROGMEM = {0x00, 0x00, 0x7C, 0x62, 0x62, 0x00, 0x00, 0x00, };
Das Array _ICON_back_8_8 speichert die Bitmap des Icons, in diesem eines Zurückpfeils back. Dabei ist das Icon 8x8 Pixel groß. Wenn Sie also ein eigenes Icon mit einer eingetragenen
Grafik erstellen wollen, sollte diese Form eingehalten werden. Um Bitmaps zu erstellen, kann entweder ein Online Tool
(wie z.B. convertio.io) oder der in dieser Bibliothek bereitgestellte
Preprozessor, der aus Grafiken Code erstellt. Dafür muss ein Ordner icon_templates
im Hauptordner erstellt werden und in diesem müssen nur noch die Bilddateien eingefügt werden.
const unsigned char* PROGMEM ICON_back[] = { _ICON_back_8_8, _ICON_back_16_16, _ICON_back_24_24, _ICON_back_32_32, _ICON_back_40_40, _ICON_back_48_48, _ICON_back_56_56, _ICON_back_64_64, _ICON_back_72_72, _ICON_back_80_80, _ICON_back_88_88, _ICON_back_96_96 };
Werden mehrere Auflösungen vom selben Icon angelegt (wie es hier der Fall ist), müssen diese in ein Array gelegt werden, damit auch zwischen ihnen ja nach gewünschter Auflösung unterschieden werden kann.
void draw(uint16_t x, uint16_t y, Display* disp, const Color& color) override¶
1void Icon::draw(uint16_t x, uint16_t y, Display* disp, const Color& color) {
2 uint16_t tmpX = x - icon_resolutions[resolution]/2;
3 uint16_t tmpY = y - icon_resolutions[resolution+1]/2;
4 LOGGER_PATTERN("Zeichne Icon in größe _ (i=_), _ an Stelle (_/_)", icon_resolutions[resolution], resolution, icon_resolutions[resolution+1], tmpX, tmpY)
5 disp->drawBitmap(tmpX, tmpY, icon_resolutions[resolution], icon_resolutions[resolution+1], bitmap[resolution/2], color);
6};
Diese Funktion hat die Parameter x und y, die die X- bzw. Y-Koordinaten repräsentieren, bei welchen das Icon auf dem Display disp angezeigt werden soll, sowie die Farbe
color, die das Icon haben soll.
Zuerst werden temporäre X- und Y-Koordinaten berechnet, die (basierend auf x bzw y) zusätzlich die Auflösung der Icons mit einbezieht
(icon_resolution siehe createIcon). Denn je nach Auflösung verändert sich auch die tatsächliche Position auf dem Display.
Schließlich wir mit der drawBitmap das Icon gezeichnet.
void draw(uint16_t x, uint16_t y, Display* disp) override¶
1void Icon::draw(uint16_t x, uint16_t y, Display* disp) {
2 draw(x, y, disp, color);
3}
void drawOn(uint16_t x, uint16_t y, Display* disp) override¶
1void Icon::drawOn(uint16_t x, uint16_t y, Display* disp) {
2 draw(x, y, disp, color);
3}
Ruft die draw Funktion mit color als Argument auf.
Diese Funktion wird verwendet, wenn ein Element einen aktivierten und deaktivierten Zustand hat, und ein Icon für den aktivierten Zustand gezeichnet werden soll.
void drawOff(uint16_t x, uint16_t y, Display* disp) override¶
1void Icon::drawOff(uint16_t x, uint16_t y, Display* disp) {
2 draw(x, y, disp, color.getSecondaryColor());
3}
Ruft die draw Funktion mit color.getSecondaryColor() als Argument auf.
Diese Funktion wird verwendet, wenn ein Element einen aktivierten und deaktivierten Zustand hat, und ein Icon für den deaktivierten Zustand gezeichnet werden soll.
uint16_t getWidth() override¶
1uint16_t Icon::getWith() {return icon_resolutions[resolution];}
Gibt die Breite eines Icon Objektes aus.
Mehr dazu unter icon_resolutions.
uint16_t getHeight() override¶
1uint16_t Icon::getHeight() {return icon_resolutions[resolution+1];}
Gibt die Höhe eines Icon Objektes aus.
Mehr dazu unter icon_resolutions.
void setResolution(const uint16_t width, const uint16_t height, const bool override = false) override¶
1void Icon::setResolution(const uint16_t width, const uint16_t height, const bool override) {
2 for (int i = 0; i < icon_resolutions.size(); i += 2) {
3 uint16_t icon_width = icon_resolutions[i] * scale;
4 uint16_t icon_height = icon_resolutions[i + 1] * scale;
5
6 if (icon_width <= width && icon_height <= height) {
7 if (i + 2 >= icon_resolutions.size() || icon_resolutions[i + 2] > width || icon_resolutions[i + 3] > height) {
8 resolution = i;
9 return;
10 }
11 }
12 }
13}
Mit dieser Funktion wir aus einer gewünschten Breite (width) und einer Höhe (height) die Auflösung für ein Icon bestimmt.
Durch const bool override = false wird die Auflösung nur dann festgelegt, wenn eine genaue Übereinstimmung gefunden wurde.
for (int i = 0; i < icon_resolutions.size(); i += 2) {
uint16_t icon_width = icon_resolutions[i] * scale;
uint16_t icon_height = icon_resolutions[i + 1] * scale;
Die for Schleife durchläuft das icon_resolutions Array in Zweierschritten, da die werte dort paarweise angegeben sind.
Dabei wird die tatsächliche icon_width und icon_height bestimmt, indem der aus dem Array gespeicherte Wert mit dem Skalierungsfaktor
scale multipliziert wird.
if (icon_width <= width && icon_height <= height) {
if (i + 2 >= icon_resolutions.size() || icon_resolutions[i + 2] > width || icon_resolutions[i + 3] > height) {
resolution = i;
return;
}
}
Anschließend werden icon_width und icon_height mit der gewünschten width und height verglichen, ob die Werte gleich oder kleiner sind. Wenn ja,
wird getestet ob nächstgrößere Auflösung nicht mehr in das Array passt ((i + 2 >= icon_resolutions.size()) oder größer ist als die angegebenen Werte
(für die breite icon_resolutions[i + 2] > width oder für die Höhe icon_resolutions[i + 3] > height)). Wenn auch das der Fall ist, wird
resolution auf i gesetzt und die passende Auflösung wurde gefunden.
Variablen und Konstanten Beschreibung¶
const unsigned char** bitmap¶
Speichert die Bitmap einer Grafik, um sie dann später zeichnen zu können.
const Color color¶
Speichert die Farbe des Icon Objektes.
uint8_t resolution = 0¶
Angabe der Auflösung eines Icons. Mehr dazu unter icon_resolutions.
const std::vector<uint16_t> icon_resolutions = { 8, 8, 16, 16, 24, 24, 32, 32, 40, 40, 48, 48, 56, 56, 64, 64, 72, 72, 80, 80, 88, 88, 96, 96 }¶
Gibt die möglichen Auflösungen eines Icons in Pixeln an.
Dabei wird jeder uint16_t in diesem Vektor doppelt gespeichert, da der erste Wert die Breite und zweite die Höhe des Icons repräsentiert.
Da unsere Icons alle ein 1:1 Bildformat haben, sind beide Werte jeweils identisch.