- LiFePO4 Speicher Test         
Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 18

Thema: qt5 creator + designer: super simple graphic examples

  1. #1
    HaWe
    Gast

    qt5 creator + designer: super simple graphic examples

    Anzeige

    Praxistest und DIY Projekte
    hallo,
    ich habe z.Zt nur sehr simple qt5 creator GUI Programme mit wenigen Buttons und beschrifteten Labels, z.B.
    https://github.com/dsyleixa/Raspberr...p_ads1115.jpeg

    Nun möchte ich einen Zeichnungs-Bereich (eine Leinwand) in die Form einfügen, in dem ich per Programmcode Linien- und Formgrafiken anzeigen kann.
    In der Vielzahl der widgets für den qt Designer finde ich aber nichts, was man da in der Form als Leinwand einfügen und zur passenden Größe"aufziehen" kann.
    Was nimmt man da?

    Als nächstes möchte ich (zum Üben) ein einfaches Quadrat (outline) und einen Kreis (fillshape) platzieren, in der Art
    SetBackgound(BLACK);
    SetColor(RED);
    RectOutline(20, 20, 40, 40);
    SetColor(YELLOW);
    Circle(30, 24, 10);
    wie mache ich das mit welchem qt-Code in dem soeben in die Form eingefügten Paint-Bereich?

  2. #2
    HaWe
    Gast
    PS
    nimmt man für Zeichnungen das OpenGL widget ?
    und dann wie weiter, um darin Linien und geometr. Formen anzuzeigen?

  3. #3
    Erfahrener Benutzer Roboter-Spezialist
    Registriert seit
    13.01.2014
    Beiträge
    454
    Blog-Einträge
    3
    https://doc.qt.io/archives/qt-5.5/qt...s-example.html
    https://doc.qt.io/qt-5/qml-qtquick-context2d.html
    Zuerst eine Leinwand (canvas) definieren, dann in deren onpaint()-Methode füllen.

  4. #4
    HaWe
    Gast
    dankeschön, leider sind mir die Einzelschritte nicht klar...:
    Eine Form mit Button und openGL "Leinwand" habe ich ja bereits entworfen https://github.com/dsyleixa/Raspberr.../qt_btn_OpenGL.

    Die Ceator IDE erzeugt dabei automatisch ein File mainwindow.cpp mit dem Inhalt
    Code:
    #include "mainwindow.h"
    #include "ui_mainwindow.h"
    
    MainWindow::MainWindow(QWidget *parent) :
        QMainWindow(parent),
        ui(new Ui::MainWindow)
    {
        ui->setupUi(this);
    }
    
    MainWindow::~MainWindow()
    {
        delete ui;
    }
    und das canvas widget (QOpenGLWidget) wird in der Creator IDE per d+d in meiner Form durch "automatic code generation" in mainwindow.ui erzeugt:
    Code:
    <widget class="QOpenGLWidget" name="openGLWidget">
    <property name="geometry">
    <rect>
    <x>20</x>
    <y>10</y>
    <width>311</width>
    <height>241</height>
    </rect>
    </property>
    </widget>
    </widget>
    Nun habe ich also eine Form mit Quit-Button und openGL Leinwand, aber wie kriege ich jetzt Dinge wie

    ClearScreen();
    SetColor(RED);
    SetBrushWidth(2);
    RectOutline(20, 20, 40, 40);
    SetColor(YELLOW);
    Circle(30, 24, 10);

    in die mainwindow.cpp-Routine
    Code:
    MainWindow::MainWindow(QWidget *parent) :
        QMainWindow(parent),
        ui(new Ui::MainWindow)
    { }
    damit sie das in den Bereich der definierten openGL Leinwand zeichnet?

  5. #5
    HaWe
    Gast
    OpenGL scheint tatsächlich viel zu schwierig zu sein, QPainter ist angeblich einfacher, doch auch dafür bräuchte ich eine Anleitung, welche Art von canvas Widget dafür ich in die Form einfügen (Graphics_View ?) und welchen genauen Code für die obigen Zeichen-Funktionen und für das passende Widget in mein Hauptprogramm hineinschreiben muss.

    https://github.com/dsyleixa/Raspberr...t/qt_btn_paint

  6. #6
    Erfahrener Benutzer Roboter-Spezialist
    Registriert seit
    13.01.2014
    Beiträge
    454
    Blog-Einträge
    3
    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!

  7. #7
    HaWe
    Gast
    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.

  8. #8
    Erfahrener Benutzer Roboter-Spezialist
    Registriert seit
    13.01.2014
    Beiträge
    454
    Blog-Einträge
    3
    Nagut, das geht dann so:
    Die Dateien mywidget.h
    Code:
    #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
    Code:
    #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.

  9. #9
    HaWe
    Gast
    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:

    Code:
    <?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...
    Geändert von HaWe (03.06.2020 um 12:35 Uhr)

  10. #10
    Erfahrener Benutzer Roboter-Spezialist
    Registriert seit
    13.01.2014
    Beiträge
    454
    Blog-Einträge
    3
    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

Seite 1 von 2 12 LetzteLetzte

Ähnliche Themen

  1. Tipps Meine Software: LCD-Charakter-Creator
    Von pro-bot128 im Forum Offtopic und Community Tratsch
    Antworten: 3
    Letzter Beitrag: 20.06.2011, 12:55
  2. Ks108 und Graphic Converter
    Von carfan im Forum Basic-Programmierung (Bascom-Compiler)
    Antworten: 3
    Letzter Beitrag: 10.08.2008, 21:00
  3. Menü Creator
    Von guenter1604 im Forum Basic-Programmierung (Bascom-Compiler)
    Antworten: 15
    Letzter Beitrag: 02.08.2008, 10:12
  4. Antworten: 6
    Letzter Beitrag: 30.07.2007, 15:30
  5. PIC mit Graphic LCD
    Von chosn im Forum PIC Controller
    Antworten: 3
    Letzter Beitrag: 02.06.2005, 12:20

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •  

LiFePO4 Speicher Test