qt5 creator + designer: super simple graphic examples

[Sisor]

Um es einfach zu halten würde ich in QML schreiben. Dann schreibst du sowas:
https://doc.qt.io/archives/qt-5.5/qt...ircle-qml.html

Wenn du es hart willst:
QPainter ist ein Cpp-QObject. Willst du das in QML einbinden, solltest du das hier gelesen haben:
qml-cpp integration
Du müsstest eine Klasse vom QWidget ableiten, mit Q_PROPERTYs zur Steuerung versehen, den Zeichnen-Code in der Write/Setter-Methode triggern und als QML_ELEMENT markieren.
Das kannst du dann im QML-Code verwenden.

Viel Erfolg!

[HaWe]

ich brauche es in meinem C++ Programm, in meiner speziell designten Form, weil auch alles an GPIO i/o , ADC, I2C und UART samt Datenverarbeitung in C++ programmiert ist.
Mir fehlt aber die Kenntnis, wie man genau mit QPainter geometrische Figuren zeichnet, und zwar im Hauptprogramm, und dann nicht in irgendein extra Fenster sondern genau in die dafür eingefügte canvas widget meiner qt GUI form.
Kurz:
Ich brauche ein lauffähiges Programm für den qtcreator mit einer mainwindow.ui Datei.

[Sisor]

Nagut, das geht dann so:
Die Dateien mywidget.h

#ifndef MYWIDGET_H
#define MYWIDGET_H

#include <QWidget>

class MyWidget : public QWidget
{
    Q_OBJECT

public:
    explicit MyWidget(QWidget *parent = nullptr);

    QSize minimumSizeHint() const override;
    QSize sizeHint() const override;

protected:
    void paintEvent(QPaintEvent *event) override;
};

#endif // MYWIDGET_H

und
mywidget.cpp

#include "mywidget.h"

#include <QPainter>
#include <QPainterPath>

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
{
    this->setEnabled(true);
    setBackgroundRole(QPalette::Base);
    setAutoFillBackground(true);
    this->update();
}

QSize MyWidget::minimumSizeHint() const
{
    return QSize(100, 100);
}

QSize MyWidget::sizeHint() const
{
    return QSize(400, 200);
}

void MyWidget::paintEvent(QPaintEvent * /* event */)
{
    QRect rect(10, 20, 80, 60);

    QPainterPath path;
    path.moveTo(20, 80);
    path.lineTo(20, 30);
    path.cubicTo(80, 0, 50, 50, 80, 80);

    QPainter painter(this);
    painter.setPen(QPen(Qt::blue,10));

    for (int x = 0; x < width(); x += 100) {
        for (int y = 0; y < height(); y += 100) {
            painter.save();
            painter.translate(x, y);
            painter.drawLine(rect.bottomLeft(), rect.topRight());
            painter.restore();
        }
    }

    painter.setRenderHint(QPainter::Antialiasing, false);
    painter.setPen(palette().dark().color());
    painter.setBrush(Qt::NoBrush);
    painter.drawRect(QRect(0, 0, width() - 1, height() - 1));
}

dem Projekt hinzufügen.
Im Designer ein Widget (heisst genau so!) einfügen und Größe nach belieben anpassen. Rechtsklick->Als Platzhalter für benutzerdefinierte Klasse festlegen.
Dort QWidget als Basisklasse und MyWidget als Klassennamen angeben.
Kompilieren, fertig.

[HaWe]

ein "Widget" finde ich nicht,
in der Sektion "Display Widgets" neben "Labels" etc. nur
OpenGL widget
Graphics_View widget
QuickWidget

