BB10 Cascades介紹之Image和ImageTracker

Image和ImageTracker

Image控件負責載入本地圖片，包括資源圖片和本地路徑的圖片，它必須是即刻得到且不會失敗的。

// Absolute path
ImageView {
    imageSource: "asset:///images/myimage.png"  
}
 
// Relative path
ImageView {
    imageSource: "images/myimage.png"  
}

當然，如果外部圖片在本地，可以即刻得到，也可以使用Image控件，需要使用絕對路徑並加file://前綴。可能需要藉助C++來取得QDir::currentPath路徑：

// ApplicationUI.cpp
 
// Load the QML file
QmlDocument *qml = QmlDocument::create("asset:///main.qml");
 
// Retrieve the path to the app's working directory
QString workingDir = QDir::currentPath();
 
// Build the path, add it as a context property, and expose
// it to QML
QDeclarativePropertyMap* dirPaths = new QDeclarativePropertyMap;
dirPaths->insert("camera", QVariant(QString(
        "file://" + workingDir + "/shared/camera/")));
qml->setContextProperty("dirPaths", dirPaths);
// main.qml
 
// Load the image asynchronously
ImageView {
    imageSource: dirPaths.camera + "camera0001.jpg" 
}

從網絡得圖片是異步操作，需要在Image中包含ImageTracker，將它的imageSource屬性設置爲圖片地址，並編寫onStateChanged事件處理函數，賦值Image.imgae =

ImageTracker.image：
ImageView {
    id: myImageView
    attachedObjects: [
        ImageTracker {
            id: tracker
            imageSource: "images/image.png"
               
            onStateChanged: {                    
                if (state == ResourceState.Loaded)
                {
                    myImageView.image = tracker.image
                }
            }
        }
    ]
}

參考網頁：http://developer.blackberry.com/cascades/documentation/ui/image_resources/index.html