I am a newbie at GTK+. I want to create a GUI with an Image with 2 buttons and a label below it.
The image has to be loaded via a file dialog which is opened when I click a button called "Load", but the image is not being shown on the Window. Below is my code:
#include <gtk/gtk.h>
#include <gtkmm.h>
#include <glib.h>
#include <cstring>
#include <cstdlib>
#include "cv.h"
#include "opencv2/highgui/highgui.hpp"
#include "opencv2/imgproc/imgproc.hpp"
#include <iostream>
using namespace std;
using namespace cv;
GtkWidget *window, *image;
GtkWidget *vbox, *valign, *hbox, *halign;
GtkWidget *expression_label;
char* get_file()
{
GtkWidget *dialog = gtk_file_chooser_dialog_new("Open File", (GtkWindow *) window, GTK_FILE_CHOOSER_ACTION_OPEN, GTK_STOCK_CANCEL, GTK_RESPONSE_CANCEL, GTK_STOCK_OPEN, GTK_RESPONSE_ACCEPT, NULL);
if(gtk_dialog_run(GTK_DIALOG(dialog)) == GTK_RESPONSE_ACCEPT)
{
char *filename;
filename = gtk_file_chooser_get_filename( GTK_FILE_CHOOSER(dialog) );
gtk_widget_destroy(dialog);
return filename;
}
}
void load_file(GtkWidget *widget, gpointer data)
{
g_print("Loading file\n");
char *file = get_file();
Mat img = imread(file);
//imshow("Opencv image", img);
image = gtk_image_new_from_file(file);
gtk_widget_queue_draw(image);
// gtk_box_pack_start(GTK_BOX(vbox), image, FALSE, FALSE, 0);
gtk_label_set_text(GTK_LABEL(expression_label), "Image Loaded");
g_print("File Loaded\n");
g_print("%s\n", file);
}
void get_expression(GtkWidget *widget, gpointer data)
{
gtk_label_set_text(GTK_LABEL(expression_label), "Expression Detected");
}
int main(int argc, char* argv[])
{
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(window), "FEAR");
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window), 1100, 1100);
gtk_window_set_resizable(GTK_WINDOW(window), TRUE);
gtk_container_set_border_width(GTK_CONTAINER(window), 10);
vbox = gtk_vbox_new(FALSE, 5);
hbox = gtk_hbox_new(TRUE, 3);
GtkWidget *load_button = gtk_button_new_with_label("Load");
GtkWidget *run_button = gtk_button_new_with_label("Run");
gtk_widget_set_size_request(load_button, 70, 30);
gtk_widget_set_size_request(run_button, 70, 30);
gtk_container_add(GTK_CONTAINER(hbox), load_button);
gtk_container_add(GTK_CONTAINER(hbox), run_button);
expression_label = gtk_label_new("Expression");
//image = gtk_image_new();
//Display placeholder image
image = gtk_image_new_from_file("../sample.jpg");
gtk_box_pack_start(GTK_BOX(vbox), image, FALSE, FALSE, 0);
gtk_box_pack_start(GTK_BOX(vbox), hbox, FALSE, FALSE, 0);
gtk_box_pack_start(GTK_BOX(vbox), expression_label, FALSE, FALSE, 0);
gtk_container_add(GTK_CONTAINER(window), vbox);
int load_handler_id = g_signal_connect(G_OBJECT(load_button), "clicked", G_CALLBACK(load_file), NULL);
g_signal_connect(G_OBJECT(run_button), "clicked", G_CALLBACK(get_expression), NULL);
g_signal_connect_swapped(G_OBJECT(window), "destroy", G_CALLBACK(gtk_main_quit), NULL);
gtk_widget_show_all(window);
gtk_main();
return 0;
}
I basically created a main window, then added a vbox to it. In the vbox, I have added the image widget, a hbox box that holds by buttons and a label widget to give me relevant information.
When I run the program, it displays the placeholder image properly, but when I select "Load" and choose the new image to be displayed, the label changes and I get the correct output on the command line, but the image widget does not display the new image that was selected.
Can someone please help me and let me know what am I doing wrong?
You're getting a new GtkImage widget after loading, and that widget is never added to a window so (of course) it's not being displayed.
You're just overwriting a global widget pointer with the new widget, but that doesn't magically make the new widget "replace" the old in the widget hierarchy. That you store the pointer to the new widget in the variable that used to hold the old widget doesn't matter from GTK+'s perspective.
Replace your call to gtk_image_new_from_file() with a call to gtk_image_set_from_file() on your existing widget (in image) to replace the content of the existing widget, which is packed and so on, with the image from the file.
Also, you're leaking the filename, you need to add free() after using it.
UPDATE: You mention in a comment that you've made the filename a global, to make it available in more places. If so, you still need to free() the old filename before getting a new one, else your code will be leaking memory.
Related
this code show me on xubuntu 21.04 form with size (400px width + 400px height) and with ONE button.
How can I add to this code two buttons?
#include <gtk/gtk.h>
static void activate(GtkApplication *app, void *user_data) {
GtkWidget *window = gtk_application_window_new(app);
gtk_window_set_child(GTK_WINDOW(window), gtk_label_new("Hello World!"));
gtk_window_present(GTK_WINDOW(window));
gtk_window_set_default_size (GTK_WINDOW (window), 400, 400);
// Create a new button
GtkWidget *button = gtk_button_new_with_label ("press 123");
gtk_window_set_child (GTK_WINDOW (window), button);
// When the button is clicked, close the window passed as an argument
g_signal_connect_swapped (button, "clicked", G_CALLBACK (gtk_window_close), window);
}
int main(int argc, char *argv[]) {
g_autoptr(GtkApplication) app = gtk_application_new(NULL, G_APPLICATION_FLAGS_NONE);
g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);
return g_application_run(G_APPLICATION(app), argc, argv);
}
In GTK4, I have found that a window (GtkWindow or GtkApplicationWindow) can only have one child. So to include multiple widgets within a window (such as a label and three buttons) one usually has to first create a grid object (GtkGrid), place the widgets within the grid at specified rows and columns, and then set the grid as the child of the window. Using your sample code above, I revised the code to look like the following:
#include <gtk/gtk.h>
static void activate(GtkApplication *app, void *user_data)
{
GtkWidget *window = gtk_application_window_new(app);
GtkWidget *grid = gtk_grid_new();
GtkWidget *label = gtk_label_new("Hello World");
//gtk_window_set_child(GTK_WINDOW(window), gtk_label_new("Hello World!"));
gtk_window_set_default_size (GTK_WINDOW (window), 400, 400);
gtk_grid_set_column_spacing(GTK_GRID(grid),10);
gtk_grid_set_row_spacing(GTK_GRID(grid), 6);
// Create a new button
GtkWidget *button1 = gtk_button_new_with_label ("Press 1");
GtkWidget *button2 = gtk_button_new_with_label ("Press 2");
GtkWidget *button3 = gtk_button_new_with_label ("Press 3");
gtk_grid_attach(GTK_GRID(grid), label, 0, 0, 3, 1);
gtk_grid_attach(GTK_GRID(grid), button1, 0, 1, 1, 1);
gtk_grid_attach(GTK_GRID(grid), button2, 1, 1, 1, 1);
gtk_grid_attach(GTK_GRID(grid), button3, 2, 1, 1, 1);
gtk_window_set_child (GTK_WINDOW (window), grid);
// When the button is clicked, close the window passed as an argument
g_signal_connect_swapped (button1, "clicked", G_CALLBACK (gtk_window_close),
window);
g_signal_connect_swapped (button2, "clicked", G_CALLBACK (gtk_window_close),
window);
g_signal_connect_swapped (button3, "clicked", G_CALLBACK (gtk_window_close),
window);
gtk_window_present(GTK_WINDOW(window));
}
int main(int argc, char *argv[])
{
g_autoptr(GtkApplication) app = gtk_application_new(NULL,
G_APPLICATION_FLAGS_NONE);
g_signal_connect(app, "activate", G_CALLBACK(activate), NULL);
return g_application_run(G_APPLICATION(app), argc, argv);
}
This results in establishing a window with the two additional buttons you wanted. I did not know what type of functions those buttons should trigger, so for my revisions to your sample code, I just hooked the two additional buttons to the same closure signal. Following is a sample of the window when I run the program.
I hope that helps you out.
Regards.
Additional Notes:
Regarding the request as how to add "label2" and then have that label's text updated to "Network Connections", the following additions to your sample program could provide a way to do this.
First, a callback function for updating the new label's text would be added to the program (usually at the beginning of the program).
void on_button1_clicked (GtkLabel *lbl)
{
gtk_label_set_text(lbl, "Network Connections");
}
Then, within the activation function, the new label would be defined.
GtkWidget *label2 = gtk_label_new("");
Next, the new label widget would be added to the grid (in this example, it was added next to the "label" widget in the first row).
gtk_grid_attach(GTK_GRID(grid), label2, 1, 0, 2, 1);
Finally, since the request in the comment was to have the label's text updated to "Network Connections", the signal connection for the first button would be revised to call the new "on_button1_clicked" callback function and passing the "label2" widget instead of the "window" widget.
g_signal_connect_swapped (button1, "clicked", G_CALLBACK (on_button1_clicked), label2);
The result should net the desired behavior.
Hopefully, that addresses your comment.
Regards.
I posted this on the Pi forum but the only answer I received is that I posted it in the wrong place.
Posting on Pi forum
I managed to create a program that will display some buttons and an Image. Now I would like to update the image when a button is clicked. How do I do that?
Here is what I have so far, it all works but missing code to update the displayed image. The 3 second delay before camrea.grab is missing from this code but has been add to the code that I am using.
#include <iostream>
#include <raspicam/raspicam.h>
#include <wiringPi.h>
#include <gtk/gtk.h>
#include <fstream>
#include <vector>
#include <unistd.h>
using namespace std;
void Capture_Image(void){
//camera setup
raspicam::RaspiCam camera; //Camera object
if (!camera.open())
{
cerr << "Could not open the camera" << endl;
//return 1;
}
camera.grab();
std::vector<unsigned char> buf;
buf.resize(camera.getImageTypeSize(raspicam::RASPICAM_FORMAT_RGB));
camera.retrieve(buf.data(), raspicam::RASPICAM_FORMAT_RGB);
std::ofstream outFile("/home/pi/s.jpg", std::ios::binary);
outFile << "P6\n" << camera.getWidth() << " " << camera.getHeight() << " 255\n";
outFile.write((char*)buf.data(), buf.size());
cout << "Image saved to output.ppm" << endl;
}
int main(int argc, char **argv)
{
wiringPiSetup();
gtk_init (&argc, &argv);
//Main Box
GtkWidget *mainBox = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 5);
gtk_container_add (GTK_CONTAINER (win), mainBox);
//camera image container
GtkWidget *cameraBox = gtk_box_new(GTK_ORIENTATION_HORIZONTAL, 5);
gtk_container_add (GTK_CONTAINER (mainBox), cameraBox);
GtkWidget *cameraView = gtk_image_new_from_file("/home/pi/s.jpg");
gtk_box_pack_start (GTK_BOX (cameraBox), cameraView, TRUE, TRUE, 0);
//resize image
GdkPixbuf *pixBuf = gtk_image_get_pixbuf(GTK_IMAGE(cameraView));
pixBuf = gdk_pixbuf_scale_simple(pixBuf, 300,200,GDK_INTERP_BILINEAR);
gtk_image_set_from_pixbuf(GTK_IMAGE(cameraView),pixBuf);
//image capture button
GtkWidget *imageCapture = gtk_button_new_with_label ("Image Capture");
g_signal_connect (imageCapture, "clicked", G_CALLBACK (Capture_Image), NULL);
gtk_box_pack_start (GTK_BOX (cameraBox), imageCapture, TRUE, TRUE, 0);
//show the new window
gtk_widget_show_all (win);
//Start the GTK main loop
gtk_main ();
return 0;
}
I did a lot of research and found the solution.
I updated my function like this
void Capture_Image(GtkWidget *widget, gpointer image){
And added this code in my function after the image was saved.
GtkWidget *cameraView = (GtkWidget *) image;
gtk_image_set_from_file(GTK_IMAGE(cameraView),"/home/pi/s.jpg");
//resize image
GdkPixbuf *pixBufUpdate = gtk_image_get_pixbuf(GTK_IMAGE(cameraView));
pixBufUpdate = gdk_pixbuf_scale_simple(pixBufUpdate, 320,240,GDK_INTERP_BILINEAR);
gtk_image_set_from_pixbuf(GTK_IMAGE(cameraView),pixBufUpdate);
When I call with the button I used this
g_signal_connect (imageCapture, "clicked", G_CALLBACK (Capture_Image), cameraView);
How do you get the text from a gtk entry widget and then convert that to an integer value. Notice in my code I include a wrapper struct called Window that contains pointers to widgets. In the main, I declare an instance of a Window and then build the correct widgets with the appropriate GTK function calls. I then pass that window object to the function that handles the clicked action. I want to then calculate the numerator divided by the denominator in integer format. Below is my attempt. All the code works except for the button_clicked function. Any ideas?
#include <gtk/gtk.h>
#include <stdlib.h>
struct Window
{
GtkWidget *numerator;
GtkWidget *denominator;
GtkWidget *button;
GtkWidget *label;
};
void button_clicked(GtkWidget *widget, gpointer data)
{
Window* w = (Window*)data;
char buf[10];
char buffer[200];
GtkEntry* e = (GtkEntry*)w->numerator;
const gchar* entry1 = gtk_entry_get_text(e);
char* test = (char*)gchar;
int r = atoi(test);
sprintf(buf,"%d",r);
GtkWidget *label = w->label;
gtk_label_set_text(GTK_LABEL(label), buf);
}
int main(int argc, char*argv[])
{
GtkWidget *window;
GtkWidget *table;
Window w;
//Set up my window
gtk_init(&argc,&argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(window), "Division");
gtk_window_set_default_size(GTK_WINDOW(window),500,500);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
//Create my table and add it to the window
table = gtk_table_new(4,2,FALSE);
gtk_container_add(GTK_CONTAINER(window),table);
//Create instances of all my widgets
w.numerator = gtk_entry_new();
w.denominator = gtk_entry_new();
w.button = gtk_button_new_with_label("Click");
w.label = gtk_label_new("result");
//Attack the widgets to the table
gtk_table_attach(GTK_TABLE(table), w.numerator,0,1,0,1,GTK_FILL,GTK_FILL,5,5);
gtk_table_attach(GTK_TABLE(table), w.denominator,0,1,1,2,GTK_FILL,GTK_FILL,5,5);
gtk_table_attach(GTK_TABLE(table), w.button,0,1,2,3,GTK_FILL,GTK_FILL,5,5);
gtk_table_attach(GTK_TABLE(table), w.label,0,1,3,4,GTK_FILL,GTK_FILL,5,5);
//attach the click action to with the button to invoke the button_clicked function
g_signal_connect(G_OBJECT(w.button),"clicked",G_CALLBACK(button_clicked),&w);
g_signal_connect_swapped(G_OBJECT(window),"destroy",G_CALLBACK(gtk_main_quit),NULL);
gtk_widget_show_all(window);
gtk_main();
return 0;
}
If I see this correctly, in your "test code" all you're trying to do is set the label string to the contents of "w->numerator", right?
The line
char* test = (char*)gchar;
looks fishy to me and doesn't even compile, it looks like a typo.
Change the "gchar" to "entry1", and it should do what you want it to.
I have a recommendation for you though: use GtkSpinButton instead of GtkEntry. It is like a custom Entry made for numerical values, and the retrieval of such is many times easier.
problem: I have a Textview with different Texttags in different selected text areas. At the end of editing, i would like to render this multi tagged textbuffer/textview into drawingarea.But I am not getting how can I render multi tagged textview using Pango/cairo layout ?. It would be great if I get any Gtk+/Gtkmm code that shows text drawing.
EX: Lets say My text is "AAABBB" and in this AAA has bold tag set and BBB is non bold and italic set..now how can i render this kind of text ?
Assuming you're looking for a c++ example, check if code below would work for you:
#include <gtk/gtk.h>
static gboolean on_expose_event_0(GtkWidget *widget, GdkEventExpose *event, gpointer data)
{
GdkScreen *screen = gdk_drawable_get_screen(widget->window);
PangoRenderer *renderer = gdk_pango_renderer_get_default (screen);
GdkGC *gc = gdk_gc_new(widget->window);
gdk_pango_renderer_set_drawable(GDK_PANGO_RENDERER (renderer), widget->window);
gdk_pango_renderer_set_gc(GDK_PANGO_RENDERER (renderer), gc);
PangoContext *context = gdk_pango_context_get_for_screen (screen);
PangoLayout *layout = pango_layout_new (context);
pango_layout_set_markup(layout, "<b>AAA</b><i>bbb</i>", -1);
PangoFontDescription *font = pango_font_description_from_string("Times 20");
pango_layout_set_font_description(layout, font);
pango_font_description_free(font);
pango_renderer_draw_layout (renderer, layout, 1, 1);
gdk_pango_renderer_set_drawable(GDK_PANGO_RENDERER (renderer), NULL);
gdk_pango_renderer_set_gc(GDK_PANGO_RENDERER (renderer), NULL);
g_object_unref(layout);
g_object_unref(context);
g_object_unref(gc);
return FALSE;
}
int main( int argc, char *argv[])
{
GtkWidget *window;
gtk_init(&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_widget_add_events (window, GDK_BUTTON_PRESS_MASK);
g_signal_connect(window, "expose-event", G_CALLBACK(on_expose_event_0), NULL);
g_signal_connect(window, "destroy", G_CALLBACK(gtk_main_quit), NULL);
gtk_window_set_position(GTK_WINDOW(window), GTK_WIN_POS_CENTER);
gtk_window_set_title(GTK_WINDOW(window), "pango test");
gtk_window_set_default_size(GTK_WINDOW(window), 400, 300);
gtk_widget_set_app_paintable(window, TRUE);
gtk_widget_show_all(window);
gtk_main();
return 0;
}
There is also an example on using pango with cairo here: Using Pango with Cairo
hope this helps, regards
I'm trying to get the input text from a text box in a callback function when the user changes something it it (on "changed").
The code goes as follow:
#include <stdio.h>
#include <gtk/gtk.h>
void enter_callback( GtkWidget *widget, GtkEditable *buffer)
{
printf("%s",gtk_editable_get_chars(buffer, 0, -1));
}
int main(int argc, char *argv[])
{
GtkWidget *window;
GtkWidget *text;
GtkWidget *table;
gtk_init (&argc, &argv);
window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
table = gtk_table_new (2, 2, TRUE);
gtk_container_add (GTK_CONTAINER (window), table);
text=gtk_text_new(NULL, NULL);
gtk_text_set_editable(text, TRUE);
gtk_signal_connect(GTK_OBJECT(text), "changed", GTK_SIGNAL_FUNC(enter_callback), (GtkEditable*)text);
gtk_table_attach_defaults(GTK_TABLE(table), text, 0, 1, 0, 1);
gtk_container_border_width (GTK_CONTAINER (window), 40);
gtk_window_set_default_size (GTK_WINDOW(window), 640, 200);
gtk_widget_show(text);
gtk_widget_show(window);
gtk_widget_show(table);
gtk_main();
return 0;
}
The code compiles just right, I'm compiling it on Code::Blocks on debug, checking output on the console by printf. The problem is I get <NULL> as a callback everytime I change something on the textbox. How can I get the correct output?
SOLUTION:
As noted by Washu, gtk_text is deprecated and gtk_text_view should be used instead.
According to the GTK documentation, GtkText is deprecated, buggy, and should not be used. You should instead be using the GtkTextView widget via gtk_text_view_new.
You can use GtkEntry widget too. And use gtk_entry_get_text () (which return const gchar * value) that to get text from GtkEntry, for instance.