Creating a Layout Transition System

9

Index

Attached Files

The following files have been attached to this tutorial:

.c3p

transition-example.c3p

Download now 239.92 KB

Stats

12,472 visits, 25,912 views

Tools

Translations

This tutorial hasn't been translated.

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 1 Jul, 2019. Last updated 23 Jul, 2019

Bonus! Showing area names when a player enters

So, you can now switch between layouts, but wouldn’t it be handy to show your player what the name of the area they’re in is? It’s relatively easy to implement a basic example of this – when a new layout starts, a dialogue box is briefly shown with the new layout’s name.

To do this, you’ll need two objects – your dialogue box and some text. In this example, I’m using a 9-patch object for the box and a SpriteFont object for the text. You could probably swap these out for a sprite and the Text object, depending on what your game needs. I’ll also be putting these objects on a separate layer named “HUD”, with parallax set to 0% x 0%.

On the start of the new layout, we want to show the box and appropriate text in a certain area of the screen. In this case, I’ve set the box to spawn in the top left of the viewport using the following:

Condition:

System ▶︎ On start of layout

Action:

System ▶︎ Create object DialogBox_AreaName on layer “HUD” at (ViewportLeft(“HUD”), ViewportTop(“HUD”))

If you’re using the Viewport position expressions and you can’t see your dialogue box, try changing the origin point of the box, or add/subtract values depending on where you’ve set your box to spawn. You can always try previewing the project in the debugger to try and locate where your box is spawning!

The next action in this block sets the size of the dialogue box. You can set the size to whatever you need, I’ve just selected some arbitrary numbers which accommodate the text I need to show. So, the action you need is:

DialogBox_AreaName ▶︎ Set size to (250,40)

Next, we need to spawn the text itself. So, your next action looks like this:

System ▶︎ Create object SpriteFont on layer “HUD” at (ViewportLeft(“HUD”) +5, ViewportTop(“HUD”) +5)

I’ve used the +5 in that expression to make sure the text sits in the correct position within the dialogue box.

Then, of course, we need to set the text to show which area our player has entered. You could set different text to show per layout, each in a separate sub-event (as per the Demonoire example project), or you could just use LayoutName if your layouts are named appropriately – which is what I’ll be using. So, the action you need is:

SpriteFont ▶︎ Set text to LayoutName

And that’s it for the first block of events for this bit. If you preview now, you should have a box that spawns with some text in it. But you probably don’t want that displaying the whole time. So, let’s add one more sub-event with the following actions to fix that:

System ▶︎ Wait 2.0 seconds

DialogBox_AreaName ▶︎ Destroy

SpriteFont ▶︎ Destroy

Your final 'Area Names' group should look like this:

And there you go, now if you preview, when you change layout, your name box should appear and disappear again after a couple of seconds.

  • 0 Comments

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