Chars in C (PI5)

Zeichnen von Zeichen auf dem Raspberry Pi

Nachdem wir eine Funktion zum Setzen einzelner Pixel implementiert haben, möchten wir nun dem Raspberry Pi beibringen, Text auf dem Bildschirm anzuzeigen. Texte bestehen aus Schriftzeichen, die der Computer nicht von Natur aus kennt. Ähnlich wie ein Mensch muss der Computer zunächst "lernen", wie jedes einzelne Zeichen aussieht, bevor er es darstellen kann. Diese Zeichen sind in einem bestimmten Code definiert, den der Computer versteht. Einer der am weitesten verbreiteten Codes ist der ANSI-Zeichencode.

Der ANSI-Zeichencode

Der ANSI-Zeichencode, den wir hier verwenden, ist eine Erweiterung des ursprünglichen ASCII-Codes. Während ASCII ursprünglich nur 7-Bit pro Zeichen verwendete, erweitert ANSI dies auf 8-Bit, was einem Byte entspricht. Der ANSI-Code wurde entwickelt, als Computer über Netzwerke kommunizieren mussten und sicherstellen wollten, dass beide Seiten dieselben Zeichen verwenden. Die ersten 128 Zeichen im ANSI-Code stimmen mit dem ASCII-Code überein, aber die Zeichen 128 bis 255 können je nach verwendeter Codepage variieren.

Wir verwenden hier die "Codepage 437", die ursprünglich von IBM für MS-DOS-Rechner entwickelt wurde und auch heute noch in der Windows-Kommandozeile verwendet wird.

	00	01	02	03	04	05	06	07	08	09	0A	0B	0C	0D	0E	0F
