目前只实现了文字外面有单一颜色轮廓的效果,那种渐变发光的效果还不知道如何实现。 - QStringList text_lines = ......;
QString text = weather_lines.join("n");
计算绘制所有文字所需的尺寸 - QFont f;
f.setFamily(mFontName); f.setPixelSize(mFontSize); f.setWeight(QFont::Black);
QFontMetrics fm(f); int textflags = Qt::AlignLeft | Qt::TextExpandTabs; QSize textsize = fm.size(textflags, text);
图片边缘留空白 - int margin = 8;
textsize.setWidth(textsize.width() + 2*margin); textsize.setHeight(textsize.height() + 2*margin);
addText前面的参数是文字基线的位置 addText会把加入的文字当成一行,无视换行符,所以要一行一行加入,这也是前面用QStringList的原因 - QPainterPath pp(QPointF(margin, margin));
qreal px = margin, py = margin + fm.ascent(); foreach(const QString& line, text_lines) { pp.addText(px, py, f, line); py += fm.lineSpacing(); }
先填充文字轮廓里的区域,然后在此区域里绘制文字,于是就有了类似光晕的效果了 - QPainterPathStroker pps;
pps.setCapStyle(Qt::RoundCap); //pps.setJoinStyle(Qt::MiterJoin); pps.setWidth(3); QPainterPath path = pps.createStroke(pp).united(pp).simplified();
这里光晕的颜色去文字的反色淡一点的颜色 - QColor glow_color = QColor(255-mFontColor.red(), 255-mFontColor.green(), 255-mFontColor.blue()).lighter(168);
准备绘制光晕 - QPixmap textpixmap(textsize);
textpixmap.fill(QColor(0, 0, 0, 0)); QPainter p(&textpixmap); p.setFont(f); p.fillPath(path, glow_color); p.setPen(glow_color.lighter(88)); p.drawPath(path);
绘制里面的文字 - p.setPen(mFontColor);
p.drawText(QRect(margin, margin, textpixmap.width(), textpixmap.height()), textflags, text); p.end();
最后来看下效果图,我在做天气信息显示时用到的
|
novesky:哪里有?
2012-02-23 22:25