QML for Android 加載圖檔資源的幾種方式

前言

前段時間用 QML 做一個簡單的 android 程式，需要打開 android手機本地圖檔，原本是一個非常簡單的功能，但是碰到一些坑着實的被坑了一把，然而在網上并沒有找到相關的文檔，這裡做個總結，今後遇到同樣問題的人可以繞開這個坑。

正文

打開本地檔案

首先來看一下打開本地圖檔的方式，來看個簡單的示例：

import QtQuick 2.9
import QtQuick.Window 2.2

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

    Image {
        id: name
        anchors.fill: parent
        source: "file:///storage/emulated/0/Download/1.png"
    }
}           

這個程式夠簡單的了吧，需要注意的是，打開本地圖檔，需要在路徑前面添加“file:///”，不能直接寫路徑。

然後，編譯->運作，確定該目錄下有這張圖檔。

然而我遇到的坑就在這裡，無論如何都無法顯示這張圖檔，

直接報錯：

QML Image: Error decoding: file:///storage/emulated/0/Download/1.png: Unable to read image data           

我特麼一度在懷疑自己這種寫法是不是有問題，然後各種查資料，就是找不到問題所在。

就在一籌莫展的時候，靈機一轉，換了張圖檔，發現特麼的竟然可以了，這就讓我一臉懵逼了，怎麼都沒想到竟然是圖檔的問題，可這張圖檔明明在本地是可以打開的啊，圖檔是在其他用戶端截圖上傳并在本機通過 http 從伺服器下載下傳的 png 格式，反正就是無法加載到 QML 中使用。好在問題解決了，換成了 重新下載下傳jpg 格式的圖檔就沒問題。最終還是把鍋推給這張圖檔了。

OK，接下來看其他兩種更簡單的加載圖檔方式；

import QtQuick 2.9
import QtQuick.Window 2.2

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

    Image {
        id: name
        anchors.fill: parent
       source: "qrc:/skin/1.jpg"
    }
}           

與第一種方式不同的是，引用資源檔案時時以“qrc:/”開頭。這種方式最常用。

打開 asserts 目錄下的檔案

Android原生開發中的資源檔案大緻分為兩種，一種是res目錄下存放的可編譯的資源檔案，另一種是 asserts 目錄下的用來存放原生的資源圖檔，系統在編譯的時候不會編譯assets下的資源檔案，在用 Qt 做 Android 開發的時候，如果不想将圖檔放到 Resource 資源檔案中進行編譯，那就可以放到 asserts 目錄下去。

引用方式如下：

import QtQuick 2.9
import QtQuick.Window 2.2

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

    Image {
        id: name
        anchors.fill: parent
       source:"assets:/skin/1.png"
    }
}           

要想引用 assets 中的資源，先要将圖檔資源放到該目錄下去，在 Qt 的工程檔案 pro 中添加：

imgs.files +=/skin/*
imgs.path = /assets/skin
INSTALLS += imgs
           

總結

上面說了三種在 Qt for Android 開發的時候加載圖檔資源的幾種方式，其實每種方式的應用場景都不太一樣，是以在開發過程中都有可能會遇到。

其中第一種方式，通常針對引用 Android 手機本地已經存在的圖檔，比如要做相片浏覽功能，這就是打開本地圖檔，隻能用file:///的方式來引用。

第二種和第三種方法，通常針對軟體中的一些圖示資源引用，比如說某個按鈕的圖檔，差別就是第二種是在編譯的是直接将圖檔打包進安裝檔案中，這就和 android 原生開發中的資源 res 一樣，而第三種方式在編譯的時候不會編譯資源檔案，是以解壓安裝包後可以直接找到該目錄下包含的圖示。

OK，至此介紹完了三種方法，如果在引用的時候出現無法加載的情況，首先檢查調用方式是否正确，其次看路徑是否正确，如果都沒問題，不妨換一張圖檔，有可能是圖檔的問題。

【領QT開發教程學習資料，點選下方連結莬費領取↓↓，先碼住不迷路~】

點選這裡：「連結」