QML Image獲取資源路徑的細節(jié)

QML是門相當新的UI描述語言，因此在文檔上總難免有疏漏之處，如果因此產(chǎn)生了bug，則就需要花費大量的時間去排查。

在最近筆者使用QML的過程中，在Image獲取資源路徑的細節(jié)上就出現(xiàn)了這樣的情況。

Image 是qml中一個非常普通的元素，通常使用方法如下：

其中，source指的Image元素獲取資源的url路徑，這個url可以是本地的絕對路徑或者相對路徑，也可以是qt資源系統(tǒng)的路徑，甚至是網(wǎng)絡資源的路徑。

正是這個看起來不起眼的路徑，卻會帶來跟預期想之外的結果，并且，僅僅從代碼上來看，沒有半點錯誤的地方。

要了解這種情況的出現(xiàn)，應該要知道qml的兩種使用方式：

1.暴露QML源碼的使用方法，即不對QML文件進行處理，存放在可執(zhí)行文件的目錄下，使用QtDeclarative模塊動態(tài)載入，一般適合以開源程序;

2.混淆QML源碼的使用方法，即將QML文件加入到qt資源系統(tǒng)，編譯成二進制文件供QtDeclarative模塊使用，這樣的好處，是可以隱藏代碼，供商業(yè)項目使用。

在前種的使用方式中，Image元素對于讀取資源路徑正確無誤，在Mac.OS.X，Ubuntu和windows平臺上表示一致，但是后者，卻出現(xiàn)了不同。

假設Image以如下代碼使用:

QML是門相當新的UI描述語言，因此在文檔上總難免有疏漏之處，如果因此產(chǎn)生了bug，則就需要花費大量的時間去排查。

在最近筆者使用QML的過程中，在Image獲取資源路徑的細節(jié)上就出現(xiàn)了這樣的情況。

Image 是qml中一個非常普通的元素，通常使用方法如下：

QML代碼段所在的QML文件和qtlogo都處在qt資源系統(tǒng)中，xx/me/My Data/picture.jpg則值的是三個系統(tǒng)下實際的絕對路徑,這是很異常的情況發(fā)生了。

在windows下Image的表現(xiàn)很正常，但是在Ubuntu下，卻無法正常顯示系統(tǒng)路徑中的圖片picure.jpg，一個代碼顯示出不同的結果來是相當費解的事,但是事實確很簡單，這個source提供Url的寫法是錯誤的，一個錯誤的代碼自然會出現(xiàn)異常情況。

當QML處在qt 資源系統(tǒng)中，它獲取圖片的路徑自然也是去qt資源系統(tǒng)中獲得了，也就是說上述的兩個路徑變成了qrc:xx/me/My Data/picture.jpg和qrc:resource/qtlogo.png，前者根本不在資源系統(tǒng)內(nèi)，自然就不會顯示了。

當然，對這樣的情況自然有正確的解決辦法，那就是對前者路徑的使用應該使用file:///xx/me/My Data/picture.jpg，這樣QML才會正常解析為本地文件的路徑。

至此，對于Image 資源路徑可以總結出三個規(guī)律：

1.在沒用使用qt資源系統(tǒng)時，Image的路徑可以是絕對或者相對，并不需要特殊的表示;

2.當使用qt資源系統(tǒng)時，如果要特定知指向本地路徑中的圖片資源，那就要使用file://標示;

3.當獲取網(wǎng)絡圖片資源并使用使用qt資源系統(tǒng)，由于有http表示存在，QML會自然去除qrc:標示。

其中第三點文中并沒有說明，但是有興趣的同學可以去試試。