首页 > 代码库 > 第70课 文本绘制技巧

第70课 文本绘制技巧

1. QPainter拥有绘制文本的能力

(1)drawText(拥有多个重载形式)

(2)常见调用方式

  ①p.drawText(10,10, "Santa Claus");  //在坐标(10,10)处绘制文本

  ②p.drawText(0,0,100,30, Qt::AlignCenter, "Santa Claus"); //在矩形范围内并以居中对齐的方式绘制文本。

2. 绘制参数

(1)字体(QFont)、颜色(QColor):控制文本大小、风格、颜色等

(2)坐标(QPoint)、角度(rotate

  ①文本绘制的位置(对齐该坐标)

  ②以绘制坐标为圆心顺时针旋转

技术分享 

【编程实验】文本绘制初探

//main.cpp

技术分享
#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}
View Code

//Widget.h

技术分享
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

class Widget : public QWidget
{
    Q_OBJECT
protected:
    void paintEvent(QPaintEvent *);
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H
View Code

//Widget.cpp

#include "Widget.h"
#include <QPainter>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
}

void Widget::paintEvent(QPaintEvent *)
{
    QPainter painter(this);

    painter.save(); //保存绘图环境

    painter.setPen(Qt::black);
    painter.setFont(QFont("Arial", 16));
    painter.rotate(0);
    painter.drawText(30, 40, "Santa Claus");

    painter.setPen(Qt::black);
    painter.setFont(QFont("Comic Sans MS", 20));
    painter.rotate(20);
    painter.drawText(30, 40, "Santa Claus");

    painter.restore();  //恢复绘图环境

    painter.drawText(130, 140, "Santa Claus");
}

Widget::~Widget()
{

}

3. 动态文本绘制

(1)解决方案

  ①在主窗口中绘制文本(QWidget)

  ②将文本中心绘制于窗口中心(width()/2, height()/2)

  ③动画效果通过连续控制字体参数完成(QFont)

  ④通过计时器强制更新文本绘制(QTimer)

(2)利用QFontMetrics获取字符串中指定字体的宽度和高度

/*指定字体*/
QFontMetrics metrics(font);

int w = metrics.width(text); //获取指定字符串的宽度
int h = metrics.height();    //获取指定字体的字符高度。

(3)坐标计算

技术分享 

【编程实验】动态文本绘制

//main.cpp

//Widget.h

//Widget.cpp

4. 小结

(1)QPainter能够根据需要任意绘制文本

(2)QPainter可以自定义文本颜色、位置、字体等参数

(3)QPainter绘制文本时可以通过参数控制实现动画效果。

(4)QPainter能够将文本绘制于图片(图片水印

第70课 文本绘制技巧