如何下載圖像並將其顯示在NativeScript應用程序中？

Question

我正在創建一個本應可在Android和iOS上工作的NativeScript應用程序。我需要顯示一些S3存儲桶中的圖像。

因爲我想在下載圖像時顯示一些進度指示器，我認爲我應該在本地下載圖像，而不是僅設置圖像組件的源屬性。什麼是最好的事情？

Answer 1

經過多一點研究後，我發現這個樣本https://github.com/telerik/nativescript-sample-cuteness/blob/master/nativescript-sample-cuteness/，它有大量從互聯網下載的圖像。

我使用的是一個名爲的模塊，image-cache可以解決這個問題。

這是我用更精確：

var imageSourceModule = require("image-source"); 
var imageCache = require("ui/image-cache"); 

var cache = new imageCache.Cache(); 
var defaultImageSource = imageSourceModule.fromFile("~/app/res/loading.gif"); 
var defaultNotFoundImageSource = imageSourceModule.fromFile("~/app/res/no-image.png"); 

cache.invalid = defaultNotFoundImageSource; 
cache.placeholder = defaultImageSource; 
cache.maxRequests = 5; 

function displayImage(viewModel, url, propertyName) { 
    var source = cache.get(url); 

    propertyName = propertyName || "image"; 

    if (source) { 
    viewModel.set(propertyName, source); 
    } else { 
    viewModel.set(propertyName, defaultImageSource); 
    cache.push({ 
     key: url, 
     url: url, 
     completed: function (result, key) { 
     if (key === url) { 
      viewModel.set(propertyName, result); 
     } 
     } 
    }); 
    } 
} 

如果有一個更好的解決方案，我會很樂意學習一下吧。