skip to Main Content

I’m new to Qt and I’m looking for a way to create my own components. I need to create my own custom styled (needs to look specifically) component. The problem is I’m looking at the tutorials and I’m a bit baffled as to how to do this, because the tutorials show something else than I need to do.

I need to create something like my own plotwidget, containing two graphs (one of them editable by clicking and dragging control points by mouse) that will have accessible properties and slots/events like “plotchanged”.

Now, what I’looking for is not someone to write me the code (would be nice though 😀 ) but someone to tell me where to start looking/ tell me what to do?

Like You need to

  1. create your own “custom widget”/”qml component”/”something else you don’t know about cause you’re new in Qt and don’t know the names or where to look”.

  2. You should also read something about this,this and maybe that little thing that is useful. And here, this is what you should be looking at.

I started a lot of QML tutorial since i started looking, but when i start them I’m not sure that they lead to what I’m ultimately looking for.

What I want to create is a “Plot widget” that shows two graphs, the thing that looks close to it might be “curves tool” like in photoshop or GIMP.

3

Answers


  1. This is a little hard to answer as there are many things you need to do something like in your linked picture. So I will just address the two main things:

    • Creating your own custom widget:

    Just create a class inherited from QWidget and add a Layout to it:

    class CustomWidget : public QWidget
    {
    public:
        CustomWidget ( QObject * parent ) : QWidget ( parent )
        {
            QVBoxLayout * lay = new QVBoxLayout;
    
            lay->addWidget ( new QTextEdit );
            lay->addWidget ( new QPushButton ( "Button" ) );
    
            this->setLayout ( lay );
        }
    };
    

    You can use this class anywhere in for example other QWidget based classes via layouts, just like I used new QLineEdit, you can use new CustomWidget in another class.
    There are also many other Layouts

    • Drawing graphs

    QPainter is the class you run all your drawing with ( lines, curves, etc ).
    You can draw in a QWidget ( or to be exact: a class inherited from QPaintDevice ).
    To draw on a QWidget when appropriate, override paintEvent(QPaintEvent*). Just google, there a millions of examples how to do this properly.

    Login or Signup to reply.
  2. You want to create a widget so the first thing to do is to create your own class myWidget which inherits from QWidget.

    Then, you want 2 graphs. I advise you to take a look at qwt library: http://qwt.sourceforge.net/

    With this library you have a lot of examples with graphs. It’s a bit complex, it’s a quite big lib but very complete.

    You also have to manage your layout, I advise you to use Qt designer with QGridLayout.
    With this layout object, you can define a “matrix” where you can put all of you widgets wherever you want.

    To make your buttons, widgets, plots, … doing things when you click on it, you have to create your signal/slot mechanism. Have a look there: http://qt-project.org/doc/qt-4.8/signalsandslots.html

    Finally, to have a beautiful widget, you can create a stylesheet using CSS language to improve your design.

    Login or Signup to reply.
  3. I think a good start is to read up a bit. Qt is a multiplatform framework for C++ applications.
    http://en.wikipedia.org/wiki/Qt_(software)

    QML is a markup language (as is html, hypertext markup language) for rapid Qt UI development.
    http://en.wikipedia.org/wiki/QML

    With QML you can design your graphical interface. “plotwidget” is very unclear as to what math you need for your application.

    I haven’t tested this library myself, but it looks promising
    http://www.qcustomplot.com
    (which is the first hit when googling “qt plot”) I don’t know what you mean by “drag and click control points” , so you will have to read in the library documentation if it supports that.

    I would:

    1)Create a widget by inheriting from QWidget. Making the plot library of your choice work and perhaps display some mockup plots like y=x^2 or something before continuing.

    2) Writing down what calls and responses you need from the library. How is the “drag and click” thing solved using your library?

    3)Designing UI with QML or e.g. the ordinary UI feature in QtCreator, based on the specifications for buttons and displays etc you have derived in 2).

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search