0x0	NULL	☺	☻	♥	♦	♣	♠	•	◘	○	◙	♂	♀	♪	♫	☼
0x1	►	◄	↕	‼	¶	§	▬	↨	↑	↓	→	←	∟	↔	▲	▼
0x2	Space	!	"	#	$	%	&	'	(	)	*	+	,	-	.	/
0x3	0	1	2	3	4	5	6	7	8	9	:	;	<	=	>	?
0x4	@	A	B	C	D	E	F	G	H	I	J	K	L	M	N	O
0x5	P	Q	R	S	T	U	V	W	X	Y	Z	[	\	]	^	_
0x6	`	a	b	c	d	e	f	g	h	i	j	k	l	m	n	o
0x7	p	q	r	s	t	u	v	w	x	y	z	{		}	~	DEL
0x8	Ç	ü	é	â	ä	à	å	ç	ê	ë	è	ï	î	ì	Ä	Å
0x9	É	æ	Æ	ô	ö	ò	û	ù	ÿ	Ö	Ü	¢	£	¥	₧	ƒ
0xA	á	í	ó	ú	ñ	Ñ	ª	º	¿	⌐	¬	½	¼	¡	«	»
0xB	░	▒	▓	│	┤	╡	╢	╖	╕	╣	║	╗	╝	╜	╛	┐
0xC	└	┴	┬	├	─	┼	╞	╟	╚	╔	╩	╦	╠	═	╬	╧
0xD	╨	╤	╥	╙	╘	╒	╓		╪	┘	┌	█	▄	▌	▐	▀
0xE	α	ß	Γ	π	Σ	σ	µ	τ	Φ	Θ	Ω	δ	∞	φ	ε	∩
0xF	≡	±	≥	≤	⌠	⌡	÷	≈	°	•	·	√	ⁿ	²	■

Erstellen einer Schriftart (Font)

Um den Computer in die Lage zu versetzen, Zeichen darzustellen, müssen wir ihm zeigen, wie jedes Zeichen aussieht. Dazu erstellen wir eine Art Datenbank, in der jedes Zeichen als ein 8x8-Pixel-Muster beschrieben wird.

Beispielsweise könnte die Datei, die diese Zeichen beschreibt, folgendermaßen aussehen:

/* 8x8 FONT by Satyria */

/* Dimension */
#define FONT_WIDTH  8 
#define FONT_HEIGHT 8 
#define FONT_MAX 256


unsigned char font[256][8] = {
// Data
// 0 NULL
{
0b00000000,
0b00000000,
0b00000000,
0b00000000,
0b00000000,
0b00000000,
0b00000000,
0b00000000
},
... Weitere Zeichen
{
// 65 A
0b00011000,
0b00111100,
0b00111100,
0b01100110,
0b01111110,
0b11000011,
0b11000011,
0b00000000
},{
// 66 B
0b11111100,
0b01100110,
0b01100110,
0b01111100,
0b01100110,
0b01100110,
0b11111100,
0b00000000
},
...

In diesem Beispiel wird das Zeichen "A" als ein 8x8-Pixel großes Muster beschrieben, wobei jedes Byte eine Zeile des Musters darstellt. Jedes Bit in diesem Byte steht für einen Pixel: Ein gesetztes Bit (1) bedeutet, dass der Pixel in der Vordergrundfarbe gezeichnet wird, während ein nicht gesetztes Bit (0) bedeutet, dass der Pixel in der Hintergrundfarbe gezeichnet wird.

Mein Beispiel für die Schriftart habe ich als "ms8x8font.fon" im Includeverzeichnis abgelegt.

Zeichnen von Zeichen auf dem Bildschirm: DrawChar-Funktion

Die Funktion DrawChar zeichnet ein einzelnes Zeichen an einer bestimmten Position auf dem Bildschirm. Hier ist der vollständige Code der Funktion:

void DrawChar(char c, u32 x0, u32 y0)
{
    unsigned char *sym = font[(unsigned char)c];
    
    for (u32 i = 0; i < FONT_HEIGHT; i++)
    {
        for (u32 j = 0; j < FONT_WIDTH; j++)
        {
            u32 check = (sym[i] >> (7 - j)) & 1;
            
            if (check == 1)
            {
                DrawColor = FrontColor;
            }
            else
            {
                DrawColor = BackColor;
            }
            
            DrawPixel(x0 + j, y0 + i);
        }
    }
}

Erklärung der Funktion

Funktionskopf:

void DrawChar(char c, u32 x0, u32 y0)

void bedeutet, dass die Funktion keinen Wert zurückgibt.

char c ist das Zeichen, das gezeichnet werden soll.

u32 x0 und u32 y0 sind die x- und y-Koordinaten auf dem Bildschirm, an denen das Zeichen beginnen soll.

Zeiger auf das Zeichen im Font-Array:

Copy

unsigned char *sym = font[(unsigned char)c]; unsigned char *sym ist ein Zeiger auf das 8x8-Pixel-Muster des Zeichens. font[(unsigned char)c] greift auf das entsprechende Zeichenmuster im font-Array zu. Jedes Zeichen wird durch ein 8x8-Pixel-Muster dargestellt. Äußere Schleife: Zeilen durchlaufen:

Copy

for (u32 i = 0; i < FONT_HEIGHT; i++) Diese Schleife durchläuft jede Zeile des 8x8-Pixel-Musters. u32 i ist die aktuelle Zeile im Pixel-Muster (von 0 bis 7). Innere Schleife: Spalten durchlaufen:

Copy

for (u32 j = 0; j < FONT_WIDTH; j++) Diese Schleife durchläuft jede Spalte der aktuellen Zeile. u32 j ist die aktuelle Spalte im Pixel-Muster (von 0 bis 7). Prüfen, ob das Bit gesetzt ist:

Copy

u32 check = (sym[i] >> (7 - j)) & 1; sym[i] lädt das Byte der aktuellen Zeile. >> (7 - j) verschiebt die Bits nach rechts, sodass das Bit, das wir prüfen wollen, an der niedrigsten Stelle steht. & 1 maskiert alle anderen Bits außer dem niedrigsten Bit. Das Ergebnis ist entweder 1 (Bit gesetzt) oder 0 (Bit nicht gesetzt). Setzen der Zeichenfarbe:

Copy

if (check == 1) {

   DrawColor = FrontColor;

} else {

   DrawColor = BackColor;

} Wenn check 1 ist, bedeutet das, dass das Bit gesetzt ist, und wir setzen die Zeichenfarbe (DrawColor) auf die Vordergrundfarbe (FrontColor). Wenn check 0 ist, setzen wir die Zeichenfarbe auf die Hintergrundfarbe (BackColor). Zeichnen des Pixels:

Copy

DrawPixel(x0 + j, y0 + i); DrawPixel zeichnet den Pixel an der Position (x0 + j, y0 + i). x0 + j gibt die x-Koordinate des aktuellen Pixels an. y0 + i gibt die y-Koordinate des aktuellen Pixels an. Zusammenfassung Die DrawChar-Funktion durchläuft das 8x8-Pixel-Muster eines Zeichens und zeichnet jeden Pixel an der entsprechenden Position auf dem Bildschirm. Die Farbe des Pixels hängt davon ab, ob das entsprechende Bit im Pixel-Muster gesetzt ist oder nicht.

void DrawChar(char c, u32 x0, u32 y0)
{
    unsigned char *sym = font[(unsigned char)c];

Nun erstellen wir eine Schleife für jede Zeile (i) und für jedes Bit (j) im Wert.

    for (u32 i = 0; i < FONT_HEIGHT; i++)
    {
        for (u32 j = 0; j < FONT_WIDTH; j++)
        {

Nun werten wir jedes Bit aus und prüfen, ob dieses gesetzt ist. Dazu laden wir das Byte, da wir von Links nach rechts auswerten müssen, subtrahieren wir j von 7 ab. Unser Byte wird anschliesen um den berechneten Wert nach rechts verschoben. Mit "AND 1" werden alle höheren Bits gelöscht, so dass wir immer 1 (für gesetzt) oder 0 (wenn nicht gesetzt) als Ergebnis bekommen, dass wir dann Auswerten können.

            u32 check = (sym[i] >> (7 - j)) & 1;

Mit einer einfachen if-Abfrage prüfen wir nun, ob das Bit gesetzt war, oder nicht. Dementsprechend setzen wir die Zeichenfarbe (DrawColor) auf die Vordergrundfarbe oder Hintergrundfarbe.

            if (check == 1)
            {
                DrawColor = FrontColor;
            }
            else
            {
                DrawColor = BackColor;
            }

Da wir in x0 und y0 die jeweilige Position haben, an der das Zeichen gezeichnet werden soll und über die Schleife in j und i die Position des Zeichens haben, verwenden wir diese Daten und rufen die DrawPixel-Funktion auf.

            DrawPixel(x0 + j, y0 + i);
        }
    }
}

Testen der Funktion

//
// main.c
//

#include "led.h"
#include "screen.h"
#include "types.h"

int main (void)
{
   LED_off();
   Init_Screen();

   u32 x = 30;
   u32 y = 40;
   for (char c = 65; i < 100; i++)
   {
      DrawChar(c,x,y);
      y=y+10;
   }
   LED_Error(2);
}

Mit diesem Einfachen BEispiel erzeugen wir eine Reihe von Zeichen, die auf dem Bildschirm gezeichnet werden.