Scaling background to the screen size

Hey all,

Using UnityGUI I’m making a menu what has 3 buttons and a background. The buttons work fine but the background size wasn’t in a power of two so unity automatically scaled it to a near power of 2 size. How can I stretch the background to the size of the window? (Quality loss is no problem) 600x800 in this example. I’m using: GUI.Box (Rect (0,0,800,600), Background); to draw the background but the 800 and 600 didn’t do anything even though it looks like they should do something.

In the GUISkin I used I already disabled the default borders to show so I can have my own graphics but I can’t find a thing to take width and height into account. The width and height arguments don’t seem to do anything in the GUI.box function. Even when I turn the borders on it will scale to the size of the image named at the end of the GUI.Box script. Here’s my full script for the menu. Turning on Scale Height in the GUISkin doesnt help too. The GUISkin is almost the same as the default GUISkin, only turned off borders etc. for buttons.

var Background : Texture2D;
var Start : Texture2D;
var Options : Texture2D;
var Quit : Texture2D;
var Skin : GUISkin;

function OnGUI () {
	GUI.skin=Skin;
	GUI.Box (Rect (0,0,800,600), Background);
	GUI.Label(Rect(0,0,800,600),"Secret Title");	

	if (GUI.Button (Rect (272,200, 320, 64), Start)) {
		print ("you clicked start");
		Application.LoadLevel("test scene");
	}

	if (GUI.Button (Rect (272,300, 320, 64), Options)) {
		print ("you clicked options");
	}

	if (GUI.Button (Rect (272,400, 320, 64), Quit)) {
		print ("you clicked quit");

Thanks in advance!

Edit: And what about rotating? In other software packages its easy to draw an image stretched and/or rotaded, is it hidden somewhere in Unity?

I think what you want to do is apply your background texture to a secondary camera rather attempt to use the box object as your background.

  1. Select your 2Dtexture
  2. Click the “Layer” dropdown menu in the 2Dtexture Inspector, and select “Add Layer”.
  3. Create a new user layer and give it a name like “Background Texture”.
  4. Once the layer is added, select the layer you just created in the layer dropDown of the 2D texture.
  5. Drag your background image onto the 2D texture’s Texture variable in the 2D texture Inspector.
  6. You will set the scaling here on the 2D texture Inspector under “Pixel Inset”, but you will not be able to see the results of your settings until we add the secondary camera.
  7. Add another camera and call it something like “BackgorundCamera”. Remove the audio listener and flare components.
    8 . Set the background camera’s culling mask to “Nothing”, and then set it to the name of the layer you created for the 2Dtexture object.
  8. Make sure the Background camera’s depth is lower than the main camera depth, as you want your main camera to be drawn on top. 0 for main camera and -1 for the background camera are typical values.
  9. Select the main camera and uncheck the layer that you created for the 2D texture from the Culling Mask dropDown. Select “Depth only” in the Clear Flags drop down so you can see through to the background.

Finally, you can go back to the inspector of the 2Dtexture and scale the background image. You will also have to move it’s position around based on the size of the image so it is centered in front of the camera. About half of the height and width will get you close.

1 Like

Came up with this link… Unity 2D noob: Stretch Background to fit in Portrait mode

1 Like