Blog Archives

[Tutorial] Change Loading Screens based on map (Using Canvas and no bik movie)


Hey everyone ,

In this tutorial i will show you how to have your own loading screen based on the map you are loading. For example you are loading MAP_1 so the loading screen will show random pictures of MAP_1. Remember, this tutorial will only use Canvas and will not use any bik movies. In fact, you will have to remove the loading bik movies from the ini in-order for this to work. I used this setup in my own game Engage and its working good. 

1: Start UDK and load your level.
2: Take a nice screenshot ( I use printscreen and paste it on Photoshop). TIP: Press F11 for fullscreen
3: Open Photoshop (i used 2048 x 1024) or any other image editing software and make all the customization’s you want (Color correction, blur, DOF, flares, anything)
4: Save the image and import it in UDK and save the package. Take any number of screenshots you want since we will be randomly choosing the textures.
5: Start your UnrealScript IDE and use the below code:

//  ================================================================================================
//   * File Name:    MyCustomViewportClient
//   * Created By:   Satheesh PV (aka RyanJon2040)
//   * Time Stamp:     05-Dec-13 8:50:00 PM
//   * UDK Path:   G:\UDK\UDK-2013-07
//   * Unreal X-Editor v3.1.5.0
//   * © Copyright 2012 - 2013. All Rights Reserved.
//  ================================================================================================

/*
    The reason why i extended from UTGameViewport is because otherwise Hintmessages wont be displayed.
*/

class MyCustomViewportClient extends UTGameViewportClient;

var Font TransitionFont;
var Font HintFont;
var Texture2D Background;
var LinearColor BackgroundColor;
var array MAP1_BackgroundTextures;
var array MAP2_BackgroundTextures;
var array MAP3_BackgroundTextures;

function DrawTransition(Canvas Canvas)
{
    local string MapName;
    local int Pos;

    switch(Outer.TransitionType)
    {
        case TT_Loading:
            MapName = Outer.TransitionDescription;

            /* Remove .udk from map */
            Pos = InStr(MapName,".");
            if (Pos != -1)
            {
                MapName = left(MapName, Pos);
            }

            /* Get Random Texture */
            Background = GetTextureForMap(MapName);
            DrawImageTransitionMessage(Canvas,MapName);
            break;
        case TT_Saving:
            DrawTransitionMessage(Canvas,SavingMessage);
            break;
        case TT_Connecting:
            DrawTransitionMessage(Canvas,ConnectingMessage);
            break;
        case TT_Precaching:
            DrawTransitionMessage(Canvas,PrecachingMessage);
            break;
        case TT_Paused:
            DrawTransitionMessage(Canvas,PausedMessage);
            break;
    }
}

//Absolutely no need for final modifier. I added it just for fun only. :P
final function DrawImageTransitionMessage(Canvas Canvas,string Message)
{
    local float XL, YL;
    local string DisplayMessage;
    local string HintMessage;
    local class GameClass;
    local string GameClassName;

    /* Capitalize the string */
    DisplayMessage = Caps("LOADING: " $Message$"...");

    /* Assign font to be used with LOADING:  */
    Canvas.Font = TransitionFont;
    Canvas.bCenter = false;

    /* Draw the texture on screen */
    Canvas.SetPos(0,0);
    Canvas.DrawTile(Background, Canvas.ClipX, Canvas.ClipY, 0, 0, Background.SizeX, Background.SizeY, BackgroundColor);

    /* Get the displamessage length and save it to XL and YL */
    Canvas.StrLen( DisplayMessage, XL, YL );

    /* [TEXT SHADOW] Set the position to slightly above bottom right corner of the screen */
    Canvas.SetPos((Canvas.ClipX - XL) - 10, (Canvas.ClipY - YL) - 10);

    /* [TEXT SHADOW] Set the color to black */
    Canvas.SetDrawColor(1,1,1);

    /* [TEXT SHADOW] Draw the shadow Text */
    Canvas.DrawText( DisplayMessage, false );

    /* [TEXT] Set the position to slightly above bottom right corner of the screen */
    Canvas.SetPos((Canvas.ClipX - XL) - 12, (Canvas.ClipY - YL) - 12);

    /* [TEXT] Randomize the colors */
    Canvas.SetDrawColor(Rand(255),Rand(255),Rand(255));

    /* [TEXT] Finally draw the LOADING:
 text */
    Canvas.DrawText( DisplayMessage, false );

    /* No need to draw hints for Main menu */
    if (Message != "MainMenu")
    {
        /* Find the game class: Eg: returns UTDeathmatch_0 */
        GameClass = class(FindObject(Outer.TransitionGameType, class'Class'));

        /* Cast teh game class name to string */
        GameClassName = string( GameClass.Name );

        /* Get random hint message from Game Class */
        HintMessage = LoadRandomLocalizedHintMessage( string( class'UTDeathmatch'.Name ), GameClassName);

        /* Hint message exists so... */
        if( Len( HintMessage ) > 0 )
        {
            /* Assign font to be used with HINTMESSAGE */
            Canvas.Font = HintFont;

            /* Get the HintMessage length and save it to XL and YL */
            Canvas.StrLen( HintMessage, XL, YL );

            /* We want the Hint message to be centered. So center the text */
            Canvas.SetPos((Canvas.ClipX - XL) / 2, Canvas.ClipY / 2);

            /* Again randomize the colors */
            Canvas.SetDrawColor(Rand(255),Rand(255),Rand(255));

            /* [TEXT] Finally draw the Hintmessage text */
            Canvas.DrawText( HintMessage, false );
        }
    }
}

