Allegro.cc - Online Community

Allegro.cc Forums » Programming Questions » MOUSE question

This thread is locked; no one can reply to it. rss feed Print
MOUSE question
Scooter
Member #16,799
January 2018

Hi all:
I have a question concerning the use of the mouse.
I have a yellow rectangle at the bottom of the screen.
I have an image showing in the middle of the screen.

What I want to do is click inside the yellow rectangle on the left side,
move the mouse to the right to make the image larger, move the mouse back
to the left to make the image smaller. Is this even possible using Allegro5?
I hope my explanation is clear. Thanks for your time.

AceBlkwell
Member #13,038
July 2011
avatar

Scooter

I’m assuming you know the correct commands of A5 so I’ll paraphrase what I would do. Keep in mind I’m a novice with A5 so some of the others might give a more concise way of doing this.
I’m also assuming you already have the smaller image drawn as a default size.

int pos_x = 0;
int pos_y = 0;
bool Img_Size = false; // default smaller size

//With in the program while loop

// I would record mouse position.
if(event.type == ALLEGRO_EVENT_MOUSE_AXES)
{
pos_y = event.mouse.y;
pos_x = event.mouse.x;
} // end mouse axis

// Then I would react when button pressed.

if(event.type == ALLEGRO_EVENT_MOUSE_BUTTON_DOWN){ // The pos_X & Y are coordinates from a program I’m writing. You would use yours of course.

if(pos_x >= 180 && pos_y >= 240){ // Confirming I’m within the upper left hand corner of the “Large Image” section of the yellow rectangle.
if(pos_x <= 290 && pos_y<= 280){ // And that I’m within lower right hand corner of the “Large Image” section of the yellow rectangle.
Img_Size = true;
}}// end location if

if (pos_x >= 440 && pos_y >= 240){ // Confirming I’m within the upper left hand corner of the “Small Image” section of the yellow rectangle.
if(pos_x <= 560 && pos_y<= 280){ // And that I’m within lower right hand corner of the “Smaller Image” section of the yellow rectangle.
Img_Size = false;
}}// end location if
}// end button down

// Then draw specific image based on Img_Size

if( Img_Size == true)
al_draw_bitmap(lrg_bmp, x, y, 0);

if( Img_Size == false)
al_draw_bitmap(small_bmp, x, y, 0);

Let me know if I’ve misunderstood your question. Good Luck.

Scooter
Member #16,799
January 2018

Thanks AceBlkwell for your quick reply.
Looks like we both are in the same boat. I also am not an expert but I do
enjoy programming. Great post. That is real close to what I have now. I can
click anywhere in the yellow rectangle and the image will respond.
What I would like to do now is click in the left side of the rectangle,
hold the left mouse button down, move the mouse to the right and the image gets
larger in real time. Still holding the mouse button down, move the mouse to the
left and the image gets smaller in real time. My question is if this is possible
to do in allegro5.
Have a great day!

AceBlkwell
Member #13,038
July 2011
avatar

Scooter,

I enjoy programming as well. I usually decide to program something just to see if I can do it. Most of my programming is never seen by anyone but me.

In any case, sounds like you are asking about real time scaling. And that is well above my abilities. Like you, I'm not sure Allegro has that capability. Maybe one of the site experts might chime in.

Good luck and keep me updated on how it turns out.

BTW I found these doing a quick check...
al_draw_scaled_bitmap
&
https://www.youtube.com/watch?v=vkWivB3aCAo Rotating, Scaling and Tinting BMP in Allegro 5

DanielH
Member #934
January 2001
avatar

something like this. if only one rect, don't need the index var

#SelectExpand
1// need some extra vars 2bool isGrabbed = false; 3int indexOfGrabbedRect = -1; 4 5// if event mouse down and in corner of rect 6isGrabbed = true; 7indexOfGrabbedRect = index; 8 9// is event mouse moved and isGrabbed == true 10rect[indexOfGrabbedRect].x1 = mousex; 11rect[indexOfGrabbedRect].y1 = mousey; 12 13//if event mouse up 14isGrabbed = false; 15indexOfGrabbedRect = -1;

