How can I draw vertical text?

Drawing vertical text can be done in several ways. The easiest way might be to create a QTextDocument [doc.qt.nokia.com] in the paintEvent() [doc.qt.nokia.com] and use setHtml() [doc.qt.nokia.com] to set the text and specify the

tag to get line breaks. Another way could be to iterate over the QChars [doc.qt.nokia.com] in the QString [doc.qt.nokia.com] and position them vertically in the paintEvent() yourself. Then you would need to calculate the height between each element.

If what you want is rotated text, then you can simply rotate the painter 90 degrees.

Finally, if you are not going to draw the text yourself, then a QLabel [doc.qt.nokia.com] can easily be used to display vertical text, simply by specifying “\n” after each character.

The example below illustrates some of the possibilities:

#include <QtGui>
class Widget : public QWidget
{
public:
Widget(QWidget *parent = 0)
: QWidget(parent)
{}
void paintEvent(QPaintEvent *)
{
QPainter p(this);
#if 1
QTextDocument document;
document.setHtml(" T e s t ");
document.drawContents(&p);
#else
drawRotatedText(&p, 90, width() / 2, height() / 2, "The vertical text");
#endif
}
void drawRotatedText(QPainter *painter, float degrees, int x, int y, const QString &text)
{
painter->save();
painter->translate(x, y);
painter->rotate(degrees);
painter->drawText(0, 0, text);
painter->restore();
}
};
int main(int argc, char **argv)
{
QApplication a(argc, argv);
Widget w;
w.resize(200,200);
QString string = "t\ne\ns\nt";
QLabel label;
label.setText(string);
label.show();
w.show();
return a.exec();
}

1 comment

December 5, 2010

xsacha

Ant Farmer

The above is demonstrating a full application with rotated (any angle) text as well as some newline methods.

If it’s just vertically painted text you want, this function will suffice:

void drawRotatedText(QPainter *painter, int x, int y, const QString &text)
{
painter->save();
painter->translate(x, y);
painter->rotate(90); // or 270
painter->drawText(0, 0, text);
painter->restore();
}

If you have a QPainter subclass, you can easily attach this to it and remove the painter argument so it appears like a normal drawText.

Tags what is this? Undo?

Ratings what is this?

Qt DevNet Blog

Qt Developer Network is moving to the Qt Project

Qt 4.8 Docs now on Qt DevNet

Qt Developer Network Forums are Buzzing

Not registered?

How can I draw vertical text?

1 comment

December 5, 2010

Write a comment