Question

我想知道Titanium如何处理图像。如果我要在图像视图中加载图像，然后将图像视图中的图像更改为本地图像，然后将图像更改回上一个图像，图像视图是否需要再次下载上一个图像？

不确定Titanium如何处理下载的图像，但我认为它不会缓存它们。

我以为我可以创建一些屏幕外图像并将其他图像视图设置到他们的图像网址，但这会有用吗？或者图像视图会下载图像吗？

试图弄清楚图像视图在钛合金中是如何工作的，以及确保我可以预加载/重复使用图像的最佳方法。

由于

Answer 1

2015年4月更新：截至Titanium 3.X，根据Gautier的回答，图片中有缓存

默认情况下，ImageView中没有缓存远程图像。在您的方案中，当您切换回远程图像时，它将再次重新加载。

在我的大多数项目中，我创建了一个cachingImageView，它在下载后保存本地图像。这是受道森托特在https://gist.github.com/938172的工作的启发。唯一的问题是，如果服务器上的映像在本地缓存后发生更改，则除非文件名更改，否则客户端不会获取更新的映像。代码如下。

exports.createCachingImageView = function(params) {
    var image = Ti.UI.createImageView();

    image.doRemote = function(imageURL) {
        image.remoteImage = imageURL;
        var file = Ti.Filesystem.getFile(somedirectory, image.localFileName(imageURL));

        if(!file.exists()) {
             // cached file does not exist, load the image
            image.addEventListener("load", image.saveImageOnLoad);
            image.image = imageURL;
        } else {
            Ti.API.debug(image.localFileName(imageURL) + ' does exist, just setting image');
            image.image = file.nativePath;
        }
    };

    image.saveImageOnLoad = function(e) {
        Ti.API.debug('saving image ' + image.localFileName(image.remoteImage));
        var f = Ti.Filesystem.getFile(somedirectory, image.localFileName(image.remoteImage));
        if(!f.read()) {
            f.write(e.source.toBlob());
        }
        e.source.removeEventListener('load', image.saveImageOnLoad);
    };

    image.localFileName = function(imageURL) {
        hashedSource = Ti.Utils.md5HexDigest(imageURL + '');
        return hashedSource;
    };
    if(params.image) {
        image.doRemote(params.image);
    }

    for(var v in params) {
        if(v != 'image') {
            image[v] = params[v];
        }
    }

    return image;
};

如果您想在不使用imageView的情况下单独下载图像，请使用Ti.Network.httpClient获取图像并将其保存到文件系统中，如下所示：

xhr.onload = function(){    
  var file = Ti.Filesystem.getFile(somedirectory, somefilename );
  file.write(this.responseData);
}

我使用它来提前获取图像，因此当客户端使用它们时它们应立即获取。

Answer 2

挖出这个相当古老的问题，因为我必须做同样的事情。

来自Android 3.1＆amp; iOS，现在是默认缓存：请参阅http://docs.appcelerator.com/titanium/latest/#!/guide/Image_Best_Practices-section-30082525_ImageBestPractices-Cachingremoteimages

在Android平台上，缓存限制为25 MB和数据保留应用程序的生命周期（只要它已安装在设备上）。在iOS平台上，缓存大小未预先确定（无法保证大小）并且数据保持在那里直到iOS清理目录（需要更多本地存储）。

此文档页面也有自己的图像手动缓存实现。

var Utils = {
  /* modified version of https://gist.github.com/1243697 */
  _getExtension: function(fn) {
    // from http://stackoverflow.com/a/680982/292947
    var re = /(?:\.([^.]+))?$/;
    var tmpext = re.exec(fn)[1];
    return (tmpext) ? tmpext : '';
  },
  RemoteImage: function(a){
    a = a || {};
    var md5;
    var needsToSave = false;
    var savedFile;
    if(a.image){
      md5 = Ti.Utils.md5HexDigest(a.image)+this._getExtension(a.image);
      savedFile = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory,md5);
      if(savedFile.exists()){
        a.image = savedFile;
      } else {
        needsToSave = true;
      }
    }
    var image = Ti.UI.createImageView(a);
    if(needsToSave === true){
      function saveImage(e){
        image.removeEventListener('load',saveImage);
        savedFile.write(
          Ti.UI.createImageView({image:image.image,width:'auto',height:'auto'}).toImage()
        );
      }
      image.addEventListener('load',saveImage);
    }
    return image;
  }
};
// example usage
var image = Utils.RemoteImage({
  image:'http://farm7.staticflickr.com/6059/6262552465_e53bccbd52_z.jpg',
  defaultImage:'KS_nav_ui.png',
  width:300,
  height:200,
  top:20
});
win2.add(image);

钛预载图像

2 个答案: