javascript - 画像をダウンロードして 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);
        }
      }
    });
  }
}

より良い解決策があれば、喜んでそれについて学びたいと思います。