QML中的文本呈现了不同的跨平台 [英] Text in QML rendered different accross platforms

问题描述

我看到不同平台之间的文本呈现不一致：

左上角的图像是在android系统中生成的，并且如红色指示线所示，它在垂直位置和斜体样式的角度方面与参考窗口输出不同。 p>

 矩形{
宽度：100 
高度：50 
颜色：灰色 
文本{
x：4 
y：2 
 font.family：sysfont 
 font.pixelSize：13 
 width：contentWidth 
 color：bgc 
文本：类型 
} 
文本{
x：5 
y：13 
 font.family：sysfont 
 font.pixelSize：32 
 font.italic：true 
 font.letterSpacing：-1 
 width：contentWidth 
 color：topc 
 style：Text.Sunken 
 st yleColor：bgc 
文本： Name 
} 
} 
  

任何想法是什么原因造成的？它是相同的字体，相同的代码。跨平台的顶部填充和线条高度值相同。

解决方案

I am seeing inconsistencies in the rendering of text between different platforms:

The image on the top left is produced in android, and as the red guide lines indicate, it differs from the "reference" windows output in terms of vertical position and angle of the italic style.

Rectangle {
  width: 100
  height: 50
  color: "grey"
  Text {
    x: 4
    y: 2
    font.family: sysfont
    font.pixelSize: 13
    width: contentWidth
    color: bgc
    text: "Type"
  }
  Text {
    x: 5
    y: 13
    font.family: sysfont
    font.pixelSize: 32
    font.italic: true
    font.letterSpacing: -1
    width: contentWidth
    color: topc
    style: Text.Sunken
    styleColor: bgc
    text: "Name"
  }
}

Any ideas what causes that? It is the same font, the same code. Top padding and line height values are identical across the platforms.

解决方案

It turns out that it is a bug. So it will likely be fixed sometime in the years to come...

Until then, the following workaround should do the trick at least when it comes to the vertical position:

  property real offset: {
    switch (Qt.platform.os) {
    case "android": return androidValue
    case "windows": return windowsValue
    // and so on...
    }
  }

I will investigate if there are discrepancies between different version of the same platforms and update the answer if necessary.

UPDATE: It may turn out that the exception here is windows, as the output from android and ubuntu is practically identical (and yes, both are essentially linux anyway). I don't have a mac so I cannot give any input on that.

这篇关于QML中的文本呈现了不同的跨平台的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！