首页 > 代码库 > QML Image获取图片资源路径的细节

QML Image获取图片资源路径的细节

2024-07-31 01:55:30   223人阅读

近期重新开始Qt5，在学到QML获取本地图片资源时总是遇到类似 “ QML Image: Cannot open: qrc:///images/Blue hills.jpg ”的错误，即无法正常载入本地的图片资源，经过一般努力，终于搞定拉！特此记录下来，方便自己和各位同仁查询！

参考：http://mobile.51cto.com/symbian-261878.htm

 

一开始遇到问题的时候在网上搜索了些久都没成功解决问题，不过倒是有些启发，比如在上面网址看到的资料中就多少有些体会。

在这里先贴出本人的小例子：

<span style="color:#808000;">import</span><span style="color:#c0c0c0;"> </span>QtQuick<span style="color:#c0c0c0;"> </span>1.1<pre style="TEXT-INDENT: 0px; MARGIN: 0px; -qt-block-indent: 0; -qt-paragraph-type: empty">
Rectangle {
    id: rec
    width: 800
    height: 600
    opacity: 1
    Image {
        id: image1
        source: "images/Blue hills.jpg"
        Image {
            id: image2
            width: 256
            height: 256
            source: "images/cute_colorful_qq_01.png"
        }
    }
}
若正常显示的话，会出现以下的效果：
但是本人一开始测试的时候，程序运行的效果都是一片空白，而且还总是出现 “ QML Image: Cannot open: qrc:///images/Blue hills.jpg ” 的错误，虽然程序可以正常运行！
 
一开始本人还以为是路径的问题，根据网上的很多资料页时这么说的，后来ijiu不断的修改路径参数，唉！不管俺怎么修改都不能把图片显示出来，后来怀疑是Qt的Bug，但是本人有测试了一下加载远端的图片，即网络上的图片，如一下代码：
<pre style="TEXT-INDENT: 0px; MARGIN: 0px; -qt-block-indent: 0"><span style="color:#808000;">import</span><span style="color:#c0c0c0;"> </span>QtQuick<span style="color:#c0c0c0;"> </span>1.1<pre style="TEXT-INDENT: 0px; MARGIN: 0px; -qt-block-indent: 0; -qt-paragraph-type: empty">
Rectangle {
    id: rec
    width: 800
    height: 600
    opacity: 1
    Image {
        id: image1
        source: "http://192.168.13.219/images/Blue hills.jpg"
    }
}
以上 source 后面的网址是本人在自己的电脑上面搭载的服务器的路径下的图片，读者也可以自己链接到网络上的其他图片链接！这样都可以正常显示呀，如下图：
 
由此看来不是Qt的问题，那就是俺自个的问题咯，再继续摸索！
这里注意一下，以下是俺的工程路径，图片资源也在这个路径下面：
 
后来俺猜想，会不会是“ qml.qrc ”这个资源文件出问题了呢，把它打开一看：内容如下：
<RCC>    <qresource prefix="/">        <file>main.qml</file>    </qresource></RCC>
嗯，好像真的有点问题，因为按照常规，*.qrc这个资源文件是有记录图片资源的路径信息的，但这里没有，于是本人自己手动修改为以下这样：
<RCC>    <qresource prefix="/">        <file>main.qml</file>        <file>images/Blue hills.jpg</file>        <file>images/cute_colorful_qq_01.png</file>        <file>images/Sunset.jpg</file>    </qresource></RCC>

然后重新编译运行，这是令人激动的时刻到来啦，终于成功显示了我们的图片啦！哈哈！
 
这里提醒一下，我们其实也可以不用自己手动更改 *.qrc 文件，直接在 QtCreator 的项目工程里面把图片资源载入进去就行拉！如下图所示：
 
大家看到了吗，就是上面红色方框圈出来的几张图片，需要自己手动把它们添加到工程中去，这样就会自动修改 “*.qrc ”文件，一开始是没有的哦！问题就出现在这里！
 
好啦！就先到此啦！
QML Image获取图片资源路径的细节






























        

            
                
                  
                
                

                    联系

                    我们