在Qt/QML中，如何为不同的设备密度加载不同的图像(Android)

Question

我正在使用 Qt 5.4 和 Qt Creator 3.3.2。

根据当前 OS 加载不同的图像，可以用

完成

Image {source: "logo.png"   }

和以下资源

logo.png
+windows/logo.png
+android/logo.png
+ios/logo.png

如果我对文档的理解正确，请添加

+ios/logo.png
+ios/logo@2x.png
+ios/logo@3x.png

将在 iOS 上 select 基于设备密度的不同图像。

我可以使用类似的机制为不同的 Android dpi（ldpi、mdpi、hdpi、xhdpi 等）加载不同的图像吗？如果是这样，目录结构应该如何？

Answer 1

Image {source: "logo" + density + ".png" }

和 density 可以是例如 S、M、L，并且您有 logoS.png、logoM.png 和 logoL.png。或者您可以使用它来指定不同的路径而不是图像名称。不管怎样。

您可以使用 QScreen 的 logicalDotsPerInch 属性并将其公开给 QML 以确定 density 的值。

此外，如果图像足够大，您实际上可以只运送较大的版本并根据需要缩小它。这样会更容易，而且您不会受限于特定尺寸。

Answer 2

您可以使用 Screen.pixelDensity QML 属性计算 ppi，并为不同的 ppi 范围分配不同的图像。可以在 KDAB blog post :

中找到示例代码

property int ppi: Screen.pixelDensity*25.4 

property var dir: ["MDPI","HDPI","XHDPI","XXHDPI",
                                    "XXXHDPI","XXXXHDPI"]
readonly property int ppiRange:{ 
 if (ppi>=540)
  5
 else if (ppi>=360)
  4
 else if (ppi>=270)
  3
 else if (ppi>=180)
  2
 else if (ppi>=135)
  1
 else
  0
 }

BorderImage {
   id: scalableElement3
   source: "./Images/" + dir[ppiRange] + "/image.png"
   width: parent.width-ppi/2
   height: ppi*1.5
   anchors.centerIn: parent
   border.left: 0.3*ppi; border.top: 0.3*ppi
   border.right: 0.18*ppi; border.bottom: 0.18*ppi
 }

在Qt/QML中，如何为不同的设备密度加载不同的图像(Android)

In Qt/QML, how to load different images for different device densities (Android)

qt

android

qml

qtquick2