-

How To Create A Countdown Timer With Game Over Screen Unreal Engine 4

How To Create A Countdown Timer With Game Over Screen Unreal Engine 4. Here you will learn how to create and script a Countdown Timer with Game Over screen in Unreal Engine 4. We will work with three Blueprints: HUD, Game Instance and the Game Over Screen. If your character doesn't have a HUD, you need to create one, if you don't know how to create a HUD for your character, here is a link to do that How To Create A HUD Unreal Engine 4

First step, create a new Widget Blueprint, go to Content Browser > click RMB > under User Interface select Widget Blueprint > for example purposes, let's call it GameOverBP.

Now, open the GameOverBP, drag from Palette a Border into Hierarchy > Canvas Panel, go to Details panel, in the Slot section next to Anchors select the full page Anchor, next to Position X type 0 - next to Position Y type 0 - next to Size X 0 - next to Size Y 0, under Appearance > Brush > double click the Tint bar > in the Hex sRGB type 000000FF

Drag from Palette two buttons into Hierarchy > Canvas Panel, for each button drag from Palette a Text, select the first Text, go to the Details panel into the Content section next to Text, erase Text Block and write Play, select the second Text, go to the Details panel into the Content section next to Text, erase Text Block and write Menu.

Select the first button, go to Details panel, next to Position X type 800 - next to Position Y type 300 - next to Size X 300 - next to Size Y 100 - next to ZOrder 1, select the second button, go to Details panel, next to Position X type 800 - next to Position Y type 500 - next to Size X 300 - next to Size Y 100 - next to ZOrder 1.

Select both buttons, go to Details panel, under Appearance > Style > Normal > double click the Tint bar > in the Hex sRGB type 6B6B6BFF - do the same for Style > Hovered and Style > Pressed

Drag from Palette a Text into Hierarchy > Canvas Panel, go to Details panel, next to Position X type 700 - next to Position Y type 150 - next to Size X 500 - next to Size Y 200 - next to ZOrder 1, go to Content > Text > replace Text Block with Game Over, go to Appearance > Font > Size type 32, Appearance > Justification > select Align Text Center, Wrapping > check the Auto Wrap Text.

Select the first button, go to the Details panel, under Events section > click LMB on the green button next to On Clicked, you will be transferred in the Graph editor, were you will see your newly created event, from here go in the right corner up and select Designer, this way you will be switch back to the Blueprint Designer Mode, were you will need to select the second button and perform the same steps as for the first one.

Now, in the Graph editing mode, we need to create a new Function to remove the HUD when the Game Over Screen is shown. Go to My Blueprint panel > Functions > press the + Function > add a new function and call it Remove HUD. Now, let's start scripting the new function, add a Get Owning Player Pawn, drag of it Cast To (your character Blueprint), connect it with the Remove HUD function, drag of Cast To As pin a HUD reference, add a Remove from Parent node and connect it to Cast To node.

Back, in the Graph editing mode of the GameOverBP, add a Get Player Controller node, drag of it two times a Set Mouse Cursor (set it checked), connect the Set Mouse Cursor with the events for each button, in the string for the Menu button add a Remove HUD node and an OpenLevel node (set it to the level where you have your Menu on, if you do not have a Menu and you want to create one here is a link to do that How To Create A Menu (Main & Pause Menu) Unreal Engine 4), in the string for the Play button add a Remove HUD node and an OpenLevel node (set it to your game level name), then, add a Remove from Parent node and a Set Game Paused (unchecked) at the end of the string of each button, Compile and Save, then close the Widget Blueprint.

Next, open or create a new Game Mode Base (Game Instance Blueprint), create two new Integer variables, one of them name it Seconds and the other Minutes, for the Seconds variable set the Default value to 0, for the Minutes variable set the Default value to 5. Important! The Game Mode Base needs to be set in the World Settings of the level for the countdown timer to work, open the level were the gameplay will take place, in the Toolbar panel select Settings > World Settings, then go in the World Settings panel next to Details panel, in the Game Mode section > Game Mode Override > select your Game Mode Base (Game Instance Blueprint).

In the Editor Graph, add a Event Tick node, drag of the Event Tick node a Delay node set it to 1, add a Set Seconds node, connect the Delay node with the Set Seconds node, add a Get Seconds node connect it to a Integer - Integer node set to 1, connect the string with the Set Seconds node, next, add a Branch node, add a Get Seconds node connect it to a Integer < Integer node set to 0, connect the string with the Condition pin of the Branch node, add a Set Minutes node, connect the True pin of the Branch node with the Set Minutes node, add a Get Minutes node connect it to a Integer - Integer node set to 1, connect the string with the Set Minutes node, add to the string a Set Seconds node (set to 59) of it drag and add a new Branch node, connect the False pin of the old Branch node with the new Branch node, add a Get Minutes node connect it to a Integer <= Integer node set to -1, connect the string with the Condition pin of the new Branch node, drag of the True pin of the new Branch node and add a Create Widget node set it to GameOverBP, the Return Value promote it to a new variable call it GameOverVar and add it to the string, add a Get Player Controller node, of it drag a Set Mouse Cursor set it checked, connect it to the string, next, add a Set Input Mode UI Only, connect the Get Player Controller node with the Player Controller pin of the Set Input Mode UI Only, add a Get GameOverVar variable node and connect it with the In Widget to Focus pin of the Set Input Mode UI Only, then from the Get GameOverVar variable node drag and add a Add to Viewport node, connect it to Set Input Mode UI Only, at the end of the string add a Set Game Paused node (set it checked), Compile and Save, then close the Blueprint. Open the HUD Widget Blueprint, drag from Palette a Progress Bar and three Text widgets, into Hierarchy > Canvas Panel, select the Progress Bar go to Details panel, next to Position X type 740 - next to Position Y type 100 - next to Size X 440 - next to Size Y 50, under Style > Background Image > double click the Tint bar > in the Hex sRGB type 00CBFF7F, under Style > Fill Image > double click the Tint bar > in the Hex sRGB type 002D947F, under Appearance > Fill Color and Opacity > double click the Tint bar > in the Hex sRGB type 00CBFF7F.

