Jim
Jim

Reputation: 530

Automatic image scaling on resize with (Py)GTK

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 am sorry for the long explanation of such a trivial problem, I hope you'll be able to help me.

Upvotes: 6

Views: 9199

Answers (3)

K3---rnc
K3---rnc

Reputation: 7049

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.

Upvotes: 2

adlo
adlo

Reputation: 63

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.

Upvotes: 2

serge_gubenko
serge_gubenko

Reputation: 20492

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

Upvotes: 10

Related Questions