Improve ImageAsset scaling (#5110)

* Do not depend on current device screen while calculating Image Asset size.

* Scale the image asset to the exact requested size.

* Process image assets natively, pass keepAspectRatio based on the stretch property and Asset options.

* Fixed the splashscreen resource name as it cannot be read when containing a dot.

* Updated the Image Asset scale and rotate logic based on the Native one.

* Make the ImageAsset size more important than the Image decode size as its more specific.

* Fixed tslint errors.

* Added filePath support in the ImageAsset constructor for iOS in order to unify it with the Android implementation, support for relative files and file not found support errors.

* Added unit tests for ImageAssets.

* Added a sample app for UI testing of image-view with ImageAsset src.

* chore: apply PR comments
This commit is contained in:
Dimitar Tachev
2018-02-28 14:04:01 +02:00
committed by Alexander Djenkov
parent 27622d83ba
commit a94ec9946f
17 changed files with 262 additions and 21 deletions

View File

@@ -4,6 +4,7 @@
} from "./image-common";
import { knownFolders } from "../../file-system";
import * as platform from "../../platform";
export * from "./image-common";
const FILE_PREFIX = "file:///";
@@ -82,12 +83,27 @@ export class Image extends ImageBase {
}
if (!value) {
imageView.setUri(null, 0, 0, false, true);
imageView.setUri(null, 0, 0, false, false, true);
return;
}
const async = this.loadMode === ASYNC;
let screen = platform.screen.mainScreen;
let decodeWidth = Math.min(this.decodeWidth, screen.widthPixels);
let decodeHeight = Math.min(this.decodeHeight, screen.heightPixels);
let keepAspectRatio = this._calculateKeepAspectRatio();
if (value instanceof ImageAsset) {
if (value.options) {
decodeWidth = value.options.width || decodeWidth;
decodeHeight = value.options.height || decodeHeight;
keepAspectRatio = !!value.options.keepAspectRatio;
}
// handle assets as file paths natively
value = value.android;
}
const async = this.loadMode === ASYNC;
if (typeof value === "string" || value instanceof String) {
value = value.trim();
this.isLoading = true;
@@ -97,24 +113,28 @@ export class Image extends ImageBase {
super._createImageSourceFromSrc(value);
} else if (isFileOrResourcePath(value)) {
if (value.indexOf(RESOURCE_PREFIX) === 0) {
imageView.setUri(value, this.decodeWidth, this.decodeHeight, this.useCache, async);
imageView.setUri(value, decodeWidth, decodeHeight, keepAspectRatio, this.useCache, async);
} else {
let fileName = value;
if (fileName.indexOf("~/") === 0) {
fileName = knownFolders.currentApp().path + "/" + fileName.replace("~/", "");
}
imageView.setUri(FILE_PREFIX + fileName, this.decodeWidth, this.decodeHeight, this.useCache, async);
imageView.setUri(FILE_PREFIX + fileName, decodeWidth, decodeHeight, keepAspectRatio, this.useCache, async);
}
} else {
// For backwards compatibility http always use async loading.
imageView.setUri(value, this.decodeWidth, this.decodeHeight, this.useCache, true);
imageView.setUri(value, decodeWidth, decodeHeight, keepAspectRatio, this.useCache, true);
}
} else {
super._createImageSourceFromSrc(value);
}
}
private _calculateKeepAspectRatio(): boolean {
return this.stretch === "fill" ? false : true;
}
[stretchProperty.getDefault](): "aspectFit" {
return "aspectFit";
}