I would like to put an svg image as background to my QGraphicsView without repetition and preserving the ratio. Can you help me? Thanks.
Asked
Active
Viewed 516 times
-1
-
1What have you tried so far? – Marek R Mar 15 '22 at 16:28
-
It depends on you want to add one `svg` as your Items means that you want it as one Item in your scene, or just you want to set it as the background image. I create an example for you. If you want to set the image as background in one widget it doesn't matter its `normal Qwidget or QGraphicsView` you can use `stylesheet` – Parisa.H.R Mar 15 '22 at 18:32
-
Try this https://stackoverflow.com/a/18024055/6894386 . this code will add images to QGraphicsView. – 8-DK Mar 15 '22 at 18:45
-
@MarekR The last thing I tried was to just put a setBackgroundBrush(myPath) but my image is split in 4. The top left part of the image ends up in the bottom right, I don't understand why. – tyler Mar 17 '22 at 17:01
2 Answers
1
This is one Example :
First of all add QT += svgwidgets
in your .pro
.
then add one graphicsView
in your UI
File :
in mainwindow.h:
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QGraphicsScene>
#include <QMainWindow>
QT_BEGIN_NAMESPACE
namespace Ui
{
class MainWindow;
}
QT_END_NAMESPACE
class MainWindow: public QMainWindow
{
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
Ui::MainWindow *ui;
QGraphicsScene *scene;
};
#endif // MAINWINDOW_H
in mainwindow.cpp:
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QGraphicsSvgItem>
#include <QSvgRenderer>
MainWindow::MainWindow(QWidget *parent):
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);
scene = new QGraphicsScene(this);
ui->graphicsView->setScene(scene);
QGraphicsSvgItem *item = new QGraphicsSvgItem(":/images/images/diagramTool.svg");
scene->addItem(item);
}
MainWindow::~MainWindow()
{
delete ui;
}
output :
And there is one easy way you can add this stylesheet in your graphics view :
background-image: url(":/images/images/diagramTool.svg");
background-repeat: no-repeat;
background-position: center;
border-style:none;
This will add SVG
as your background image.

Parisa.H.R
- 3,303
- 3
- 19
- 38
-
Thanks, that's works but if my QGraphicsView changes size the image does not follow. – tyler Mar 17 '22 at 14:33
-
@tyler you should use Layout, look at this doc [Layout Management](https://doc.qt.io/qt-5/layout.html) – Parisa.H.R Mar 18 '22 at 03:01
-
0
To put a background that fits the size of the object I created a class that inherits from QGraphicsScene and I rewrote drawBackground by putting my svg image in it. myscene.h
class myscene : public QGraphicsScene
{
public:
myscene();
~myscene();
void drawBackground(QPainter *painter, const QRectF &rect);
};
myscene.cpp
myscene::myscene():QGraphicsScene()
{
}
myscene::~myscene()
{
}
void myscene::drawBackground(QPainter *painter, const QRectF &rect)
{
painter->drawImage(rect, QImage(":myPathImage.svg"));
}
Then in my QGraphicsView I passed it this scene and it works. myview.h:
class myview : public QGraphicsView
{
private :
myscene* _scene;
public:
myview();
~myview();
};
myview.cpp:
myview::myview() : QGraphicsView()
{
_scene = new myscene();
this->setScene(_scene);
this->showMaximized();
}
myview::~myview()
{
delete _scene;
}

tyler
- 13
- 6
-
As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Mar 18 '22 at 13:46
-