Create a button in OpenCV GUI without QT [duplicate] - c++

Question

I am working on a game-project using OpenCV. Now I have to make a simple GUI: a window with one button, using HighGui only.
I'm not sure but I think I'm supposed to use something like this:
cvNamedWindow( "NameWindow" , CV_WINDOW_AUTOSIZE);
Any help is much appreciated.

Answer 1

OpenCV does not provide a button, but you can easily use a colored rectangle, and check if the clicked point on the image is inside this rectangle.
Remember that OpenCV HighGui is very simple and is meant only for debugging purposes. You may want to use a full featured graphic library as Qt, or similar.
However, this is a small example that shows a (green) image, and a button on top:
Clicking the button will print "Clicked" on stdout:
Code:
#include <opencv2\opencv.hpp>
#include <iostream>
using namespace cv;
using namespace std;
Mat3b canvas;
string buttonText("Click me!");
string winName = "My cool GUI v0.1";
Rect button;
void callBackFunc(int event, int x, int y, int flags, void* userdata)
{
if (event == EVENT_LBUTTONDOWN)
{
if (button.contains(Point(x, y)))
{
cout << "Clicked!" << endl;
rectangle(canvas(button), button, Scalar(0,0,255), 2);
}
}
if (event == EVENT_LBUTTONUP)
{
rectangle(canvas, button, Scalar(200, 200, 200), 2);
}
imshow(winName, canvas);
waitKey(1);
}
int main()
{
// An image
Mat3b img(300, 300, Vec3b(0, 255, 0));
// Your button
button = Rect(0,0,img.cols, 50);
// The canvas
canvas = Mat3b(img.rows + button.height, img.cols, Vec3b(0,0,0));
// Draw the button
canvas(button) = Vec3b(200,200,200);
putText(canvas(button), buttonText, Point(button.width*0.35, button.height*0.7), FONT_HERSHEY_PLAIN, 1, Scalar(0,0,0));
// Draw the image
img.copyTo(canvas(Rect(0, button.height, img.cols, img.rows)));
// Setup callback function
namedWindow(winName);
setMouseCallback(winName, callBackFunc);
imshow(winName, canvas);
waitKey();
return 0;
}

Answer 2

You can now create buttons and other useful tools on OpenCV windows. The page below shows a couple of useful examples.
https://docs.opencv.org/master/dc/d46/group__highgui__qt.html
The gist of it is:
#include <opencv2/highgui.hpp>
void myButtonName_callback(int state, void*userData) {
// do something
printf("Button pressed\r\n");
}
createButton("myButtonName",myButtonName_callback,NULL,CV_PUSH_BUTTON,1);

Answer 3

you are aware that openCV is not a GUI library, but an image processing lib?
it ships with highgui: http://docs.opencv.org/2.4/modules/highgui/doc/highgui.html
for those cases where you really have no other options, but need to create a window for displaying stuff.
While OpenCV was designed for use in full-scale applications and can be used within functionally rich UI frameworks (such as Qt*, WinForms*, or Cocoa*) or without any UI at all, sometimes there it is required to try functionality quickly and visualize the results. This is what the HighGUI module has been designed for.
see OpenCV and creating GUIs
edit: "this doesn't answer the question": -> more help..
you can't.
or that is, if you know your underlying window manager, you can.
i.e. if you'r on windows, you could get the window handle, and dynamically add more controls..
if not, you need to know what platform you'r on, and how to do it in that.
I wouldn't dare to try and put this in a simple answer

Answer 4

#Miki, why I cannot use my buttons alternately? How to fix it? I mean I want to use them at the same time.
EDIT: I fixed it myself. No need of help. :)
#include <opencv2\opencv.hpp>
#include <iostream>
using namespace cv;
using namespace std;
Mat3b canvas;
string buttonText("Nacisnij guzik!");
string buttonText2("Nacisnij guzik NR2!");
string winName = "PokerGui";
int a = 0;//mozna pozniej usunac, potrzebne tylko czy button reaguje jak nalezy
Rect button, button2;
void callBackFunc(int event, int x, int y, int flags, void* userdata)
{
if (event == EVENT_LBUTTONDOWN)
{
if (button.contains(Point(x, y)))//ponizej to co ma sie wykonac po nacisnieciu klawisza
{
a = a + 7;
cout << "Nacisnales guzik!\n" << endl;
printf("liczba = %i\n", a);
rectangle(canvas(button), button, Scalar(0, 0, 255), 2);
}
else if (button2.contains(Point(x, y)))//ponizej to co ma sie wykonac po nacisnieciu klawisza
{
//a = a + 7;
cout << "Nacisnales guzik NR2!\n" << endl;
//printf("liczba = %i\n", a);
rectangle(canvas(button2), button, Scalar(0, 0, 255), 2);
}
}
//if (event == EVENT_LBUTTONUP)
//{
//rectangle(canvas, button, Scalar(200, 200, 200), 2);
//}
imshow(winName, canvas);
waitKey(1);
}
void callBackFunc2(int event, int x, int y, int flags, void* userdata)
{
if (event == EVENT_LBUTTONDOWN)
{
if (button2.contains(Point(x, y)))//ponizej to co ma sie wykonac po nacisnieciu klawisza
{
//a = a + 7;
cout << "Nacisnales guzik NR2!\n" << endl;
//printf("liczba = %i\n", a);
rectangle(canvas(button2), button, Scalar(0, 0, 255), 2);
}
}
//if (event == EVENT_LBUTTONUP)
//{
//rectangle(canvas, button, Scalar(200, 200, 200), 2);
//}
imshow(winName, canvas);
waitKey(1);
}
int main()
{
// An image
Mat3b img(300, 300, Vec3b(0, 255, 0));
// Your button
button = Rect(0, 0, img.cols, 50);
button2 = Rect(0, 60, img.cols, 50);
// The canvas
canvas = Mat3b(img.rows + button.height, img.cols, Vec3b(0, 0, 0));
// Draw the button
canvas(button) = Vec3b(200, 200, 200);
canvas(button2) = Vec3b(200, 200, 200);
putText(canvas(button), buttonText, Point(button.width*0.35, button.height*0.7), FONT_HERSHEY_PLAIN, 1, Scalar(0, 0, 0));
putText(canvas(button2), buttonText2, Point(button.width*0.25, button.height*0.7), FONT_HERSHEY_PLAIN, 1, Scalar(0, 0, 0));
// Draw the image
//img.copyTo(canvas(Rect(0, button.height, img.cols, img.rows)));
// Setup callback function
namedWindow(winName);
setMouseCallback(winName, callBackFunc);
//setMouseCallback(winName, callBackFunc2);
imshow(winName, canvas);
waitKey();
return 0;
}