無法在 Raspberry Pi 上的 QML 圖像中加載圖像源

Question

我正在使用 Qt Creator 交叉編譯 Qt 項目，但出現以下錯誤：

qrc:/main.qml:26:25: QML Image: Cannot open: qrc:/images/imgA.png

目標設備上的目錄結構是：

.
└── ProjectA/
    └── bin/
        └── res/
            └── images/
                ├── imgA.png
                └── imgB.png

Host PC上的目錄結構為：

.
└── ProjectA/
    ├── ProjectA.pro
    ├── src/
    │   └── All source Files
    └── res/
        ├── main.qml
        ├── main.qrc
        └── images/
            ├── imgA.png
            └── imgB.png

當我在主機 PC 上編譯和執行程序時，一切正常

編輯這是main.qrc：

<RCC>
    <qresource prefix="/">
        <file>main.qml</file>
    </qresource>
    <qresource prefix="/images">
        <file alias="imgA" >images/imgA.png</file>
        <file alias="imgB" >images/imgB.png</file>
    </qresource>
</RCC>

主要的.qml：

import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Layouts 1.3

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Image {
        id: testImg
        source: "images/images/imgA.png"
    }

這是 qmake 項目文件：

QT += quick core network

CONFIG += c++17

# You can also make your code fail to compile if it uses deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0
INCLUDEPATH += src/
SOURCES += \
        src/Property.cpp \
        src/Weather.cpp \
        src/main.cpp

RESOURCES += res/qml.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =


install_config.path = /home/dietpi/QtProjects/$${TARGET}/bin/Data/
install_config.files = Data/*


INSTALLS += \
    install_config \

# Default rules for deployment.
target.path = /home/dietpi/QtProjects/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

HEADERS += \
    src/Property.hpp \
    src/Weather.hpp

DISTFILES += \
    res/main.qml \

Answer 1

這是為您截取的代碼。

qml.qrc

<RCC>
    <qresource prefix="/">
    <file>main.qml</file>
    </qresource>

    <qresource prefix="/images">
    <file alias="logo.jpg">images/logo.jpg</file>
    </qresource>
</RCC>

這是一個main.qml

import QtQuick 2.14
import QtQuick.Window 2.14

Window {
   visible: true
   width: 640
   height: 480
   title: qsTr("Hello World")

   Image {
      id : imgItem
      anchors.fill: parent
      source: "qrc:/images/logo.jpg"
   }
}

Answer 2

即使在具有相同 Qt 安裝的不同 PC 上，我也會遇到同樣令人討厭的問題。 當我為 qrc 文件中的每個前綴添加最后一個斜杠時，它工作正常：

<qresource prefix="/images/">

之后，我刪除了緩存的 all.qrc 並重新編譯，它工作正常。

Answer 3

如Qt 資源系統中所述，您應該使用qrc:///path或:/path 。

似乎qrc:/path在某些平台上不起作用。

更新：

由於您在.main.qrc中使用qresource prefix ，因此您需要使用:/images/images/圖像文件的路徑。 或將所有圖像移動到父文件夾 ( res/ )。

Answer 4

查看您的資源文件，您正在使用別名。 這意味着您在引用它時必須使用別名。 所以嘗試像這樣訪問它：

    Image {
        id: testImg
        source: "qrc:/images/imgA"    // Note, there is no '.png'
    }