是否可以通过 decodeWidth 和 decodeHeight 属性减小图像大小

Question

我正在尝试在线保存从相机拍摄的图像。但是图像大小超过了 MB。

我遇到了 decodeWidth 和 decodeHeight 属性，但不知道它是如何工作的。是否可以减小从这些属性中获取的图像的大小。

<StackLayout>
    <Image src="" decodeWidth="400" decodeHeight="400" loadMode="async" />
    <Label text="With loadMode set to async the UI won't be blocked" 
     textWrap="true" />
</StackLayout>

在上传之前，我需要将图像的大小减小到 50 像素或更小。如何做到这一点。

我尝试了类似的方法，但图像未保存。

 let ImageAsset = require('tns-core-modules/image-asset').ImageAsset;

  const asset = new ImageAsset("~/images/nature.jpg");
  asset.options = {
    width: 100,
    height: 100,
    keepAspectRatio: true
  };
  console.log(asset);

  const imageSourceModule = require("tns-core-modules/image-source");
  const fileSystemModule = require("tns-core-modules/file-system");
  const img = imageSourceModule.fromFile(asset._android);
  const folderRoot = fileSystemModule.knownFolders.documents();
  folderRoot._path = "/storage/emulated/0/";
  const folder = folderRoot.getFolder("AAAA/");
  const pathDest = fileSystemModule.path.join(folder._path, `sample.jpg`);

  const exists = fileSystemModule.File.exists(pathDest);

  if (exists == true) {
    const saved = img.saveToFile(pathDest, "jpg");
    if (saved) {
      console.log("Image saved successfully!");
    }
  } else {
    console.log("Image not saved successfully!");
  }

console 

JS: {
JS:   "_observers": {},
JS:   "_options": {
JS:     "width": 100,
JS:     "height": 100,
JS:     "keepAspectRatio": true
JS:   },
JS:   "_android": "/data/data/org.nativescript.cameraplus/files/app/images/nature.jpg"
JS: }
JS: Image not saved successfully!

Answer 1

decodeWidth / decodeHeight 有助于在Image 组件上加载较低分辨率的图像。

要获得调整大小的图像，您可以执行以下操作

import { ImageAsset } from 'tns-core-modules/image-asset';

const asset = new ImageAsset(path);
asset.options = {
  width: 100,
  height: 100,
  keepAspectRatio: true
};

您可以在图片资源上调用getImageAsync() 以获取调整大小的原生图片数据，或者直接将其保存到文件并上传。

更新：

要保存图片，使用图片源模块如下

imageSourceModule.fromAsset(asset)
 .then(img => img.saveToFile(pathDest, "jpg"));