How can I display, with scrolling, an RGBA numpy array image in PyQt4?

Question

I would like to display, in my custom window, two images in PyQt4. In the left side, a source image. In the right side, a transformed -transformation will be pixel-wise - image. The images will be in RGBA format loaded by PIL(low), and for numpy ( scipy.ndimage.imread ).

Both images have the same size (since the transformed image will be generated from the source image), and both displays will have the same size (independent of the image size):

• If the image width is lower than display's, the image will be left-centered in the display. If it is greater, I need a scroll for the source display.
• An analogous criterion for height, top-centered, and vertical scroll bars.
• If I scroll in the source display, the transformed's display will scroll as well, but the transformed's display will not have scrollbars.

Question : What component could I use to display an image with inner scrolling capabilities ? (I will be happy with the component name, and some guidelines; code would be appreciated but the main concept is the important thing for the answer).

Answer 1

There are several solutions. If you just want to create the numpy "image" once and then display it, and it's not too big (or you don't care about memory), you can simply convert it to a QPixmap and display that in a viewport: Convert numpy array to PySide QPixmap

    self.imageLabel = QtGui.QLabel()
    self.imageLabel.setBackgroundRole(QtGui.QPalette.Base)
    self.imageLabel.setSizePolicy(QtGui.QSizePolicy.Ignored,
            QtGui.QSizePolicy.Ignored) # not sure about this one.
    self.imageLabel.setPixmap(...pixmap here...)

    self.scrollArea = QtGui.QScrollArea()
    self.scrollArea.setBackgroundRole(QtGui.QPalette.Dark)
    self.scrollArea.setWidget(self.imageLabel)

(taken from http://ftp.ics.uci.edu/pub/centos0/ics-custom-build/BUILD/PyQt-x11-gpl-4.7.2/examples/widgets/imageviewer.py )

If the image is too big, then you can add a paint hook. In the hook, get the visible part of the QScrollArea (the viewport), turn just this into a pixmap and render it.

The same is true when the numpy array changes all the time. You need to trigger a refresh when the array has been updated. Qt will then call the paint hook and the new content will become visible.