Qt QSVG使用详解

       SVG 伸缩可矢量图形（SVG）是一种基于XML的语言，用于描述二维矢量图形。SVG 使用 XML 格式定义图像。

Qt QSVG使用详解目录

1 SVG基本格式

2 加载SVG矢量图

3 生成矢量图

 4 矢量图下载网站

4.1 阿里巴巴

4.2 Lineicons

 4.3 ionicons

 5 下载地址

---

        本文作者原创，转载请附上文章出处与本文链接。

1 SVG基本格式

        以下示例出自 iconfont 阿里巴巴矢量图

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464zM255.1 176C255.1 176 255.1 176 255.1 176c21.06 0 40.92 8.312 55.83 23.38c9.375 9.344 24.53 9.5 33.97 .1562c9.406-9.344 9.469-24.53 .1562-33.97c-24-24.22-55.95-37.56-89.95-37.56c0 0 .0313 0 0 0c-33.97 0-65.95 13.34-89.95 37.56c-49.44 49.88-49.44 131 0 180.9c24 24.22 55.98 37.56 89.95 37.56c.0313 0 0 0 0 0c34 0 65.95-13.34 89.95-37.56c9.312-9.438 9.25-24.62-.1562-33.97c-9.438-9.312-24.59-9.219-33.97 .1562c-14.91 15.06-34.77 23.38-55.83 23.38c0 0 .0313 0 0 0c-21.09 0-40.95-8.312-55.89-23.38c-30.94-31.22-30.94-82.03 0-113.3C214.2 184.3 234 176 255.1 176z"/>
svg>

2 加载SVG矢量图

    QSvgRenderer render;
    render.load (QString("D:/copyright.svg"));
 
    QSize size = render.defaultSize ();
    QPixmap *pix = new QPixmap(30, 30);
    //QPixmap pix(size*5);        // 可以在这儿直接缩放处理
    pix->fill (Qt::transparent); // 像素清空
 
    QPainter painter(pix);
    painter.setRenderHints (QPainter::Antialiasing);
    render.render (&painter);
 
 
    ui->pushButton->setIcon(QIcon(*pix));
    ui->pushButton->setIconSize(QSize(30, 30));
    ui->pushButton->setFlat(true);
    //ui->pushButton->setStyleSheet("border: 0px"); //消除边框

3 生成矢量图

    QSvgGenerator generator;        // 定义SVG的产生器
    generator.setFileName (QString("temp.svg"));    // 设置SVG文件名
    generator.setDescription ("Test QSvgGenerator");    // 无所谓
    QSize size(400,400);
    generator.setSize (size);       // 设置大小
    generator.setViewBox(QRect(0, 0, 400, 400));  // 视口大小
 
    QPainter painter;               // 小画家
    painter.begin (&generator);
    QRect rect(0,0,400,400);
    painter.setBrush (Qt::cyan);
    painter.drawEllipse (rect);     // 直接在 generator 上绘制 一个圆
    painter.end ();                 // 需要保证绘制结束

"1.0" encoding="UTF-8" standalone="no"?>
<svg width="141.111mm" height="141.111mm"
 viewBox="0 0 400 400"
 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  version="1.2" baseProfile="tiny">
<title>Qt SVG Documenttitle>
<desc>Test QSvgGeneratordesc>
<defs>
defs>
<g fill="none" stroke="black" stroke-width="1" fill-rule="evenodd" stroke-linecap="square" stroke-linejoin="bevel" >
 
<g fill="#00ffff" fill-opacity="1" stroke="#000000" stroke-opacity="1" stroke-width="1" stroke-linecap="square" stroke-linejoin="bevel" transform="matrix(1,0,0,1,0,0)"
font-family="SimSun" font-size="9" font-weight="400" font-style="normal" 
>
<circle cx="200" cy="200" r="200"/>
g>
g>
svg>

 4 矢量图下载网站

4.1 阿里巴巴

阿里巴巴官方矢量图网站： iconfont-阿里巴巴矢量图标库

4.2 Lineicons

Free Line Icons for Designers and Developers - Lineicons

 

 4.3 ionicons

Ionicons: Premium Open Source Icon Pack for Ionic Framework

 5 下载地址

本博客源代码下载地址：QSVG使用Demo程序-C++文档类资源-CSDN下载

20多个最佳 ICON 库_高先生的猫的博客-CSDN博客_icon库