How to make a SVG at tab Widget ?

[RiceBall]

@RiceBall said in How to make a SVG at tab Widget ?:

@Pradeep-P-N said in How to make a SVG at tab Widget ?:

@RiceBall said in How to make a SVG at tab Widget ?:

'QGraphicsScene' to ' QGraphicsScene *'"

Please try ui->graphicView->setScene(&scene);

I success to show it finally.
Thanks @jsulm @Pradeep-P-N @mrjj help.

Key Point
.pro

QT       += svg 

final code

    QGraphicsScene *scene = new QGraphicsScene;
    scene->addWidget(new QSvgWidget("../untitled6/splash1.svg"));
    scene->addWidget(new QSvgWidget("../untitled6/splash2.svg"));

    ui->graphicsView->setScene(scene);

Hello every one
I meet a new easy problem.
How could I define the scene size & transparent....?

[Pradeep P N]

Hi @RiceBall

Scene size please check minimumRenderSize.

QWidget has an option to set the windowOpacity.

Below is sample code for defining the size and transparency...

QGraphicsView *gView = new QGraphicsView(this);
QGraphicsScene *scene = new QGraphicsScene;

QSvgWidget *svgWid = new QSvgWidget(":/Freesample.svg");
svgWid->setWindowOpacity(0.5); // Change as needed
scene->addWidget(svgWid);

gView->resize(350, 350);
gView->setScene(scene);

Output:

Opacity : 0.5

Without Opacity:

All the best.

[RiceBall]

@Pradeep-P-N said in How to make a SVG at tab Widget ?:

Hi @RiceBall

Scene size please check minimumRenderSize.

QWidget has an option to set the windowOpacity.

Below is sample code for defining the size and transparency...

QGraphicsView *gView = new QGraphicsView(this);
QGraphicsScene *scene = new QGraphicsScene;

QSvgWidget *svgWid = new QSvgWidget(":/Freesample.svg");
svgWid->setWindowOpacity(0.5); // Change as needed
scene->addWidget(svgWid);

gView->resize(350, 350);
gView->setScene(scene);

Output:

Opacity : 0.5

Without Opacity:

All the best.

Thank you for your answer.
I have some problem.

1. I can't loading several SVG. If I loading several file. It just only show last one.
2. I use UI screen to set background-color:black. And I am sure my SVG is none background color.
   But when I loading it . It always show white background.

Result

    QSvgWidget * svgWid1 = new QSvgWidget("../iHMI_2/splash1.svg");
    QSvgWidget * svgWid2 = new QSvgWidget("../iHMI_2/splash2.svg");
    QSvgWidget * svgWid3 = new QSvgWidget("../iHMI_2/splash3.svg");
    QSvgWidget * svgWid4 = new QSvgWidget("../iHMI_2/splash4.svg");

    QGraphicsScene *scene = new QGraphicsScene;

    scene->addWidget(svgWid1);
    scene->addWidget(svgWid2);
    scene->addWidget(svgWid3);
    scene->addWidget(svgWid4);

    ui->graphicsView->setScene(scene);

[jsulm]

@RiceBall said in How to make a SVG at tab Widget ?:

I can't loading several SVG. If I loading several file. It just only show last one.

Is the code at the bottom of your post the one you're using to load SVGs? Maybe they are simply all at same position, so you only see the last one?

[RiceBall]

@jsulm said in How to make a SVG at tab Widget ?:

@RiceBall said in How to make a SVG at tab Widget ?:

I can't loading several SVG. If I loading several file. It just only show last one.

Is the code at the bottom of your post the one you're using to load SVGs? Maybe they are simply all at same position, so you only see the last one?

No. They are at different position.
It looks like below.

[Pradeep P N]

Hi @RiceBall
Can you please create the CustomWidget inheriting from QWidget with Some Layout in it to align the SVG contents.

// Please customize the Class as per your requirement.
// I just provided some dummy sample code.

Example:
class CustomWidget : public QWidget

    QGridLayout *glyt = new QGridLayout;

    QSvgWidget *svgWid1 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid2 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid3 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid4 = new QSvgWidget(":/Freesample.svg");

    glyt->addWidget(svgWid1);
    glyt->addWidget(svgWid2);
    glyt->addWidget(svgWid3);
    glyt->addWidget(svgWid4);

    this->setLayout(glyt);

