PDA

View Full Version : Image rendering and zooming (QGraphicsView)



Sergex
5th October 2011, 15:46
Hello,

I am currently displaying audio waveforms and spectrograms in my app and I need to be able to zoom in and out of these images and have the best possible resolution in each level of zoom. For the display I am using the Qt Graphics Framework.

I am a bit lost on how to approach this problem, I think that I have to keep several images of different zoom levels in memory and change them according to how much I zoom in ..? What is the proper way of tackling this issue?

Any guidance or tips for what would be the best Qt tools or methods to use to get started I would really appreciate it!

Thanks.

dennis81
5th October 2011, 16:56
use this in MygraphicsItem::paint() method.
qreal levelOfDetail = QStyleOptionGraphicsItem::levelOfDetailFromTransfo rm(painter->transform());

if(levelOfDetail <= 0.5)
{
drawMyLowResImage();
}
else
{
drawMyHighResImage();
}


You only need to draw the visible part of your image.
const QRectF& rect = option->exposedRect;

painter->transform() corresponds to your qgraphicsView zoomLevel.

woodtluk
5th October 2011, 17:31
Maybe QGraphicsView::scale(qreal sx, qreal sy) can help.

Sergex
5th October 2011, 18:16
Maybe QGraphicsView::scale(qreal sx, qreal sy) can help.

Well scale is what I was using at first to zoom in and out, but that just scales an image so when zoomed in, the image is very pixelated especially at high zoom levels. So I'm looking for a way to
change the image to a better resolution one after it hits a certain level of zoom, and so on for several levels (and then back when zooming out). For now I am just zooming in width so for example
after a zoom I want to just have a higher resolution image of just the exposed part of the image.

pkj
5th October 2011, 18:19
You need Scalable Vector Graphics(SVG) format images. Normal images will become pixelated at high zoom levels. Qt supports svg images too.

Sergex
5th October 2011, 18:19
use this in MygraphicsItem::paint() method.
qreal levelOfDetail = QStyleOptionGraphicsItem::levelOfDetailFromTransfo rm(painter->transform());

if(levelOfDetail <= 0.5)
{
drawMyLowResImage();
}
else
{
drawMyHighResImage();
}


You only need to draw the visible part of your image.
const QRectF& rect = option->exposedRect;

painter->transform() corresponds to your qgraphicsView zoomLevel.

Thanks! That gives me some ideas, as of now when my graphicsItem was created I was passing the image as a parameter to the graphicsItem. But will try some things with this idea, thanks.

Sergex
6th October 2011, 00:16
You need Scalable Vector Graphics(SVG) format images. Normal images will become pixelated at high zoom levels. Qt supports svg images too.

Is it possible to transform my Images into Svg format somehow ? That definitely would be better as of now the images are Indexed8 kind. Thanks for the tip!

dennis81
6th October 2011, 13:51
It would be easier render the waveforms as QPolygonItems.
Converting raster images into vector images is problematic.


Could you upload a screen shot?