Moongate Games UK

"Changing worlds, one line of code at a time"

Tutorial: Making split-screen views in Unity.

Subject: Camera Views

Language: C# (Unity3D)

 This is something that I've been meaning to look into for a while, especially when I released my first game Escape From Infinity but I was always afraid of how complex it could potentially be. That was until I decided to bite the bullet and finally get around to making one myself.

So for those having the same reservations about implementing a basic split-screen view in Unity, it's very (and I really mean very) easy to make.

For this, we'll be starting with an empty unity project, so to start with we'll need two new tags one being "PlayerOne" and the other being "PlayerTwo".

Next, we'll make two game objects, make sure they are separate from each other and tag one "PlayerOne" and the other with "PlayerTwo".

The reason for tagging them will become apparent soon enough.

After we have the two game objects, we'll need to add another camera to the scene. It might be worth renaming the cameras to something like "P1Camera" and "P2Camera" so you can differentiate between them.

Also, make sure you remove one of the audio listeners just as a side note.

Once that's all done you should have a scene similar to the following:

Next, we'll start setting up the script, so we'll need to create a new C# script called CameraManager (you can call it what you want really.) put in the following:

using System.Collections;
using UnityEngine;

public class CameraManager: MonoBehaviour {

    //Cameras
    public Camera PlayerOneCamera;
    public Camera PlayerTwoCamera;

    //Different checks.
    public bool IsSinglePlayer = true;
    public bool IsPortrait = true;

    //Viewport Sizes - Single Player
    private Rect _spRect = new Rect (0.0f, 0.0f, 1.0f, 1.0f);

    //Viewport Sizes - Multi-player (Portrait)
    private Rect _mpOnePort = new Rect (0.0f, 0.0f, 0.5f, 1.0f);
    private Rect _mpTwoPort = new Rect (0.5f, 0.0f, 0.5f, 1.0f);

    //Viewport Sizes - Multi-player (Landscape)
    private Rect _mpOneLand = new Rect (0.0f, 0.5f, 1.0f, 0.5f);
    private Rect _mpTwoLand = new Rect (0.0f, 0.0f, 1.0f, 0.5f);

    void Start(){

    }

    void Update(){

    }
}

Now before we go any further it would be a good idea to switch back to Unity itself and adjust the cameras so they're directly behind their respective objects. After you've done that we'll need to make an empty game object called Manager and place the CameraManager script on to it.

We'll also need to make a reference to the cameras in the CameraManager script by dragging each camera into the respective slot.

Next, we'll need to go back to the CameraManager class code and add the following method:

void CameraSetup(){
    if(!IsSinglePlayer){
        PlayerTwoCamera.gameObject.SetActive(true);
        if(IsPortrait){
            PlayerOneCamera.rect = _mpOnePort;
            PlayerTwoCamera.rect = _mpTwoPort;
        }
        else{
            PlayerOneCamera.rect = _mpOneLand;
            PlayerTwoCamera.rect = _mpTwoLand;
        }
    }
    else{
        PlayerTwoCamera.gameObject.SetActive(false);
        PlayerOneCamera.rect = _spRect;
    }
}

Then call it from the start method like so:

void Start(){
    CameraSetup();
}

Now, if you go back into Unity and run it should look like normal, like so:

This is the single player view.

If you uncheck 'Is Single Player' in the inspector you should get something like the following:

This is the portrait multiplayer view.

This is the portrait multiplayer view.

And there is your multiplayer view, in portrait which a fair few games are suited to. But if you wanted to you could have a landscape view as well. 

So, if we uncheck 'Is Portrait' in the inspector and run again you'll get the following:

This is the landscape multiplayer view.

And there you have it, A basic split-screen view in under 50 lines of code.

This code can also be expanded on pretty easily so you could have a 4 player split screen or maybe even more if you want to do something different.

I hope you enjoyed this tutorial and learned something from it, I look forward to seeing where you all go with this.