|
Hintergrund-Scrolling |
|
In den
anderen Tutorials wurde bereits erklärt wie man
DirectDraw initialisiert, Bitmaps
anzeigt und Animationen ermöglicht.
Was aber noch fehlt ist Bewegung wie z.B. ein
scrollender Hintergrund. Es gibt verschiedene Scroll-Möglichkeiten.
Diese Abschnitt beschäftigt sich mit einem einfachen
links/rechts scrollenden Hintergrund mit einem Start-
und Endpunkt (also kein Endlos-scrollen).
|
Das
Hintergrundbild
ist meist deutlich breiter als der Bildschirm selbst,
deshalb wird das Bild in kleinere Bilder, in sogenannte
Kacheln (Tiles), unterteilt. In diesem Beispiel wurde
das Gesamtbild in 3 kleinere Bilder aufgeteilt.
|
|
Zu
beachten ist hierbei, dass die Ränder des Gesamtbildes
ebenfalls zusammenpassen, damit das Scrollen nahtlos
weitergehen kann.
|
Darstellen eines scrollenden Hintergrundes |
Was
nun noch bleibt, ist die Darstellung der Szene.
Der Hintergrund dieser Szene ist gekachelt,
was bedeutet, dass Bilder Seite an Seite zur Darstellung
eines einzigen zusammenhängenden Bildes angezeigt
werden. Drei Hintergrundbilder, jedes 400 Pixel breit,
bilden einen kompletten Hintergrund von 1200 Pixeln
Breite.
|
Die
Bilder werden Seite an Seite angeordnet, wobei das
erste an einer X-Koordinate von 0 beginnt, das nächste
bei 400 und das letzte bei 800. Dieses Muster wiederholt
sich in beiden Richtungen, sodass kontinuierlich in
jeder Richtung gescrollt werden kann.
|
Hierbei
sind zwei Dinge zu beachten:
die Bilder müssen
scrollen (zur Seite schieben) und dann muss bestimmt
werden, welche Bereiche der Bilder sichtbar sind,
um sie für den Bildschirm zu clippen.
|
Clippen
ist
der Vorgang, vor der Darstellung die Bereiche
eines Bildes zu entfernen, die die Grenzen des Bildschirmes
überschreiten (siehe dazu Bitmaps zu-
und ausschneiden, Animation).
|
Das Bild selbst
wird hierbei nicht geändert, nur die
Koordinaten der Quell- und Zielrechtecke werden angepasst,
damit die nur die Teile des Bildes umfassen, die auf
den Bildschirm passen.
|
Für
das Scrolling
wird die X-Koordinate der Bilder um
den Wert der in tile_pos (siehe Beispiel-Code) berechnet
wurde korrigiert. Dies bewirkt, dass die Bilder sich
relativ zum Bildschirm seitlich bewegen, was den Eindruck
erweckt, dass sich der Betrachter zur Seite bewegt.
|
|
Als
Beispiel zeigt die nebenstehende Abbildung den Effekt,
wenn x_pos auf 500 gesetzt wird.
|
Jedes
der Bilder verschiebt sich nach links, wodurch sich das
erste Bild aus dem Bildschirm heraus bewegt und Teile
des dritten Bildes sichtbar werden.
|
|
 |
'Hintergrund zeichnen
'schleife über die Kacheln
For i = 0 To 2
'Position der sichtbaren Kacheln berechnen
tile_pos = 400 * i + (x_pos \ 1200) * 1200
If (tile_pos + 1200) < (x_pos + 640) Then
tile_pos = tile_pos + 1200
end if
'ist das Objekt im Bild ?
If (tile_pos + 400) >= x_pos Then
'ja, Abstand zur linken Ecke des Bildschirm berechnen
screen_x = tile_pos - x_pos
'Objekt clippen wenn notwendig
With srcrect
.Left = 0: .Top = 0
.Right = 400: .Bottom = 480
End With
'Test auf Clipping
If screen_x < 0 Then
srcrect.Left = srcrect.Left - screen_x
screen_x = 0
Else
If (screen_x + srcrect.Right) > 640 Then
srcrect.Right = 640 - screen_x
End If
End If
'Objekt auf Bildschirm zeichnen
BackBuffer.BltFast screen_x, 0, _
bmpBackground(i), srcrect, DDBLTFAST_WAIT
End If
Next i
|
 |
|
Ein Beispiel für Hintergrund-Scrolling können Sie
hier downloaden, und den
ausführlichen Tipp finden Sie in unserer Tipp-Rubrik.
|
|
|
Download
tip0175.zip
(581 kB) |
 |
Downloads
bisher: [ 6
] |
|
|