Then use the CustomWidget as

    CustomWidget *csw = new CustomWidget;

    scene->addWidget(csw);

Output:

Might help you.

All the best.

[RiceBall]

@Pradeep-P-N said in How to make a SVG at tab Widget ?:

Hi @RiceBall
Can you please create the CustomWidget inheriting from QWidget with Some Layout in it to align the SVG contents.

// Please customize the Class as per your requirement.
// I just provided some dummy sample code.

Example:
class CustomWidget : public QWidget

    QGridLayout *glyt = new QGridLayout;

    QSvgWidget *svgWid1 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid2 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid3 = new QSvgWidget(":/Freesample.svg");
    QSvgWidget *svgWid4 = new QSvgWidget(":/Freesample.svg");

    glyt->addWidget(svgWid1);
    glyt->addWidget(svgWid2);
    glyt->addWidget(svgWid3);
    glyt->addWidget(svgWid4);

    this->setLayout(glyt);

Then use the CustomWidget as

    CustomWidget *csw = new CustomWidget;

    scene->addWidget(csw);

Output:

Might help you.

All the best.

Sorry, I never use that.
Your meaning is I create a new class at mainwindow.h ??

class CustomWidget : public QWidget
{}

where can I code it ?mainwindow.h or mainwindow.cpp

QGridLayout *glyt = new QGridLayout;

   QSvgWidget *svgWid1 = new QSvgWidget("../iHMI_2/splash1.svg");
   QSvgWidget *svgWid2 = new QSvgWidget("../iHMI_2/splash2.svg");
   QSvgWidget *svgWid3 = new QSvgWidget("../iHMI_2/splash3.svg");
   QSvgWidget *svgWid4 = new QSvgWidget("../iHMI_2/splash4.svg");

   glyt->addWidget(svgWid1);
   glyt->addWidget(svgWid2);
   glyt->addWidget(svgWid3);
   glyt->addWidget(svgWid4);

   this->setLayout(glyt);

[jsulm]

@RiceBall said in How to make a SVG at tab Widget ?:

where can I code it ?mainwindow.h or mainwindow.cpp

in customwidget.h + customwidget.cpp...

[RiceBall]

@jsulm said in How to make a SVG at tab Widget ?:

@RiceBall said in How to make a SVG at tab Widget ?:

where can I code it ?mainwindow.h or mainwindow.cpp

in customwidget.h + customwidget.cpp...

So I create new customwidget.h & customwidget.cpp
And coding like below.
Is it right ??
Because at mainwindow.cpp it show "use of undeclared identifier 'scene'".

customwidget.h

#ifndef CUSTOMWIDGET_H
#define CUSTOMWIDGET_H
#include <QWidget>

class customwidget : public QWidget
{
    Q_OBJECT
public:
    explicit customwidget(QWidget *parent = nullptr);
signals:
public slots:
};

#endif // CUSTOMWIDGET_H

customwidget.cpp

#include "customwidget.h"
#include <QGridLayout>
#include <QSvgWidget>


customwidget::customwidget(QWidget *parent) : QWidget(parent)
{
    QGridLayout *glyt = new QGridLayout;
    
       QSvgWidget *svgWid1 = new QSvgWidget("../iHMI_2/splash1.svg");
       QSvgWidget *svgWid2 = new QSvgWidget("../iHMI_2/splash2.svg");
       QSvgWidget *svgWid3 = new QSvgWidget("../iHMI_2/splash3.svg");
       QSvgWidget *svgWid4 = new QSvgWidget("../iHMI_2/splash4.svg");
    
       glyt->addWidget(svgWid1);
       glyt->addWidget(svgWid2);
       glyt->addWidget(svgWid3);
       glyt->addWidget(svgWid4);
    
       this->setLayout(glyt);
}

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QLabel>
#include "customwidget.h"


//#include <QGraphicsScene>
//#include <QGraphicsView>
//#include <QtSvg/QSvgWidget>
//#include <QMovie>
//#include <QPixmap>


MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    CustomWidget *csw = new CustomWidget;
    scene->addWidget(csw);

[RiceBall]

@Pradeep-P-N
Is this your meaning like above reply?

[mrjj]

@RiceBall
Hi
Yes, he meant to make such a custom class.

However, in MainWindow, you just use a scene which is undefined. (or did u add it as member ?)
You should at least do
QGraphicsScene *scene = new QGraphicsScene;
first.

[Pradeep P N]

Hi @RiceBall
Sorry was bit busy, Yes follow below instructions.

• Create a Class inheriting from QWidget (Example as above code class CustomWidget : public QWidget)
• Use the QLayout Class options available (Use whichever suitable to your UI Arrangement)
• Once you have the CustomeWidget ready you can use this Class as the widget for Graphics Scene

QGraphicsScene *scene = new QGraphicsScene
CustomWidget *csw = new CustomWidget;
scene->addWidget(csw);

• Optimize your code and you can achieve the result you are looking for.

All the best.

[RiceBall]

@mrjj
@Pradeep-P-N said in How to make a SVG at tab Widget ?:

QGraphicsScene *scene = new QGraphicsScene

I try to fix code and test it.
But I can see it loading something but is white.

    ui->setupUi(this);
    CustomWidget *csw = new CustomWidget;
    QGraphicsScene *scene = new QGraphicsScene;
    scene->addWidget(csw);
    ui->graphicsView->setScene(scene);

[jsulm]

@RiceBall said in How to make a SVG at tab Widget ?:

QSvgWidget *svgWid1 = new QSvgWidget("../iHMI_2/splash1.svg");
QSvgWidget *svgWid2 = new QSvgWidget("../iHMI_2/splash2.svg");
QSvgWidget *svgWid3 = new QSvgWidget("../iHMI_2/splash3.svg");
QSvgWidget *svgWid4 = new QSvgWidget("../iHMI_2/splash4.svg");

You're using relative paths: did you make sure the files are actually found at runtime?

[RiceBall]

@jsulm said in How to make a SVG at tab Widget ?:

@RiceBall said in How to make a SVG at tab Widget ?:

QSvgWidget *svgWid1 = new QSvgWidget("../iHMI_2/splash1.svg");
QSvgWidget *svgWid2 = new QSvgWidget("../iHMI_2/splash2.svg");
QSvgWidget *svgWid3 = new QSvgWidget("../iHMI_2/splash3.svg");
QSvgWidget *svgWid4 = new QSvgWidget("../iHMI_2/splash4.svg");

You're using relative paths: did you make sure the files are actually found at runtime?

I changed to the absolute path.
The problem is the same.
Does it have any possible I coding wrong ??

[jsulm]

@RiceBall You can also check this:

• Get the renderer from the SVG widget using https://doc.qt.io/qt-5/qsvgwidget.html#renderer
• Check what https://doc.qt.io/qt-5/qsvgrenderer.html#isValid returns

And also call show() on each SVG widget you're creating.

[RiceBall]

@jsulm said in How to make a SVG at tab Widget ?:

@RiceBall You can also check this:

• Get the renderer from the SVG widget using https://doc.qt.io/qt-5/qsvgwidget.html#renderer
• Check what https://doc.qt.io/qt-5/qsvgrenderer.html#isValid returns

And also call show() on each SVG widget you're creating.

How could I use it ??
Can you make a sample for me ??
Thank you.

[jsulm]

@RiceBall said in How to make a SVG at tab Widget ?:

How could I use it ??

Come on, what's difficult about it?!

svgWid1->show();
...
qDebug() << svgWid1->renderer()->isValid();

[RiceBall]

@jsulm said in How to make a SVG at tab Widget ?:

@RiceBall said in How to make a SVG at tab Widget ?:

How could I use it ??

Come on, what's difficult about it?!

svgWid1->show();
...
qDebug() << svgWid1->renderer()->isValid();

Sorry to ask too much easily question.
Because I just started learning QT and C++.
So some documents are difficult for me.

I try to add code like you writing at customwidget.cpp
But I can't see any different.

[jsulm]

@RiceBall OK, no problem.
The second line should print something to the console - what do you see there ("Application Output" tab in QtCreator)?