Crosshairs and Camera zoom in Unity

Sharing is caring:

Add a Crosshair and Zoom to a Camera

In this Unity tutorial we will be going over how to create a simple crosshair (a dot in this tutorial) to replace our cursor arrow. Then we’ll show you how to use a script that will be applied to our camera to zoom in using the “Field of View” (FOV) settings in our camera when we press the “z” key.

We’ll start off by adjusting the field of view for our camera using our script. This script will have a simple boolean type of toggle that will check to see if we’re zoomed in. If we are then it will zoom out and vice versa. We can adjust the amount of zoom to use this script on a variety of “scopes” or binoculars. We’ll use the “z” key to toggle this zooming feature.

We’ll finish off this video by changing our cursor using a custom crosshair. For this video we used a dot similar to the “crosshair” in Max Payne. We’ll use a small 2d texture and use the GUITexture component for this. This will show a custom cursor but we’ll also need to make sure our arrow cursor disappears when we click into our game so that only our crosshair is visible. The scripts are below.

 

Javascript Files

crosshair.js (apply this to your camera)


var crosshairTex : Texture2D; //crosshair images go here

var position : Rect; //position of the crosshair image

static var OriginalOn = true;

function Update(){

position = Rect((Screen.width - crosshairTex.width) / 2, (Screen.height - crosshairTex.height) /2, crosshairTex.width, crosshairTex.height); //determines width/height of our crosshair GUI texture

}

function OnGUI()

{

if(OriginalOn == true)

{

GUI.DrawTexture(position, crosshairTex); //"draws" crosshair texture

Screen.showCursor = false; //disables cursor from being visible

}

}

 

Zoom.js (apply this to your camera)


var zoom : int = 20; //determines amount of zoom capable. Larger number means further zoomed in

var normal : int = 60; //determines the default view of the camera when not zoomed in

var smooth : float = 5; //smooth determines speed of transition between zoomed in and default state

private var zoomedIn = false; //boolean that determines whether we are in zoomed in state or not

function Update () {

if(Input.GetKeyDown("z")){        //This function toggles zoom capabilities with the Z key. If it's zoomed in, it will zoom out

zoomedIn = !zoomedIn;

}

if(zoomedIn == true){    //If "zoomedIn" is true, then it will not zoom in, but if it's false (not zoomed in) then it will zoom in.

camera.fieldOfView = Mathf.Lerp(camera.fieldOfView,zoom,Time.deltaTime*smooth);

}

else{

camera.fieldOfView = Mathf.Lerp(camera.fieldOfView,normal,Time.deltaTime*smooth);

}

}

 

Jonathan Gonzalez

I love all things in game development and want to contribute by teaching others how to create games. I'm always looking to help others create awesome digital worlds. I've been a hardcore gamer since I was a kid and now it's my turn to create awesome digital experiences.

More Posts - Website

Follow Me:
TwitterYouTube

Comments

  1. Hassam Amir says:

    can you make a video showing how to create aim down sights

    thanks

    • I’m not sure when I’d get around to creating a tutorial like this but you can easily do this with a simple animation. Just have an animation that goes from your idle state to a “sights” state. Then for the parameter you’d use a boolean to determine if you’re in the “sight state” or the “idle state”.

  2. Hassam Amir says:

    Oh yes and for your weapon cycle tutorial can you do 3 weapons and not 2 weapons cause i tried to put three weapons in and when i pressed “3” nothing happened

    • It’ll only work if you add in additional if statements to bring up those weapons. The script itself is just using an array which will change in size depending on how many weapons you add. You’ll need to add in other if statements to make sure those weapons are accessible. Currently the script is only bringing up two weapons.

  3. Hassam Amir says:

    Thanks for all the help. I really appreciate it. 🙂

Speak Your Mind

*