x


Detect a click outside a GUI/object

Hello!

Is it possible to detect when the user clicks with the mouse outside a GUI's area? I wanted to call my GUI's close method when that happens but I have no idea how to detect such event in the correct way.

Thanks!

more ▼

asked Aug 20, 2012 at 01:01 AM

avatar image

NeMewSys
158 52 44 45

Still struggling with this, it was cool to have an OnClickOutside() method.

Aug 20, 2012 at 09:20 AM NeMewSys

Not sure if this is what you want, but some initial investigation from me came up with Gui.changed http://docs.unity3d.com/Documentation/Components/gui-Controls.html at the bottom. may help

Aug 20, 2012 at 09:48 AM Grug16
(comments are locked)
10|3000 characters needed characters left

4 answers: sort voted first

Well there's no built in way to detect this. You have to check it manually. When you use a GUI window or group / area, you can use its Rect to check if the mouse is inside.

 // C#
 
 Rect windowPos = new Rect(10,10,200,150);
 
 void OnGUI()
 {
     Event e = Event.current;
     windowPos = GUI.Window(0, windowPos, drawWindow, "MyWindow");
     
     if (e.type == EventType.MouseDown && !windowPos.Contains(e.mousePosition))
     {
         // Click was outside of the GUI window
     }
 }
 
 void drawWindow(int aID)
 {
     // draw the window content
 }

Here's the same thing in UnityScript.

 // UnityScript    
 var windowPos = new Rect(10,10,200,150);
 
 function OnGUI()
 {
     var e = Event.current;
     windowPos = GUI.Window(0, windowPos, drawWindow, "MyWindow");
     
     if (e.type == EventType.MouseDown && !windowPos.Contains(e.mousePosition))
     {
         // Click was outside of the GUI window
     }
 }
 
 function drawWindow(ID : int)
 {
     // draw the window content
 }
more ▼

answered Aug 20, 2012 at 10:25 AM

avatar image

Bunny83
96.8k 53 297 525

i'm getting a strange error here: Event e = Event.current;

the error says Assets/MyCustomScripts/GUI/Window.js(18,22): UCE0001: ';' expected. Insert a semicolon at the end.

But there is a ; there... what the...

Aug 20, 2012 at 11:51 AM NeMewSys

This is the most efficient way I found of doing this: public function Update() {
if(Input.GetMouseButtonDown(0) && !mouseOver) {
Close();
}
}

public function OnMouseEnter() {
mouseOver = true;
}

public function OnMouseExit() {
mouseOver = false;
}

actually I don't know what's the difference between Event e = Event.current; and Input.GetMouseButtonDown(0).

Aug 20, 2012 at 11:58 AM NeMewSys

Damn it doesn't work, the OnMouseEnter and OnMouseExit are being applied to the GameObject and not the GUI itself....

Aug 20, 2012 at 12:01 PM NeMewSys

Uhmm, this example is written in C#...I've put a comment above that says C# ;) I can add the same example in UnityScript...

Aug 20, 2012 at 12:22 PM Bunny83

OnGUI is a very special callback. The Event class is tightly connected to OnGUI. All GUI elements are using the current Event state to draw themself or to react to all kind of events (keyboard / mouse / ...)

Aug 20, 2012 at 12:28 PM Bunny83
(comments are locked)
10|3000 characters needed characters left

I wrote a function:

     private void HideIfClickedOutside(GameObject panel) {
         if (Input.GetMouseButton(0) && panel.activeSelf && 
             !RectTransformUtility.RectangleContainsScreenPoint(
                 panel.GetComponent<RectTransform>(), 
                 Input.mousePosition, 
                 Camera.main)) {
             panel.SetActive(false);
         }
     }

which I call in Update() and it hides the panel when the user clicks outside it:

         HideIfClickedOutside(HelpPanel);

http://docs.unity3d.com/es/current/ScriptReference/RectTransformUtility.RectangleContainsScreenPoint.html

more ▼

answered May 08 at 12:37 AM

avatar image

anisabboud
217 1 4 5

WOW Incredible. After 3 hours searching about this. Finally found this. Thank you so much!

Jul 20 at 05:26 AM getexis
(comments are locked)
10|3000 characters needed characters left

This is the closest as it gets so far:

public function Update() {
if(Input.GetMouseButtonDown(0) && !MouseOver()) {
Close();

> }

}

public function MouseOver() { var x = Input.mousePosition.x; var y = Screen.height - Input.mousePosition.y; if(x >= SizeAndPos[0] && x <= (SizeAndPos[0] + SizeAndPos[2]) && y >= SizeAndPos[1] && y <= (SizeAndPos[1] + SizeAndPos[3])) return true; return false; } I get the mouse coordinates X and Y, and check if they are in the GUI's boundaries, I guess this is the most efficient as it gets in GUIs. I wasn't able to use

windowPos.Contains(e.mousePosition)

because of that error i commented above.

Hope this helps someone with the same question in the future.

Thanks

more ▼

answered Aug 20, 2012 at 12:14 PM

avatar image

NeMewSys
158 52 44 45

Can you post the relevant part of your GUI? What "area" do you have in your GUI?

Aug 20, 2012 at 12:30 PM Bunny83

My GUI's code is this: http://pastebin.com/H1AV3iW4 The relevant methods for this effect are Update and MouseOver.

Aug 20, 2012 at 01:19 PM NeMewSys
(comments are locked)
10|3000 characters needed characters left

The other answers didn't seem to work for me. Not sure if it's because I'm using Unity5 or because I did something wrong or what.

Anyways, this seems to work for me, although I want to add a caveat that I am a total Unity noob, so this might not work for all cases.

 private void OnGUI()
 {
     HideIfClickedOutside(TheGuiGameObjectToCheck, Event.current);
 }
 
 private bool HideIfClickedOutside(GameObject panel, Event e)
 {
     // do easy checks first.
     if (e.type == EventType.MouseDown && panel.activeSelf)
     {
         // get the transform of the GUI item you are checking
         RectTransform tform = panel.GetComponent<RectTransform>();
         //use the transform position and size to construct a Rect. 
         // the position is the center of the GUI element, so move it back to the corner
         Vector2 location = new Vector2(
             tform.position.x - tform.rect.size.x / 2,
             tform.position.y - tform.rect.size.y / 2);
         Rect toCheck = new Rect(location, tform.rect.size);
         // invert the y coordinate of the mouse to conform to the GUI coordinates
         if (!toCheck.Contains(new Vector2(e.mousePosition.x, Screen.height - e.mousePosition.y)))
         {
             panel.SetActive(false);
             return true;
         }
     }
     return false;
 }

more ▼

answered Jul 20 at 04:53 AM

avatar image

tster123
1 1

(comments are locked)
10|3000 characters needed characters left
Your answer
toggle preview:

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Topics:

x6702
x2033
x1644
x413
x21

asked: Aug 20, 2012 at 01:01 AM

Seen: 4808 times

Last Updated: Jul 20 at 05:26 AM