- Home /
Resolution independent background for a 2d game
Hello guys, I have an orthographic camera in the scene, I have a plane with a texture attached, I was struggling to find out how can I make the background of my game Resolution Independent. By resolution independent, I mean to say that the background should be the same no matter what mobile device the game is played on. The game will be built in Portrait mode. Any suggestions?
EDIT: This background is basically a car race track which will have 2d colliders to check if the car is hitting one of those colliders. I believe I cannot do this using a 2nd Camera, or can I?
Your Edit helps, but a picture would be even better. Here are a few solutions.
For narrower aspects than the aspect designed for, adjust the orthographicSize of the camera so that the top and bottom of the screen are chopped off, but the image fills the screen.
Oversize the sides of the image so, if the aspect is wider, there will be material to show. A square image will cover all 'portrait' aspects.
Change the projection matrix of the camera to match the aspect (everything, not just the background, would be stretched or compressed.
Stretch/Shrink the width of the image to fit. Define the colldiers based on Viewport coordinates rather than world coordinates, and you might need to scale the colliders as well.
well, this sounds much more challenging than i thought it would be. Just to clear it up, I have a track. Zoo$$anonymous$$g out the camera will make the complete track visible. But I use the smoothfollow for camera to follow the car and only part of the track will be visible. I need this "part" of the track to be same in all screen resloutions.
Answer by Mayank Ghanshala · Aug 07, 2014 at 07:46 AM
I think Its not difficult task. All you have to scale your BG Image as the camera width and height. You can do it in your code.The problem is you can set height but not width in Editor as it always changes in every device. Here is a script to stretch bg as the resolution of any mob device in portrait mode.
using UnityEngine;
using System.Collections;
public class BGScript : MonoBehaviour {
SpriteRenderer sr;
void Start () {
sr = GetComponent<SpriteRenderer> ();
float xmas = Screen.width*Camera.main.orthographicSize*2.0f /(Screen.height*1.0f);
float yScale = Camera.main.orthographicSize*2.0f / sr.renderer.bounds.size.y;
float xScale = 0;
xScale = xmas / sr.renderer.bounds.size.x;
transform.localScale = new Vector3 (xScale,yScale,1);
}
}
Add it to your background object in Editor.
I'll try it out. I had one more question though, what is the best image resolution I should use for better quality of the background?
not sure but you can try with 960 * 540 and you can use format truecolor for better experience. Pack your images and using 2*power is the best option for resolution as they save memory and packing image save batching.
@$$anonymous$$ayank Ghanshala Resizing the image doesn't help bro. I have a race track as the background and colliders attached to the borders of the track. If I resize the image it will stretch/shrink the tracks, thereby misplacing the colliders compared to the track edges. Any other way?
Your answer
Follow this Question
Related Questions
Stretching Background sprite 4 Answers
Background and UI scalings are wrong 1 Answer
Unity 2D and Texture Memory. 1 Answer
How to set an objects position to the corner of the screen? (Unity 2D) 2 Answers
Making a point and click background. 0 Answers