2017-04-01 81 views
1

我在使用QML Canvas drawImage方法呈现SVG图标时遇到问题。 基本上,QML Canvas会忽略光栅化大小并从其原始大小(本例中为48x48px)开始绘制图像,并使用丑陋的混叠效果进行扩展。QML Canvas中的SVG光栅化问题

有没有人见过这个,可能想出了一个解决方案?

请参阅QTBUG-59878了解一个独立工作的示例。 在这里,我要复制QML代码和我看到的截图。

enter image description here

左起:

  • 原来的SVG图标,图象项目(正确)
  • 通过的drawImage呈现相同的图像项目(说实话,我希望这是为正确好吧,因为光栅化数据应该由Image提供)
  • SVG图标加载了documentation中说明的过程,带有loadImage和onImageLoaded

进口QtQuick 2.0

Rectangle 
{ 
    width: 640 
    height: 480 

    Image 
    { 
     id: svgIcon 
     source: "qrc:/qt_logo.svg" 
     x: 10 
     y: 100 
     width: 180 
     height: 200 
     sourceSize: Qt.size(width, height) 
    } 

    Canvas 
    { 
     id: canvas 
     anchors.fill: parent 
     contextType: "2d" 
     property string imagefile: "qrc:/qt_logo.svg" 

     Component.onCompleted: context.loadImage(imagefile) 

     onImageLoaded: requestPaint() 

     onPaint: 
     { 
      context.drawImage(svgIcon, 200, 100, 180, 200) 
      context.drawImage(imagefile, 400, 100, 180, 200) 
     } 
    } 
} 

回答

0

我与SVG内QML工作,表现非常差,倍增的质量和降频转换不够好。如果你使用SVG来显示图标,我会建议你使用字体而不是svg图标,它的速度和质量都很高。您可以将您的svg图标转换为字体字符,并将它们打包为单一字体,并在QML中将其用作文本或标签元素,如图所示Iconmoon.io

+0

我已经为其他几个图标使用了FontAwesome,但我也需要SVG。而且,字体是单色的。 –