Automatic image scaling on resize with (Py)GTK

Question

I have a GtkImage widget in a resizable window and a reference GdkPixBuf storing the image I want to fill the GtkImage with.

I can scale the GdkPixBuf to fill the GtkImage widget using this method:

def update_image(self, widget=None, data=None):
    # Get the size of the source pixmap
    src_width, src_height = self.current_image.get_width(), self.current_image.get_height()

    # Get the size of the widget area
    widget = self.builder.get_object('image')
    allocation = widget.get_allocation()
    dst_width, dst_height = allocation.width, allocation.height

    # Scale preserving ratio
    scale = min(float(dst_width)/src_width, float(dst_height)/src_height)
    new_width = int(scale*src_width)
    new_height = int(scale*src_height)
    pixbuf = self.current_image.scale_simple(new_width, new_height, gtk.gdk.INTERP_BILINEAR)

    # Put the generated pixbuf in the GtkImage widget
    widget.set_from_pixbuf(pixbuf)

When I call update_image manually it works as expected. Now I want the scaling to occur automatically when the GtkImage widget is resized. The best solution I came with was to bind the update_image method to the configure-event GTK event of the window. After each size change of the window, the image is indeed properly scaled. However I have two issues with this solution:

I can only make the window bigger. Once the image has been upscaled, GTK won't let me resize the window smaller because the window can't be smaller than its widgets. I understand why it works like that but I don't know how to change this behaviour.
Maybe this is no big deal but I would have preferred an event from the GtkImage widget instead of the top-level window.

I am sorry for the long explanation of such a trivial problem, I hope you'll be able to help me.

score 10 · Accepted Answer · answered Feb 09 '11 at 04:27

I believe you could use expose-event signal of the widget for image scaling. Also adding image into scrollable container should fix the problem with window resize. Please check if an example below would work for you.

import gtk

class ScaleImage:
    def __init__(self):
        self.temp_height = 0
        self.temp_width = 0

        window = gtk.Window(gtk.WINDOW_TOPLEVEL)

        image = gtk.Image()
        image.set_from_file('/home/my_test_image.jpg')
        self.pixbuf = image.get_pixbuf()
        image.connect('expose-event', self.on_image_resize, window)    

        box = gtk.ScrolledWindow()
        box.set_policy(gtk.POLICY_AUTOMATIC, gtk.POLICY_AUTOMATIC)
        box.add(image)

        window.add(box)
        window.set_size_request(300, 300)
        window.show_all()        

    def on_image_resize(self, widget, event, window):
        allocation = widget.get_allocation()
        if self.temp_height != allocation.height or self.temp_width != allocation.width:
            self.temp_height = allocation.height
            self.temp_width = allocation.width
            pixbuf = self.pixbuf.scale_simple(allocation.width, allocation.height, gtk.gdk.INTERP_BILINEAR)
            widget.set_from_pixbuf(pixbuf)

    def close_application(self, widget, event, data=None):
        gtk.main_quit()
        return False

if __name__ == "__main__":
    ScaleImage()
    gtk.main()

hope this helps, regards

Thanks a lot, the ScrolledWindow trick worked. I get a `GtkWarning: gtk_scrolled_window_add(): cannot add non scrollable widget use gtk_scrolled_window_add_with_viewport() instead` but if I add a viewport then scrollbars appear when I am reducing the size of the window so I'll leave it like that for now. The `expose-event` is called on each gtk iteration so it maxed the cpu usage. — Jim, Feb 11 '11 at 01:12
This answer seems to be outdated with GTK+ 3: https://stackoverflow.com/a/49754093/6094756 — piegames, Apr 20 '20 at 22:14

K3---rnc · Answer 2 · 2020-08-18T23:43:56.330

2

All widgets have size-allocate (cf. PyGObject Gtk3) signal.

The "size-allocate" signal is emitted when widget is given a new space allocation.

Perhaps you can use that.

edited Aug 18 '20 at 23:43

answered Aug 30 '14 at 23:30

K3---rnc

6,717
3
31
46

I used the `"configure-event"` signal in C before, which didn't work properly for this purpose. Now with `"size-allocate"` I have no more problems. – Hamburg is nice Sep 20 '18 at 13:21

adlo · Answer 3 · 2016-01-26T20:50:55.223

If you don't want to use a GtkScrolledWindow, you can replace your GtkImage with a GtkDrawingArea instead, and then draw your image using Cairo. This will allow the images to shrink, because GtkDrawingArea does not set a size request.

I don't know about Python, but here is an example in C using GTK3:

gboolean drawing_area_draw (GtkWidget *widget, cairo_t *cr, GdkPixbuf *current_image)
{

    .....   //Calculate size

    pixbuf = gdk_pixbuf_scale_simple (current_image,
                                    new_width,
                                    new_height,
                                    GDK_INTERP_BILINEAR);

    gdk_cairo_set_source_pixbuf (cr, 
                                pixbuf,
                                allocation.width/2 - new_width/2, 
                                allocation.height/2 - new_height/2);
    cairo_paint (cr);

    return FALSE;
}

int main (int argc, char *argv[])
{
    .....

    drawing_area = gtk_drawing_area_new ();
    g_signal_connect (G_OBJECT (drawing_area), "draw",
            G_CALLBACK (drawing_area_draw), current_image);

    .....
}

If the drawing area's background appears opaque, set gtk_widget_set_has_window () to FALSE, though it's probably better to derive your own widget from GtkDrawingArea and set this property in its init function.

If you're using GTK2, the code is similar, except that you have to call gdk_cairo_create () on widget->window and call cairo_destroy () when you're finished.

Also, with GTK2, if the GtkDrawingArea doesn't have its own GdkWindow, the coordinates for drawing are relative to the parent GdkWindow rather than the widget.

Automatic image scaling on resize with (Py)GTK

3 Answers3

Linked