final protected function Texture2D GetTextureForMap(string mapName)
{
    switch(mapName)
    {
        case "Map1":
            return MAP1_BackgroundTextures[Rand(MAP1_BackgroundTextures.length)];
        break;
        case "Map2":
            return MAP2_BackgroundTextures[Rand(MAP2_BackgroundTextures.length)];
        break;
        case "Map3":
            return MAP3_BackgroundTextures[Rand(MAP3_BackgroundTextures.length)];
        break;
        default:
            return //any default texture here;
        break;
    }
}

DefaultProperties
{
    HintFont=Font'YourPackage.YourHintFont'
    TransitionFont=Font'YourPackage.YourTransitionFont'
    BackgroundColor=(R=1.0,G=1.0,B=1.0,A=1.0)

    MAP1_BackgroundTextures[0]=Texture2D'YourPackage.YourGroup.YourMap1Texture'
    MAP1_BackgroundTextures[1]=Texture2D'YourPackage.YourGroup.YourMap1Texture'
    MAP1_BackgroundTextures[2]=Texture2D'YourPackage.YourGroup.YourMap1Texture'

    MAP2_BackgroundTextures[0]=Texture2D'YourPackage.YourGroup.YourMap2Texture'
    MAP2_BackgroundTextures[1]=Texture2D'YourPackage.YourGroup.YourMap2Texture'
    MAP2_BackgroundTextures[2]=Texture2D'YourPackage.YourGroup.YourMap2Texture'

    MAP3_BackgroundTextures[0]=Texture2D'YourPackage.YourGroup.YourMap3Texture'
    MAP3_BackgroundTextures[1]=Texture2D'YourPackage.YourGroup.YourMap3Texture'
    MAP3_BackgroundTextures[2]=Texture2D'YourPackage.YourGroup.YourMap3Texture'
}

6: Save it to UTGame folder
7: DONT COMPILE NOW!
8: Open DefaultEngine.ini and under section [Engine.Engine] change GameViewportClientClassName to GameViewportClientClassName=UTGame.MyCustomViewpor tClient.
9: Open DefaultEngineUDK.ini and under section [FullScreenMovie] remove all LoadingMovies entries.
10: Delete UDKEngine.ini
11: Do i really have to say that you need to re-compile the scripts and enjoy your loading screens. 

Exercise for you:

  1. Canvas supports a variety of Draw* functions. Use them to create advanced loading screens
  2. I havent checked if Canvas can draw materials. If they can then draw animated materials.(*hint* *hint* bik movies)

I hope you find this useful. 😀

Advertisements

v2.2 Beta Available


New version of Unreal X-Editor is now available. Click on “Check For Updates” to download.

Changelog:

–Added INI Explorer
–Added INI Editor
–Dock layout will be automatically saved upon exit
–User can decide if Dock layout should be restored upon startup
–Package Viewer Tree title will now show “Unreal Script files”
–Again fixed a rare issue where Unreal X-Editor runs in backgound after exiting
–Fixed undo on opened files
–Admin requirements has been removed
–Backup “Src” Folder button added (Settings Dialog)
–Added Loading Screen Tips modifier (UDK Customizer)
–Fixed a rare error msg showing when trying to run UDK Customizer in No-Ribbon UI
–Simplified Chinese, Traditional Chinese and Japanese languages are supported

Chinese and Japanese Language

Loading Tips Modifier


Here is the new Loading Tips Modifier which will be available from v2.2 of Unreal X-Editor. It will be available in UDK Customizer.

Click for larger image

%d bloggers like this: