BlitzBasic-Community-Tutorial/ Graphik

Die ersten Schritte

Um die ganzen Grafikfunktionen verwenden zu können, muss man zuerst in den Grafikmodus schalten. Dies wird uns mit BB ziemlich leicht gemacht, denn man muss nicht, wie in anderen Sprachen üblich, eine Halbseite Quellcode für dieses Thema opfern. Eigentlich steckt alles in einer Zeile:

Graphics Breite,Höhe,Farbtiefe,Fenstermodus

Das wäre es schon. In den ersten zwei Spalten trägt man die Auflösung ein. Gängige Werte sind 640/480, 800/600, 1024/768 oder 1280/1024. Allerdings sind je nach Bildschirm auch andere Kombinationen denkbar. Die Farbtiefe kann 16, 24 oder 32 Bit betragen. Der letzte Parameter gibt an, ob es ein Fenster oder Vollbild sein soll (1=Vollbild, 2=Fenster). 0 bedeutet an jeder Position, dass die Windows-Grundeinstellungen benutzt werden.

Im 3D-Bereich gelten die selben Parameter, nur der Befehl ändert sich:

Graphics3D Breite,Höhe,Farbtiefe,Fenstermodus (z.B Graphics3D 800,600,32,1) (1=Vollbild)

Aber davon erst später.

Das Geheimnis der Buffer

Den Backbuffer kann man sich als rückwärtigen Teil des Bildschirms vorstellen; stimmt zwar nicht, aber so kann man die Funktionsweise am Besten verstehen. In Wirklichkeit werden die Daten im Backbuffer von der Grafikkarte berechnet, aber erst später ausgegeben. BB arbeitet standardmäßig mit dem Frontbuffer. Möchte man den Backbuffer verwenden, muss man dies BB mitteilen. Diese Technik ist bei Spielen mit vielen Elementen zwingend nötig, da sonst der Bildaufbau ewig dauert und man nichts sieht (nur sehr sporadisch). Es verhindert also das Flackern.

Setbuffer Backbuffer()
;Hier kommt dann der Mainloop etc...

Jetzt wird alles in den Backbuffer gezeichnet. Diese Technik ist unter dem Namen "double buffering" bekannt.

Setbuffer Backbuffer()
; Mainloop Beginn(wird später erklärt)
Flip
; Mainloop Ende

Das Flip bringt BB dazu die Objekte aus dem Backbuffer auf dem Frontbuffer darzustellen (nicht vergessen, sonst bleibt der Bildschirm schwarz!). Manchmal ist es auch nötig Flip an mehreren Positionen zu setzen.

Anmerkung: Mit BlitzPlus wurde das Doublebuffering standardisiert. Das heißt, dass man nicht mehr "Setbuffer Backbuffer()" einsetzen muss. Flip muss allerdings weiterhin eingesetzt werden!!!

Einzelne Pixel

Durch einen Befehl names Plot kann man einzelne Pixel anzeigen lassen.

Plot X,Y

Mit Plot und anderen Befehlen, lassen sich auch andere schöne Sachen basteln:

Graphics 800,600,16,2
SetBuffer BackBuffer()
SeedRnd MilliSecs()

For zaehler = 1 To 1000
x = Rnd(1,640)
y = Rnd(1,480)
Plot x,y
Next

Flip
WaitKey()
End

Allerdings ist es sehr mühsam bestimmte Formen wie Rechtecke etc. mit einzelnen Plots zu zeichnen. Eine Alternative gibt es mit Rect, Oval und Line...

Rechtecke und Kreise

Man kann einfache Sprites wie Rechtecke, Kreise oder Linien per BB-Befehl zeichnen lassen.

Rect PositionX,PositionY,Breite,Höhe,Füllung
Oval PositionX,PositionY,Breite,Höhe,Füllung

