Parallaxeneffekt with 4 Ebenen für "Construct 2 Free edition"

0

Index

Tagged

Attached Files

The following files have been attached to this tutorial:

.png

event-group-dialog.png

Download now 28.72 KB
.png

event-variable-dialog.png

Download now 39.22 KB
.rar
.rar

parallax-effect.rar

Download now 998.41 KB

Contributors

Stats

8,868 visits, 11,547 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 28 Mar, 2017. Last updated 25 Feb, 2019

Parallax Parameter

In Construct 2 sieht man links die Eigenschaften-palette oder -fenster Properties des jeweiligen aktuell angewählten Objekts oder Ebene. Wir ändern hier jeweils den Parallaxeneffekt-Parameter der einzelnen Ebenen! Folgende Parameter sollten nun entsprechend eingestellt werden:

BG1-----0,0

BG2-----15,15

BG3-----100,100

Um einen coolen Effekt hinzubekommen, sollte man bei der Gestaltung eigener Bilder die Hintergrundfarbe auf keine Farbe oder transparent setzen und diese z.B. als png-Dateien abspeichern.

Im Eigenschaftenfenster Properties sollte man "Transparent parameter" auf YES für die Ebenen 1 und 2 einstellen.

Ansonsten wird man nie die anderen Bilder der Ebenen sehen können.

Spielt mit den Werten des Parallaxeneffekt. Man kann sich den Effekt sogar im Editor anschauen: Geht im Ebenen-Eigenschaftenfenster auf Editor Properties, sucht nach dem Parameter Parallax in editor und wählt YES aus für die 3 Hintergrundebenen.

Dann scrollt man die horizontale Leiste hin und her und man sieht folgendes:

Bewegt man die horizontale Leiste, bewegen sich die Hintergrundebenen in unterschiedlichen Geschwindigkeiten. Um den vollen Effekt genießen zu können, müssen die Hintergrundbilder auf 600 Pixel Breite eingestellt werden. Da diese als gekacheltes Hintergrundbilder Tiled Background, werden diese entsprechend mehrfach wiederholt.

Anmerkung: Wenn man versucht, Bilder, die 1024 Pixel Breite überragen, in Construct 2 zu laden, wird ein Hinweisfenster auf mögliche Performanceeinbussen im Webbrowser hinweisen.

  • 0 Comments

Want to leave a comment? Login or Register an account!