\pagebreak

## RGB Matrix Feature

Zur Implementierung der RGB Matrix wurde in der Präsentationsschicht
ein CustomPainter genutzt um die Matrix zu zeichnen. Per Touch Eingabe
können auf der Matrix die einzelnen Pixel angesteuert werden, die aktive
Farbe wird dabei in einem Kreis rechts neben der Matrix angezeigt (siehe Abbildung \ref{matrix}).
Beim Klick auf den Farbkreis öffnet sich ein ColorPicker, mit dem andere
Farben ausgewählt werden können (siehe Abbildung \ref{matrixColor}). Der ColorPicker
nutzt das _flex_color_picker_ Paket, welches auf GitHub verfügbar ist [@mikerydstromRydmikeFlex_color_picker2024].

\begin{multicols}{2}

\begin{figure}[H]
\caption{Das RGB Matrix Feature}
\label{matrix}
\centering
\shadowimage[width=7cm]{./assets/screenshots/matrix.png}
\end{figure}

\begin{figure}[H]
\caption{Der Color Picker für die RGB Farben}
\label{matrixColor}
\centering
\shadowimage[width=7cm]{./assets/screenshots/matrixColor.png}
\end{figure}

\end{multicols}

Um die Sparkfun RGB Matrix anzusteuern, wurde in der Geschäftslogikschicht
der Service _MatrixService_ implementiert. Dieser Service nutzt die
_dart_periphery_ Bibliothek, um die Matrix über die SPI Schnittstelle
anzusteuern. Die Bibliothek ist unter GitHub verfügbar [@sauerPeziDart_periphery2023].

Anfangs wurde stattdessen die _linux_spidev_ Bibliothek genutzt, welche von dem
Entwickler von Flutter-Pi stammt und auch unter GitHub verfügbar ist [@hanneswinklerFlutter_packagesPackagesLinux_spidev].
Die Bibliothek funktionierte im Test jedoch nicht zuverlässig, es kam immer
nach einer gewissen Zeit zu dem Fehler, dass die SPI Schnittstelle nicht
mehr erreichbar war. Daher wurde die Bibliothek durch _dart_periphery_ ersetzt,
welche zuverlässig funktioniert.

Die Sparkfun RGB Matrix erwartet eine Liste von 64 RGB Farben als Integers
im Bereich von 0 bis 255. Für die Nutzung im Service wird die Liste aus den
Farben dazu von den 32-bit ARGB Farben welche Flutter standardmäßig nutzt,
in den 8-bit Farbbereich umgerechnet mit einer Hilfsfunktion _findClosestColorIndex_.
Die Liste aus den Farben wird dann im MatrixService an die SPI Schnittstelle
transferiert und das gemalte Bild wird von der Software Matrix in Flutter auf die
physische Hardware Matrix gespiegelt.

<!-- \lstinputlisting[language=Java, caption=Implementierung des Matrix Service, captionpos=t]
{code/flutter_elinux/lib/features/matrix_rgb/business/service/matrix_service.dart} -->

<!-- \begin{figure}[ht]
\caption{Example caption}
\centering
\begin{minipage}{7cm}
\dirtree{%
.1 matrix\char`\_rgb/.
    .2 business/.
    .3 service/.
    .4 matrix\char`\_service.dart.
.3 utils/.
.4 find\char`\_closest\char`\_color\char`\_index.dart.
    .2 data/.
    .3 models/.
    .4 pixel.dart.
    .2 presentation/.
    .3 widgets/.
    .4 pixel\char`\_painter.dart.
.3 matrix\char`\_screen.dart.
}
\end{minipage}
\end{figure} -->