Dies ist sehr einfach zu verstehen. Der Befehl "Rect" zeichnet ein Rechteck oder Quadrat und der Befehl Oval ein Kreis oder eine Elipse. Die ersten 2 Parameter geben immer die Position auf dem Bildschirm in Pixeln an (Achtung! Bei Änderung der Auflösung muss man manchmal korrigieren). Parameter 3 und 4 gibt die Breite und die Höhe des Kreises oder des Rechteckes an (natürlich auch in Pixeln). Der letzte Parameter kann nur 1 oder 0 sein (wahlweise kann in solchen Situationen die 1 durch true und 0 durch false substituiert werden). 1 heißt, dass das Innere ausgefüllt wird, 0 das nur die Umrisse gezeichnet werden. Mit Color vor dem Zeichenbefehl lässt sich die Farbe festlegen.

Color R(Rot),G(Grün),B(Blau) ;immer ein Wert von 0-255 angeben 

Linien kann man etwas anders zeichnen!

Line X1,Y1,X2,Y2

X1 gibt die horizontale Startpostion in Pixeln an, Y1 die vertikale Startposition in Pixeln. Die beiden anderen Werte sind die Endwerte.

Beispiel:

Graphics 800,600,0,1
Line 150,80,350,80
waitkey() 
End

Bilder

Bilder werden aus externen Quellen geladen, danach kann man sie mit entsprechenden Befehlen behandeln.

Bild = LoadImage("Pfad")

Durch diese Programmzeile wird ein Bild in den Hauptspeicher geladen, die Speicheradresse ist in der Variablen "Bild" gespeichert, diese benötigen wir zur Weiterverwendung dieses Sprites.

DrawImage Bild,300,250

Dies sagt BlitzBasic, dass das Bild an den Koordinaten x = 300 und y = 250 Pixel gezeichnet werden soll. Ein Sprite ist immer ein Viereck,schwarze Flächen werden nicht dargestellt, sie sind Transparent.

DrawBlock Bild,300,250

Hier wird der schwarze Hintergrund mit gezeichnet.

Graphics 1024,768,0,1
Setbuffer Backbuffer()
y = 250
x = 300
Bild = LoadImage("Irgend ein direkter oder relativer Pfad")

Repeat
Cls 
  DrawImage Bild,x,y
  If Keydown(203) then x=x-1
  if Keydown(205) then x=x+1
Flip
Until Keydown(1)
End

Wenn man jetzt die linke Pfeiltaste betätigt bewegt sich das Bild nach Links,wenn man die Rechte Pfeiltaste drückt,analog dazu nach Rechts.So werden dann auch die Spielfiguren in Spielen gesteuert.

Zur Ergänzung, um die Figur sich noch auf der Y-Achse bewegen zu lassen fügt diesen Befehl ein.

 If KeyDown(208) Then y=y+1
 If KeyDown(200) Then y=y-1

Relativer Pfad:

Bild = LoadImage("Irgend ein Bild.png")

Direkter Pfad:

Bild = LoadImage("Laufwerkskennung(z.B C:\):\irgend ein Bild.png")

Bei einem relativen Pfad muss die bezeichnete Datei nur in der Nähe der .exe Datei sein.Beim direkten Pfad muss sich die Datei zwingend im angebenen Ordner und Laufwerk befinden.

Beweglicher Hintergrund

- by andieo, verbessert durch Kurzer -

Zuerst brauchen wir ein Bild, zum Beispiel:

hintergrund = LoadImage("C:\bild.bmp")

und dann die Bewegung:

If KeyDown(203) Then img_x = img_x + 2

und

If KeyDown(205) Then img_x = img_x - 2

Jetzt müssen wir das Bild noch zeichnen:

DrawImage hintergrund, imgx, 0

Das alles packen wir einfach in eine Hauptschleife. Der vollständige, funktionierende Code sieht dann so aus:

Graphics (1024,768,8,0)

hintergrund = LoadImage("C:\bild.bmp")

While i = 0 ;Hauptschleife
 Cls ;Bild wird vorher "geleert"

 If KeyDown(45) Then i = 1
 If KeyDown(203) Then img_x = img_x - 2 ;Nach links
 If KeyDown(205) Then img_x = img_x + 2 ;Nach rechts

 SetBuffer BackBuffer()
 DrawImage hintergrund, img_x, 0
 Flip
Wend 

Das war's auch schon... hätte man sich doch eigentlich fast schon denken können, oder?