# QT中添加图片资源文件

### （1）cmake添加图片资源

1.1 在源文件目录添加images图片目录，并将使用的图片放入其中

<figure><img src="https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FeMQ6hEfvCfBurqDcHemX%2Fimage.png?alt=media&#x26;token=aa3aa46e-1e3b-43b4-94bb-fb3aca90c7f9" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FDLH0HMz6MLl35xjEQrt8%2Fimage.png?alt=media&#x26;token=0e2e69bc-f033-404a-9650-70cb4b5d2e94" alt=""><figcaption></figcaption></figure>

1.2 在源文件目录新建application.qrc文件，并用记事本打开，添加以下内容

```
<RCC>
    <qresource prefix="/">
        <file>images/cli.png</file>      
    </qresource>
</RCC>
```

或

```
<RCC>
    <qresource prefix="/images">
        <file>cli.png</file>      
    </qresource>
</RCC>
```

1.3 CMakeLists.txt 添加如下内容

```
#添加资源文件
set(CMAKE_AUTORCC ON)
qt_add_resources(appStudtDemo02 imageresources
    PREFIX "/images"
    FILES cli.png
)

#-------添加application.qrc-----
qt_add_executable(appStudtDemo02
    main.cpp
    application.qrc
)

```

1.4 在main.qml文件中显示，其中source的路径复制资源文件路径

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

    Image {
        id: img
        anchors.fill: parent
        source: "qrc:/images/cli.png"
    }
```

<figure><img src="https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FUNL54FMztOwjsMp5fgXz%2Fimage.png?alt=media&#x26;token=02e266d6-36d8-422e-8338-0af2638c1f57" alt=""><figcaption></figcaption></figure>

1.5 运行，效果如下

<figure><img src="https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FsJ8VXYJJBNBQpZvsRCkt%2Fimage.png?alt=media&#x26;token=efea70b9-7076-49bf-b194-4f4a10cbbab5" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
参考资料：

<https://doc.qt.io/qt-6.2/cmake-get-started.html>

<https://doc.qt.io/qt-6.2/resources.html>
{% endhint %}

### （2）qmake添加图片资源

2.1 右键项目文件，选择“Add New\...”

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FdDxw6pZWvKE6eFja9Vq2%2Fimage.png?alt=media\&token=5a2061cd-7ad3-46da-a750-b800aa1b3614)

2.2 选择“Qt Resource File”-- >>填入“IMG”文件名-- >>点击“完成”

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2F9CtZDRWXqJb1v0XKfrJb%2Fimage.png?alt=media\&token=868b6b01-ac7d-4aab-bbd4-70b17affb8d6)

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2F6q33nzJDCjP9Y6EKHGaN%2Fimage.png?alt=media\&token=f0c93ab6-d9a6-4756-b65f-46a3aa521ec0)

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FlzPP176rD4IKgYNBuBoY%2Fimage.png?alt=media\&token=924d5e55-d22b-44e8-9a0a-e740ba366feb)

2.3 添加前缀

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FlBCPMleaMnzqKd6bjHLh%2Fimage.png?alt=media\&token=222c367a-1b8b-4198-8703-60b103068e76)

2.4 右键“Resources”文件，选择“在Explorer中显示”，找到项目文件夹在磁盘的存储位置，新建“IMAGE”文件夹，并存储一张命为“background.png”的图片

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2Fk05pYurQtiLJuhbd6iJx%2Fimage.png?alt=media\&token=4e2bc050-6b67-4fe6-a770-f8b8eda8754d)

2.5 点击“Add Files”，选择IMAGE文件夹的图片

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2F1AnTHfr5Fj6eQDBxtGgd%2Fimage.png?alt=media\&token=c49927cc-e902-407c-8a5c-ab0508194736)

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FSVn7Ib5URMb1k0feaID3%2Fimage.png?alt=media\&token=2bc6f955-2f74-4a69-b879-03a4ce7a34d0)

2.6 点击图片，选择复制URL，到代码界面粘贴即可使用。

![](https://3407761548-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDFgj_K1oEIHPoXVkZG%2Fuploads%2FlP5PvHMKIkak5zmdv81n%2Fimage.png?alt=media\&token=805fe746-dd78-4e53-a93d-cb6e2bcdf186)