Select a Text widget, call it Minutes, go to Details panel, next to Position X type 840 - next to Position Y type 105 - next to Size X 160 - next to Size Y 50 - next to ZOrder 1, under Content > Text > replace Text Block with 00, under Appearance > Justification > select Align Text Center.

Select the next Text widget, call it Seconds, go to Details panel, next to Position X type 920 - next to Position Y type 105 - next to Size X 160 - next to Size Y 50 - next to ZOrder 1, under Content > Text > replace Text Block with 00, under Appearance > Justification > select Align Text Center.

Select the last Text widget, call it Dots, go to Details panel, next to Position X type 940 - next to Position Y type 105 - next to Size X 40 - next to Size Y 50 - next to ZOrder 1, under Content > Text > replace Text Block with :, under Appearance > Justification > select Align Text Center.

Next, we will start scripting the HUD, select the Progress Bar, in the Details panel go to Progress > Percent > Bind > select Create Binding, add a Cast To node (set it to the Game Instance) connect the Object pin with a Get Game Mode node, add a Float / Float node set it to 60, drag of the Cast To As pin and add a Get Seconds variable node and connect it to the Float / Float node, drag the end pin of the Float / Float node and connect it with the Return Value of the Function Return Node.

Go back into Design Tab select the Minutes Text Widget, in the Details panel go to Content > Text > Bind > select Create Binding, add a Cast To node (set it to the Game Instance) connect the Object pin with a Get Game Mode node, drag of the Cast To As pin and add a Get Minutes variable node and connect it to a ToText (integer) node, connect the Return Value of the ToText (integer) node with the Return Value of the Function Return Node.

Go back into Design Tab select the Seconds Text Widget, in the Details panel go to Content > Text > Bind > select Create Binding, add a Cast To node (set it to the Game Instance) connect the Object pin with a Get Game Mode node, drag of the Cast To As pin and add a Get Seconds variable node and connect it to a ToText (integer) node, connect the Return Value of the ToText (integer) node with the Return Value of the Function Return Node.

Congratulations! You have created A Countdown Timer With Game Over Screen in Unreal Engine 4 - if you have questions or you need additional help, contact me by posting a comment in the comment section below or through the contact page.

Interesting articles to read on Edvog.com
Unreal Engine 4 Beginner's Guide
Unreal Engine 4 Tutorials & How To's (With Pictures & Video)
Blender 3D Beginner's Guide
GIMP Beginner's Guide

About Edvog.com - Courses, How To's, Tutorials, Articles & Resources - Games, Music, Videos, Education, Information, Health, Medicine & Research

My name is Andrei Ionita, I am the creator and owner of edvog.com website, I am also the creator and owner of all of the products associated with it, such as: games, music, videos and more... I like to write articles about everything I find interesting in this world, most of the time I write educational articles, but you may also find articles without a main topic. The entire content found on this website is fact checked and original, when I post something, I try to double check all the information provided against all the reliable and trustworthy sources that I can find. On this website you may find content about medicine, the purpose of this type of content is simply informational and is not intended to be a substitute for professional medical advice, for questions you may have regarding your health, always seek the guidance of your doctor or other qualified health professional.

About entertainment and media - Beside, being a website owner and content writer, I'm also a game developer, music producer and video creator. I create, video games, music, animations, photos and more, this is why, from time to time, I will also post content about entertainment and media industry (a broad terminology, just to cover everything in the category). If you like platformer or runner games, you can check out the games made by me on Steam and on Google Play. If you like Relaxing, Ambient, Chill-out, Lounge, Electronic or Trap music you can check out my Youtube channel, Spotify profile, iTunes profile, Google Play Music profile, etc. Who knows? Maybe your next favorite game or song will be created by me :) If you want to support my work, you can play the games created by me, listen to my music and/or Make A PayPal Donation, whatever form of support you will choose, I thank you and wish you a nice day!

Edvog.com / Andrei Ionita on the internet

YoutubeGoogle PlaySteamAI Edvog on SpotifyAI Edvog on Google Play MusicAI Edvog on iTunesAI Edvog on SoundCloudSupport My Work Make A PayPal Donation

Comments