TGB/Tutorials/Multiple Splash Screens

From TDN

Contents

Introduction

Tested on TGB 1.7.2

This tutorial shows you how to create a simple, splash screen generator. When you are done, you can display splash screens before your game loads. Once this code is in place you can also swap out splash screens, and change the number of splash screens without touching your code.

Note: This is important if you want to make it easy for game distribution sites to brand your game.

Let's get started!

Create Your Splash Screen GUI

First, we are going to create your splash screen GUI. I am going to show you how to do this without using the GUI editor.

Note: this gui is for a 800 x 600 resolution game. If you are using a different resolution, change the Extent value below.

  1. Navigate to [project name]\game\gui.
  2. Create a text file called splash.gui.
  3. Open splash.gui in a text editor, and paste in the following code:
    new GuiFadeinBitmapCtrl(splashGUI) {
       canSaveDynamicFields = "0";
       Profile = "GuiDefaultProfile";
       HorizSizing = "right";
       VertSizing = "bottom";
       position = "0 0";
       Extent = "800 600";
       MinExtent = "8 2";
       canSave = "1";
       Visible = "1";
       hovertime = "1000";
       bitmap = "";
       wrap = "0";
       fadeinTime = "1000";
       waitTime = "2000";
       fadeoutTime = "1000";
       done = "1";
    };
    
  4. Save splash.gui and close the file.

Create Your splash.ini

Next, we are going to create your splash.ini. This file tells the game how many splash screens to display.

  1. Navigate to [project name]\game\gameScripts.
  2. Create a folder called Settings.
  3. In the Settings folder, create a text file called splash.ini.
  4. Open splash.ini in a text editor, and enter 1 on the first line. (this adds one splash screen to the game)
  5. Save splash.ini and close the file.

Create Your Splash Screen Script

Now that your GUI is created, let's assign a script to it. This script will generate your splash screen, using the GUI that you created.

  1. Navigate to [project name]\game\gameScripts folder.
  2. Create a text file called splash.cs.
  3. Open splash.cs in a text editor, and paste in the following code:
    // Get number of splash screens from splash.ini
    function getSplashNumber()
    {    
       %nReturn = false;
       
        %file = new FileObject();    
        if (%file.openForRead("./Settings/splash.ini"))
        {    
          while ( !%file.isEOF() )
          {
               $splash = %file.readLine();
          }
         
          %file.close();
          %nReturn = true;
        }
        
        return %nReturn;
    }
    
    // Load splash screen
    function loadSplash()
    {
        // Load game
        if ($splash == 0)
        {
            resetCanvas();
            startGame($defaultScene);
        }
       
        // Display splash screen
        else 
        {
            splashGUI.bitmap = "~/data/splash/logo" @ $splash @ ".png";
            canvas.popDialog(splashGUI);
            canvas.pushDialog(splashGUI);
            schedule(100, 0, checkSplash);
            $splash--;
        }
    
    }
    
    // Check to see if splash screen should be loaded
    function checkSplash()
    {
       if (splashGUI.done)
          loadSplash();
        else
          schedule(100, 0, checkSplash);
    }
  4. Save splash.cs and close the file.

Upload Your Splash Screen Images

Now that you have created your splash screen generator, you need to add your splash screen images to your project.

  1. Navigate to [project name]\game\data.
  2. Create a folder called splash.
  3. Add your splash screen images to the splash folder. Images must use this format: logo1.png, logo2.png, etc.

Update main.cs

Now, to make your splash screens show up at the beginning of your game, you need to update your project's main.cs file.

Note: replace the value for $defaultScene with the scene that you want to open when the game loads.

  1. Navigate to [project name]\game.
  2. Open main.cs in a text editor.
  3. At the top of the initializeProject() function, add the following lines:
       $splash = 2;
       exec("~/gui/splash.gui");               
       exec("./gameScripts/splash.cs");  
    
  4. At the bottom of the initializeProject() function, comment out the following line and add the following line:
       //startGame(%level); 
       $defaultScene = "game/data/levels/Village.t2d";
       getSplashNumber();
       loadSplash();
    
  5. Change the value that is assigned to the $splash variable, if needed. The value should match the number of splash screen images in the splash folder.
  6. Save splash.gui and close the file.

Test Your Splash Screens

(TGB 1.1.3) To test your splash screens, you must comment out the following lines in main.cs:

   //if ($runWithEditors)
   //{
   //   toggleLevelEditor();
   //   return;
   //}