Clicking draw GUI sprites

[Zarim]

Hello I was planning on clicking a sprite from my GUI but i seems ii'm a little bit stuck here can anyone please help me?

 

[Creasion]

You can use:

var mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
var mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

and check for collision with the GUI element with:

// top left corner
var xx = 0; // x position of the GUI element (insted of 0)
var yy = 0; // y position of the GUI element (insted of 0)
var ww = 50; // width of the GUI element (insted of 50)
var hh = 50; // height of the GUI element (insted of 50)
if (point_in_rectangle(mousex, mousey, xx, yy, xx + ww, yy + hh)) {
    // Check for mouse input
    if (mouse_check_button_pressed(mb_left)) {
        // What to happen when clicked
        show_message("click.");
    }
}

Edit: fixed the missing argument (sorry i'm blind, jk)

 

[Zarim]

You can use:

var mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
var mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

and check for collision with the GUI element with:

// top left corner
var xx = 0; // x position of the GUI element (insted of 0)
var yy = 0; // y position of the GUI element (insted of 0)
var ww = 50; // width of the GUI element (insted of 50)
var hh = 50; // height of the GUI element (insted of 50)
if (point_in_rectangle(mousex, mousey, xx, xx + ww, yy + hh)) {
    // Check for mouse input
    if (mouse_check_button_pressed(mb_left)) {
        // What to happen when clicked
        show_message("click.");
    }
}

Thank you soo much for the reply . But there was a missing argument :O

 

[Zarim]

When you said mousex and mousey you were referring to mouse_x and mouse_y right?

 

[Zarim]

Oh sorry, i din't saw the variable. the only problem is the missing argument

 

[rIKmAN]

Oh sorry, i din't saw the variable. the only problem is the missing argument

He forgot an argument in the point_in_rectangle function - something which you could easily solve yourself by reading the error message and checking the manual.
Hint: check this:

point_in_rectangle(mousex, mousey, xx, xx + ww, yy + hh)

against what arguments are expected in the manual, and then fix it. Easy!

You won't get very far coding by not trying to fix things yourself and just waiting for people to give you code - start getting your hands dirty, dig in and use the documentation.

It's important you learn this stuff, and the best way to learn is by doing.

 

[Zarim]

Yeah I found the issue, but there is just one thing I can't get. It dosent work. I've put it in the creation code where I draw my gui but it seems that it wont work

 

[orSQUADstra]

Yeah I found the issue, but there is just one thing I can't get. It dosent work. I've put it in the creation code where I draw my gui but it seems that it wont work

Maybe because you should have this in the Step event:

mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

 

[rIKmAN]

Maybe because you should have this in the Step event:

mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

He should have the whole point_in_rectangle section in the Step Event too - so it's checked every step.

OP - I would again recommend having a read through the manual to get a grasp on the basics of how events work, it's important you understand what each one does so that you can then figure out and learn where to put your code to do the things you want.

Create Event - runs once when the object is created.
Step Event - Runs every frame.

So you can see that checking if the mouse is in the rectangular area of the button in the Create Event is quite useless, you want to check every frame so that it updates continuously as the user moves the mouse around.

 

[Creasion]

Yeah I found the issue, but there is just one thing I can't get. It dosent work. I've put it in the creation code where I draw my gui but it seems that it wont work

Yeah I guess this wouldn't have happened if I was more specific... you are drawing the GUI in creation code... It's quite obvious that you need to check for something in a STEP EVENT (or in an alarm for better performance)... It's working now right?

 

[webbsite]

I am having a hard time to get this working.

I have a sprite holding 48 emojis. I want to draw them to a grid and make each a button that will change a variable to the index of the sprite clicked. I can't work out why this is failing. My mouse x and y work, and my rectangles draw perfectly, however the point in rectangle function doesn't seem to work?

Create

gui_h = display_get_gui_height();
gui_w = display_get_gui_width();
counter = 0;


width = 0;
height = 0;

emitEmoji = 0;


mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

step

mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

if (point_in_rectangle(mousex,mousey,width - 8,height - 8,width + 8,height + 8)) {
                if (mouse_check_button_pressed(mb_left)) {

                emitEmoji = counter;

                }
            }

draw GUI

if showEmojiGrid {
    counter = 0;
    for (var ii = 0;ii < 5;ii++) {

        for (var i = 0;i < 10;i++) {
            
             width = 16 + (((gui_w - 16)/ 10) * i);
             height = (gui_h /2) + (ii * 16);
            
            draw_sprite(sprite_index,counter, width,height);
            
            draw_rectangle(width-8,height -8,width+8,height+8,true)
            

        
            draw_text(50,70,string(mousex));
            draw_text(50,90,string(mousey));   

            draw_text(50,50,string(emitEmoji));
            
            counter ++;
    
        };   
    };
};

 

[webbsite]

Hey, check this

if showEmojiGrid {
    counter = 0;
    for (var ii = 0;ii < 5;ii++) {

        for (var i = 0;i < 10;i++) {
          
             width = 16 + (((gui_w - 16)/ 10) * i);
             height = (gui_h /2) + (ii * 16);
          
            draw_sprite(sprite_index,counter, width,height);
          
            draw_rectangle(width-8,height -8,width+8,height+8,true);
          

      
            draw_text(50,70,string(mousex));
            draw_text(50,90,string(mousey)); 

            draw_text(50,50,string(emitEmoji));
          
            counter ++;
  
        }
    }
}

This is the same code that I posted originally?

 

[Abeeel]

You can use:

var mousex = device_mouse_x_to_gui(0); // GUI position of mouse's x coordinate
var mousey = device_mouse_y_to_gui(0); // GUI position of mouse's y coordinate

and check for collision with the GUI element with:

// top left corner
var xx = 0; // x position of the GUI element (insted of 0)
var yy = 0; // y position of the GUI element (insted of 0)
var ww = 50; // width of the GUI element (insted of 50)
var hh = 50; // height of the GUI element (insted of 50)
if (point_in_rectangle(mousex, mousey, xx, yy, xx + ww, yy + hh)) {
    // Check for mouse input
    if (mouse_check_button_pressed(mb_left)) {
        // What to happen when clicked
        show_message("click.");
    }
}

Edit: fixed the missing argument (sorry i'm blind, jk)

Thank you so much