Scooter
Member #16,799
January 2018

Thanks AceBlkwell:
That is exactly the function I am using.
Here is the code that does the trick:

pos_x = ev.mouse.x; // get mouse x position
pos_y = ev.mouse.y; // get mouse y position
// al_set_mouse_xy(display, pos_x, pos_y);
image_height = al_get_bitmap_height(image);
image_width = al_get_bitmap_width(image);
al_clear_to_color(al_map_rgb(0,0,0));
draw_work_area();

scale_factor = working_screen_height / image_height;
dist = pos_x - 1030; // 1030 is the distance to left edge of rectangle
scale_factor = scale_factor * (dist / 125);
al_draw_scaled_bitmap(image,
0, 0, image_width, image_height,
(screen_width - (scale_factor * image_width)) / 2.0, // x position
((working_screen_height - scale_factor * image_height) / 2.0), // y position
image_width * scale_factor, image_height * scale_factor, 0);
al_flip_display();

I am going to redo some of the code to see if I can figure this out.
I will keep you posted!

AceBlkwell
Member #13,038
July 2011
avatar

Nice Scooter. You'll have to upload the finished program so I can see it in action.

Scooter
Member #16,799
January 2018

AceBlkwell:

Sorry, could not work it out.
Can move the mouse when in the rectangle
and mouse coordinates will change like they
should but image does not change.
Probably screwed up events. Don't even
know if it is possible using Allegro.
Have a great day!

Edgar Reynaldo
Major Reynaldo
May 2007
avatar

If you can draw a rectangle with allegro, it is possible. :/

Think about it in psuedocode. What do you need data wise? You need the mouse coordinates, you need the original rectangle and the new rectangle.

If you get a mouse button down event, check if it is over the edge of the rectangle. If so, you're now dragging the rectangle. drag = true;

If you get a mouse button up event, drag = false, and you should 'let go' of the rectangle and save its last position as the original.

If you get a mouse axes event, check if you are dragging (drag == true) and if so, update the rectangle position.

If you really need the scale, calculate it from the two rectangles.

Dizzy Egg
Member #10,824
March 2009
avatar

It's perfectly possible with Allegro5!!

Attached is an example program (tested on Windows), and the source code:

