CODEWITHSUNDEEP
qtqml
Smallforest
Smallforest

Reputation: 79

Using QML with a qt widgets type of ui form?

So I would like to create an Application which looks something like this:

click here

What this application does is, I can select shapes through the combobox on the left and put them on the Area to the right. With the slider I can vary the sizes. The checkboxes select a border or make the shape have a filling color.

My Problem is I would like to create these shapes through using QML, as its relatively easy to create such basic shapes with rectangle, circle etc. ,however I would also like to have the nice interface seen on the left. Is this possible with QML only or do I need to integrate QML into qtwidgets or something like that? I know that there is a slider and a button also present in QML, which look perfectly fine but I would like to have a clear area on the right which indicates to the user where he can create shapes and the ui stuff on the left. What is the correct approach here?

Upvotes: 3

Views: 2189

Answers (2)

Evan
Evan

Reputation: 2556

I highly recommend using QML for the entire UI. Firstly, Qt Quick and QWidgets are completely different UI engines. I find markup based UI easier to source control, adjust, and generally work with. Furthermore, Qt Quick and QML is the best UI framework I've ever used, and there have been many. You can easily do everything you want.

Upvotes: 0

kzsnyk
kzsnyk

Reputation: 2211

For the drawing part of your app, using QGraphicsScene https://doc.qt.io/qt-5/qgraphicsscene.html could also be an alternative to stay with Qt Widget instead of mixing it with QML.

But if you want to stick with QML you can look at QQuickView https://doc.qt.io/qt-5/qquickview.html and here is a small example of integration :

#include <QQuickView>
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    // ..

    QQuickView *view = new QQuickView;
    QWidget *container = QWidget::createWindowContainer(view, this);

    // some set up if needed
    container->setMinimumSize(1280, 600);
    container->setMaximumSize(1280, 600);
    container->setFocusPolicy(Qt::TabFocus);

    // ..

    view->setSource(QUrl("main.qml"));
    view->setResizeMode(QQuickView::SizeViewToRootObject);

    ui->verticalLayout->addWidget(container);

    // ..

}

Upvotes: 0

Related Questions