das 1. und das 3. fallen weg, also bleibt hier nur Graphics_View Widget.
Das Graphics_View widget kann ich im Designer in die Form drag-en,
dort wird es dann in mainwindow.ui gelistet:

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>474</width>
    <height>411</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralWidget">
   <widget class="QPushButton" name="pushButton1">
    <property name="geometry">
     <rect>
      <x>180</x>
      <y>300</y>
      <width>101</width>
      <height>31</height>
     </rect>
    </property>
    <property name="text">
     <string>Quit</string>
    </property>
   </widget>
   <widget class="QGraphicsView" name="graphicsView">
    <property name="geometry">
     <rect>
      <x>10</x>
      <y>10</y>
      <width>451</width>
      <height>271</height>
     </rect>
    </property>
   </widget>
  </widget>
  <widget class="QMenuBar" name="menuBar">
   <property name="geometry">
    <rect>
     <x>0</x>
     <y>0</y>
     <width>474</width>
     <height>34</height>
    </rect>
   </property>
  </widget>
  <widget class="QToolBar" name="mainToolBar">
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
  </widget>
  <widget class="QStatusBar" name="statusBar"/>
  <widget class="QToolBar" name="toolBar">
   <property name="windowTitle">
    <string>toolBar</string>
   </property>
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
  </widget>
  <action name="action">
   <property name="text">
    <string/>
   </property>
  </action>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <resources/>
 <connections>
  <connection>
   <sender>pushButton1</sender>
   <signal>clicked()</signal>
   <receiver>MainWindow</receiver>
   <slot>close()</slot>
   <hints>
    <hint type="sourcelabel">
     <x>234</x>
     <y>171</y>
    </hint>
    <hint type="destinationlabel">
     <x>260</x>
     <y>229</y>
    </hint>
   </hints>
  </connection>
 </connections>
</ui>

Der .ui file wird automatisch vom creator generiert und kann/darf auch nicht manuell geändert werden.

Für spätere Zwecke ist es auch ganz entscheidend, dass ich alle widgets vom Designer /Creator aus in meine Form ziehen und dort platzieren, ändern, und weitere Eigenschaften (event slots) zufügen kann: daher scheiden manuell definierte widgets aus.


Ich weiß nicht, wo ich im Designer stattdessen eine andere Canvas widget finden kann als diese.
Falls es tatsächlich irgendwo ein "Widget" in der IDE-Liste gibt: wo ist das abgelegt?

Das einfügen von extra libs ist auch schwierig, weil ich die immer kompliziert im .pro file mit verlinken muss, kann ich nicht deinen .cpp code als Text einfach komplett als Code in meine mainwindow.cpp mit einfügen?

Und dann deinen Code wie anpassen, dass er mit dem Graphics_View widget zusammen funktioniert (oder einem anderen aus der Creator/Designer-Liste)?


PS:
hier ist nochmal der Link zu meinem qt creator project (nackte canvas plus Quit button):
https://github.com/dsyleixa/qt_paint...r/qt_btn_paint

Vielleicht kannst du ja mal mein Projekt downloaden/kopieren und meinen .pro file in deinen qt Creator laden...

[Sisor]

Also bei mir funktionierts. Das Widget ist in der Widget-Box (links im Designer) unter Containers eingeordnet. Das dient nur als Platzhalter für das selbstdefinierte MyWidget.
Wenn du die kurze Anleitung von mir durchführst, kommst du drauf, dass selbstdefinierte Widgets sehr wohl im Designer funktionieren. Ich wüsste auch nicht wie du dein Problem anders lösen solltest.

designer - using custom widgets

[HaWe]

ah, nicht unter DisplayWidgets, sondern unter Containers - ok, danke, habe es gefunden.
Habe auch deine mywidget.h und deine mywidget.cpp Datei ins Arbeitsverzeichnis kopiert.

wie füge ich sie jetzt dem Projekt hinzu? habe ich bisher noch nie gemacht ...
(deshalb wäre mir ein Code direkt in mainwindow.cpp auch viel lieber)

Und wie rufe ich dann eine Zeichen-Routine in meinem mainwindow.cpp auf?

dadurch, dass ich nur oben mit dazu schreibe
#include "mywidget.h"

passiert nichts, nach Compile +Starten sieht man nur meinen Quit Button, sonst nichts (auch keinen Rahmen vom "Widget")...


mainwindow.cpp :

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include "mywidget.h"



MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //
    //....: hier soll der komplette Code für die paint-Funktionen rein!
    //....  evt. auch über eine lokale Funktion hier im mainwindow.cpp file
    //
}

MainWindow::~MainWindow()
{ 
    delete ui;
}



void MainWindow::on_pushButton1_clicked()
{ 
    QCoreApplication::quit();
}

[Sisor]

Für mein Beispiel ist kein händisches #include notwendig. Schau rechts im Objekt-Fenster, ob das Widget von der Klasse MyWidget ist. Wenn nicht, hat was mit dem Platzhalter-Zeugs nicht funktioniert (Rechtsklick ins Widget im Designer). Wenn's geklappt hat findest du in der .pro-Datei den Eintrag mywidget.h unter Headers und in der .ui-Datei steht der Eintrag <widget class="MyWidget" name="widget" native="true">.