#SelectExpand
1 2#include <allegro5/allegro.h> 3#include <allegro5/allegro_primitives.h> 4#include <allegro5/allegro_image.h> 5#include <allegro5/allegro_font.h> 6#include <allegro5/allegro_ttf.h> 7#include <stdio.h> 8#include <stdlib.h> 9 10const char* bool_string(bool value); 11 12int main() 13{ 14 al_init(); 15 al_init_primitives_addon(); 16 al_init_image_addon(); 17 al_init_font_addon(); 18 al_init_ttf_addon(); 19 20 al_set_new_display_flags(ALLEGRO_WINDOWED); 21 ALLEGRO_DISPLAY* display = al_create_display(1280, 720); 22 23 ALLEGRO_BITMAP* image = al_load_bitmap("test_image.png"); 24 25 ALLEGRO_FONT* font = al_load_ttf_font("arial.ttf", 14, 0); 26 27 ALLEGRO_TIMER* redraw_timer = al_create_timer(1.0 / 60.0); 28 29 ALLEGRO_EVENT_QUEUE* event_queue = al_create_event_queue(); 30 ALLEGRO_EVENT ev; 31 32 al_install_mouse(); 33 34 al_register_event_source(event_queue, al_get_mouse_event_source()); 35 al_register_event_source(event_queue, al_get_timer_event_source(redraw_timer)); 36 al_register_event_source(event_queue, al_get_display_event_source(display)); 37 38 int resize_box_x1 = 560; 39 int resize_box_y1 = 540; 40 int resize_box_x2 = 720; 41 int resize_box_y2 = 620; 42 43 float image_size = 1.0; 44 int image_w = al_get_bitmap_width(image); 45 int image_h = al_get_bitmap_height(image); 46 47 int mouse_x = 0; 48 int mouse_y = 0; 49 50 bool done = false; 51 bool redraw = false; 52 bool mouse_down = false; 53 bool mouse_in_box = false; 54 bool resizing = false; 55 56 char text_string[50]; 57 58 al_start_timer(redraw_timer); 59 60 while (!done) 61 { 62 al_wait_for_event(event_queue, &ev); 63 64 if (ev.type == ALLEGRO_EVENT_DISPLAY_CLOSE) 65 { 66 done = true; 67 } 68 else if (ev.type == ALLEGRO_EVENT_TIMER) 69 { 70 redraw = true; 71 72 if ((mouse_x >= resize_box_x1 && mouse_x <= resize_box_x2) && (mouse_y >= resize_box_y1 && mouse_y <= resize_box_y2)) 73 { 74 mouse_in_box = true; 75 } 76 else 77 { 78 mouse_in_box = false; 79 resizing = false; 80 } 81 } 82 else if (ev.type == ALLEGRO_EVENT_MOUSE_BUTTON_DOWN && ev.mouse.button == 1) 83 { 84 mouse_down = true; 85 86 if (mouse_in_box) 87 { 88 resizing = true; 89 } 90 else 91 { 92 resizing = false; 93 } 94 } 95 else if (ev.type == ALLEGRO_EVENT_MOUSE_BUTTON_UP && ev.mouse.button == 1) 96 { 97 mouse_down = false; 98 99 resizing = false; 100 } 101 else if (ev.type == ALLEGRO_EVENT_MOUSE_AXES) 102 { 103 mouse_x = ev.mouse.x; 104 mouse_y = ev.mouse.y; 105 106 if (resizing) 107 { 108 image_size += ev.mouse.dx * 0.01; 109 } 110 111 if (image_size < 0) 112 { 113 image_size = 0; 114 } 115 } 116 117 if (redraw) 118 { 119 al_clear_to_color(al_map_rgb(20, 20, 20)); 120 121 al_draw_scaled_bitmap(image, 0, 0, image_w, image_h, 640 - ((image_w * image_size) / 2), 260 - ((image_h * image_size) / 2), image_w * image_size, image_h * image_size, 0); 122 123 al_draw_filled_rectangle(resize_box_x1, resize_box_y1, resize_box_x2, resize_box_y2, al_map_rgb(255, 255, 0)); 124 125 sprintf_s(text_string, "Mouse Down: %s", bool_string(mouse_down)); 126 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 10, 0, text_string); 127 sprintf_s(text_string, "Mouse X: %d", mouse_x); 128 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 30, 0, text_string); 129 sprintf_s(text_string, "Mouse Y: %d", mouse_y); 130 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 50, 0, text_string); 131 sprintf_s(text_string, "Mouse in box: %s", bool_string(mouse_in_box)); 132 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 70, 0, text_string); 133 sprintf_s(text_string, "Resizing: %s", bool_string(resizing)); 134 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 90, 0, text_string); 135 sprintf_s(text_string, "Image size/scale: %f", image_size); 136 al_draw_text(font, al_map_rgb(255, 255, 255), 10, 110, 0, text_string); 137 138 al_flip_display(); 139 redraw = false; 140 } 141 } 142 143 al_destroy_bitmap(image); 144 al_destroy_font(font); 145 al_destroy_event_queue(event_queue); 146 al_destroy_display(display); 147} 148 149const char* bool_string(bool value) 150{ 151 return value ? "True" : "False"; 152}

----------------------------------------------------
Please check out my songs:
https://soundcloud.com/dont-rob-the-machina

Scooter
Member #16,799
January 2018

Thanks Edgar and Dizzy
This is exactly what I was trying to do.
I had everything right except the events part.
I could pick inside the rectangle and the image
would appear correctly. When I clicked inside the
the rectangle and moved the mouse nothing would happen.

Dizzy:
I had to modify your program to work on Linux.
Worked perfectly. Great job!

Thanks to both of you for helping me on this!

Go to: