CODEWITHSUNDEEP
opencv
prashkr
prashkr

Reputation: 398

OpenCV - Dragging image blocks in a window

I am trying to make a jigsaw puzzle game in OpenCV. What i am doing is that i am converting an image into small squares which are images of equal dimensions. For example if i have an image of A x B size, then i re-size it to 640 x 640 and divide this re-sized image into squares each of which are of 64 x 64 size. I save these square images on the local disk.

Now i want to know if it is possible to place these square images randomly in one window and drag these images to match the final winning state? I can't find a way to implement the drag and drop thing. It'll be great if i can get some hints on this.

Upvotes: 1

Views: 2921

Answers (2)

karlphillip
karlphillip

Reputation: 93410

OpenCV can't display multiple images on the same window (natively). However, you can write a code that assembles all these little images into one large image, and then display that on a window.

The downside of this approach is that you will have to store an array with the information of where those images are placed (geographically speaking), so when a user clicks on the middle of the screen you can tell exactly which image is on that position. But you'll also have some major headaches to write the drag&drop animations because there's no way to do that with what OpenCV offers.

There are some demos laying around that shows how to deal with mouse clicks on OpenCV:

Bottom line, OpenCV is not built for these types of user interactions. I suggest you investigate Qt or some other technology to build your game.

I remember seeing a Qt demo that achieves what you are looking for:

Upvotes: 1

berak
berak

Reputation: 39796

i'm too lazy to write your program, but here are some parts you might like:

the mouse:

void onmouse(int event, int x, int y, int mousestate, void *userptr)
{
    if (event==1) // lmousebuttondown, do something with x, y
}

namedWindow("win");
setMouseCallback( "win", onmouse );

and, painting a small image(the thing you dragged) imto the big one:

Rect r(x,y,small.cols, small.rows);
big(r) = small;

Upvotes: 1

Related Questions