Typing on a QWidget

jkwok678

I currently have a plan for a canvas/drawing QWidget.

One feature I would like is for me to be able to type text on it and be able to change the font and size of the text. I've written the other parts of the program with Qpainter, so that there is functionality to draw shapes and images. But what could I use that could bring up a textbox for the user to type text into that starts at that spot, I imagine one way would be to use a dialog box but is there something is sleeker and doesn't require leaving the current QWidget

mrjj

Hi
There is nothing that would allow in-place editing and formatting as far as i know.

However, using QTextDocument/QTextEdit as a render (aka)

QTextEdit te("This is a rich text");
te.resize(100, 100);
QPixmap pix = QPixmap::grabWidget (&te, te.rect()); // this you draw/update after edit/remove on delete

and then a mini list system of "textobjects" x,y,image, Text
that you paint over what you draw with QPainter

then override mousepress/add to and loop your list to be able to click them.
(and pop a dialog )

that allows you to draw formatted text in various sizes and change its properties.

This would be a basic solution. In place draw while typing would require a very custom widget.(IMHO)

SGaist

Hi,

Are you implementing something like QGraphicsTextItem ?

mrjj

@SGaist
Good catch ! Actually for the whole Widget :)

jkwok678

Honestly not entirely sure what the implementation could be, but the ideal thing would be when i click on the screen it just allows me to type there, a bit like how you could on a photo editor like photoshop.

@mrjj
I think QTextEdit is one way to do it,but I'm just trying to see if there's a more seemless way of doing it. Perhaps even a flashing line where the next character will be inputted.

@SGaist
Possibly, but does it allow me to write in real time and display? I've been using QPainter so far, and the various draw methods. So I was thinking it would probably be just using drawText.

SGaist

Yes it does. You can check its implementation.

jkwok678

This post is deleted!

jkwok678

Would I have to use QGraphicsView for this then?
Ideally I would like to use it inside a paintEvent method that I have that paints all the other objects and images.

SGaist

Usually on painting application, you have a dedicated functionality for that. It seems that you want to have everything done by a single class. Is that the case ?

jkwok678

I think so, I have a class called canvas, that inherits from QWidget, and in there. I have a method to detect mouse clicks and a paintEvent method. All my painting is done in there.

SGaist

You might want to consider splitting things a bit. Having one mega class that does everything is usually a bad sign.

The Graphics View framework might give you some ideas as well as the plug and paint example.

jkwok678

Ok, I'll have a look, there are only just the 2 methods for registering mouse clicks and doing the paintevent in my canvas class. With the graphics view framework, does that mean I can still use paintevent and painter.draw___?

jkwok678

This post is deleted!

jkwok678

Is QLineEdit also an option? In terms of typing text on a custom QWidget?

mrjj

@jkwok678

Yes it could be but not that easy to get working smoothly but yes it works
but it was not that easy to place correctly on a "canvas".
Also you need to have some sort of Text obejct simply to keep track of Text posistions etc.
Else when use click on some painted text, how can you place the lineEdit on top of it ?
Also, you need erase area/redraw area pr key stroke to make it "live"

I think i would change my "canvas" to be based on QGraphicsItem
https://doc.qt.io/qt-5/qgraphicsitem.html
Since it has Paint and mouse event function just like QWidget
and you can reuse most of the code for canvas.
Then you can just use QGraphicsTextItem with your new canvas
and get the wanted text editing.

That said, you might have some surprises with coordinate system, etc as that is not the same as for
QWidgets. So it might take some reading to use the QGraphicXX framework.
But it would give you in place edit

Try out
https://doc.qt.io/qt-5/qtwidgets-graphicsview-diagramscene-example.html
(its in creator)
and see if you think it would be worth the effort.

class SimpleItem : public QGraphicsItem
{
public:
    QRectF boundingRect() const override
    {
        qreal penWidth = 1;
        return QRectF(-10 - penWidth / 2, -10 - penWidth / 2,
                      20 + penWidth, 20 + penWidth);
    }

// like paintEvent for Widgets
    void paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
               QWidget *widget) override     {
        painter->drawRoundedRect(-10, -10, 20, 20, 5, 5); <<< note the coordinates. its NOT 0,0 in top/left but in center. Unlike with QWids. just so you are aware of this.
    }
};

Update: Forum Guidelines & Code of Conduct

Unsolved Typing on a QWidget