- Home /
Best approach to define interactive screen areas regardless of it's resolution?
Now to the fun part. After some thinking and tinkering I figured that, since I'll deploying the game to an unknown lot of different resolutions (think android devices and then iOS :P ), I can't just define a couple of intervals on the xx axis and check where the click/tap position fits, I need something a bit more clever than that.
So I came up with 2 possible ways to tackle this problem, but I don't know if there is a third one or which one is the "proper" one in terms of effort/result/performance. So I'd like to know what you guys think about my ideias and if there is a better way to do this?
Option one is an "easy mode" solution: Create 2 "invisible" GUITextures, hook click/tap events on them, deploy a little "auto-scale, auto-position" function to keep up with resolution changes and done. In case you are wondering, the "center" action will be the default one, so I only need to specify the other two ;)
Option two is a bit more elaborate, and I don't have all the info I need to implement it:In a nutshell, I'll measure the screen's width (since height is irrelevant for my purpose), divide width/3, figure out how many pixels I have in each section (here is where it get's tricky), map an xx interval to each set of pixels, something like for pixels=0-200, x goes from 0 to 30, for pixels 201-301, x is 31 to 61, etc. This seems a bit more complex then option 1 and I need to know how much does xx variates per pixel(s).
Edit: My purpose is to figure out a way to define 3 screen areas, that are not visible to the user/player and that will trigger specific actions when acted upon. My two suggestions are for the implementation of a procedure that allows the required mechanics while beign agnostic of screen resolution.
I apologyse if any of my approaches is blatantly daft or a exuberant display of ignorance over the subject matter, but I'm still learning. Thus I feel that is more interesting to formulate the hypothesis and see it corrected by someone more experient, than just asking for the solution to problems we don't fully understand ;)
Thanks in advance for helping!
Can't you just define all of your pixel widths in terms of the screen dimensions? So that things will always be in the same proportions, no matter how you stretch or squeeze the screen?
Don't know if I undersood correctly, but that is a part of both solutions. In solution 1 I'd do that to keep proportions on the GUITextures. On solution 2 I'd find the screen dimensions that fit the pixel widths.
I agree with syclamoth. You could work with screen resolution not only for clicks but also to display your GUI. What I mean is, when declaring, in example, a Rect for GUI element, resize all it´s dimensions and positions dinamically according to the device resolution. For that you would need to have a "standard" or maximum resolution to figure out a coeficient to resize your GUI in other devices.
Yes, that was the approach I was considering to scale my "invisible" GUITextures. For what I see so far, using shapes and scaling is a far more common method to handle this.
Answer by amirabiri · Nov 17, 2011 at 10:29 PM
I might have missed something, but why can't you just divide the screen with by 3 and compare the mouse x position to that? i.e:
if (Input.GetMouseButtonDown(0))
{
var regionWidth = Screen.width / 3;
if (Input.mousePosition.x < regionWidth)
DoLeftSideAction();
else if (Input.mousePosition.x < regionWidth * 2)
DoMiddleSideAction();
else
DoRightSideAction();
}
That seems to be just what I was looking for! I'll try it out later today and post results. Thanks
This did it for me, however I'll be using some of the other tips to solve different problems. Thanks everyone!
Answer by Eric5h5 · Nov 17, 2011 at 05:48 PM
GUITextures use viewport space, which means that (0, 0) is the bottom-left of the screen, and (1, 1) is the upper-right of the screen, regardless of resolution. Remove all pixel inset information and just use position/scale, and it's automatically 100% resolution-independent without needing any code. You can use HitTest to determine what taps do.
Thats a very usefull tip. I'll try this a couple other approaches mentioned here later today and I'll post my results after. Thanks!
Answer by seedoubleyou · Nov 17, 2011 at 08:16 PM
I use Eric5h5's method for doing this, but I'll just throw this out there: I can't exactly remember where I saw it (maybe one of the Unite10 videos?) but there was this sort of brilliant idea that you map all your guiTextures to one camera, then your game scene to another. Using Depth, the gui Camera textures should display the same across all devices, and you simply change the distance of the scene Camera when it detects a particular device. I've never tried this, but it sounds like at least the beginning of a pretty good strategy...
That doesn't make any sense to me...GUITextures don't depend on camera distance or anything. $$anonymous$$aybe I'm misunderstanding.
I think that's the point, that no matter what device you use the guiTextures will appear the same. You then use a separate camera set at a different Depth to view the scene and change it's distance to fit the scene in your device's view.
http://unity3d.com/support/documentation/ScriptReference/Camera-depth.html http://unity3d.com/support/documentation/Components/class-Camera.html
Still don't get it. ;) You don't need two cameras, you just need a GUILayer component on one camera. The GUITextures will automatically fit all devices without you having to do anything (as long as you leave all pixelInset values at 0 and only use transform.position/scale).
Well. like I said, I was just throwing the idea out there. I'll have to find and post the video where the advantage of it was explained more clearly than I've been able to...