javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-16 11:42:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: update image source documentation snippets and tests (#5390)

Browse Source
This commit is contained in:
Nick Iliev
2018-02-07 14:58:28 +02:00
committed by GitHub
parent 85dc75e09a
commit 7121eaea89
4 changed files with 71 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
tests/app/http/http-tests.ts
View File

@ -164,8 +164,8 @@ export var test_getImage = function (done) {
var result;
// >> http-get-image
http.getImage("https://httpbin.org/image/png").then(function (r) {
//// Argument (r) is Image!
http.getImage("https://httpbin.org/image/png").then((r) => {
// Argument (r) is ImageSource!
// >> (hide)
result = r;
try {
@ -176,10 +176,10 @@ export var test_getImage = function (done) {
done(err);
}
// << (hide)
}, function (e) {
//// Argument (e) is Error!
}, (err) => {
// Argument (e) is Error!
// >> (hide)
done(e);
done(err);
// << (hide)
});
// << http-get-image

10
tests/app/image-source/image-source-snippet.ts
View File

@ -1,16 +1,16 @@
import * as imageSource from "tns-core-modules/image-source";
// >> imagesource-from-imageasset-save-to
import * as fs from "tns-core-modules/file-system";
// >> imagesource-from-imageasset-save-to
export function imageSourceFromAsset(imageAsset) {
let source = new imageSource.ImageSource();
source.fromAsset(imageAsset).then((source) => {
source.fromAsset(imageAsset).then((imageSource) => {
let folder = fs.knownFolders.documents().path;
let fileName = "test.png"
let fileName = "test.png";
let path = fs.path.join(folder, fileName);
let saved = source.saveToFile(path, "png");
let saved = imageSource.saveToFile(path, "png");
if (saved) {
console.log("saved image")
console.log("Image saved successfully!");
}
})
}

42
tests/app/image-source/image-source-tests.ts
View File

@ -1,12 +1,4 @@
// >> imagesource-require
// const imageSource = require("image-source");
// << imagesource-require
// >> imagesource-require-alt
// const fs = require("file-system");
// << imagesource-require-alt
import * as imageSource from "tns-core-modules/image-source";
import * as imageSource from "tns-core-modules/image-source";
import * as fs from "tns-core-modules/file-system";
import * as app from "tns-core-modules/application";
import * as TKUnit from "../TKUnit";
@ -19,17 +11,17 @@ export function testFromResource() {
// >> imagesource-resname
const img = imageSource.fromResource("icon");
// << imagesource-resname
TKUnit.assert(img.height > 0, "image.fromResource failed");
}
export function testFromUrl(done) {
let result: imageSource.ImageSource;
// >> imagesource-load-url
// Deprecated method fromUrl
imageSource.fromUrl("https://www.google.com/images/errors/logo_sm_2.png")
.then(function (res: imageSource.ImageSource) {
.then((res: imageSource.ImageSource) => {
// console.log("Image successfully loaded");
// >> (hide)
// completed = true;
result = res;
try {
@ -40,15 +32,11 @@ export function testFromUrl(done) {
catch (e) {
done(e);
}
// << (hide)
}, function (error) {
}, (error) => {
// console.log("Error loading image: " + error);
// >> (hide)
//completed = true;
done(error);
// << (hide)
});
// << imagesource-load-url
}
export function testSaveToFile() {
@ -88,17 +76,19 @@ export function testNativeFields() {
const fullAndroidPng = "iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAA3NCSVQICAjb4U/gAAAAFUlEQVQImWP8z4AAjAz/kTnIPGQAAG86AwGcuMlCAAAAAElFTkSuQmCC";
const fullIosPng = "iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAAXNSR0IArs4c6QAAABxpRE9UAAAAAgAAAAAAAAACAAAAKAAAAAIAAAACAAAARiS4uJEAAAASSURBVBgZYvjPwABHSMz/DAAAAAD//0GWpK0AAAAOSURBVGNgYPiPhBgQAACEvQv1D5y/pAAAAABJRU5ErkJggg==";
const fullJpegImage = "/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAAEAAQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+Pz/h5j+1Z/z9fBr/AMRt+AH/AM7uiiiv9fV9E36KOn/HMX0f+n/NlvDT/p3/ANUv/V3vrf8AP1nueaf8LOa9P+ZjjP8Ap3/0/wD6u99b/wD/2Q==";
const jpgImageAsBase64String = "/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/2wBDAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQH/wAARCAAEAAQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD+Pz/h5j+1Z/z9fBr/AMRt+AH/AM7uiiiv9fV9E36KOn/HMX0f+n/NlvDT/p3/ANUv/V3vrf8AP1nueaf8LOa9P+ZjjP8Ap3/0/wD6u99b/wD/2Q==";
const expectedJpegStart = "/9j/4AAQSkZJRgAB";
const expectedPngStart = "iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAA";
export function testBase64Encode_PNG() {
// >> imagesource-to-base-string
const img = imageSource.fromFile(smallImagePath);
let result = img.toBase64String("png");
let base64String = img.toBase64String("png");
// << imagesource-to-base-string
result = result.substr(0, expectedPngStart.length);
base64String = base64String.substr(0, expectedPngStart.length);
TKUnit.assertEqual(
result,
base64String,
expectedPngStart,
"Base 64 encoded PNG");
}
@ -106,18 +96,20 @@ export function testBase64Encode_PNG() {
export function testBase64Encode_JPEG() {
const img = imageSource.fromFile(smallImagePath);
let result = img.toBase64String("jpeg");
result = result.substr(0, expectedJpegStart.length);
let base64String = img.toBase64String("jpeg");
base64String = base64String.substr(0, expectedJpegStart.length);
TKUnit.assertEqual(
result,
base64String,
expectedJpegStart,
"Base 64 encoded JPEG");
}
export function testLoadFromBase64Encode_JPEG() {
// >> imagesource-from-base-string
let img: imageSource.ImageSource;
img = imageSource.fromBase64(fullJpegImage);
img = imageSource.fromBase64(jpgImageAsBase64String);
// << imagesource-from-base-string
TKUnit.assert(img !== null, "Actual: " + img);
TKUnit.assertEqual(img.width, 4, "img.width");

42
tests/app/image-source/image-source.md
View File

@ -7,24 +7,50 @@ previous_url: /ApiReference/image-source/HOW-TO
---
# Image source
Using the image source requires the image-source module.
{%snippet imagesource-require%}
```TypeScript
import * as imageSource from "tns-core-modules/image-source";
```
```JavaScript
var imageSource = require("tns-core-modules/image-source");
```
The pre-required `imageSource` module is used throughout the following code snippets.
We also use fs module defined as follows:
{%snippet imagesource-require-alt%}
```TypeScript
import * as fs from "tns-core-modules/file-system";
```
```JavaScript
var fs = require("tns-core-modules/file-system");
```
## Loading and saving images
### Load image using resource name
This is similar to loading Bitmap from `R.drawable.logo` on Android or calling `[UIImage imageNamed@"logo"]` on iOS
This is similar to loading Bitmap from `R.drawable.logo` on Android or calling `[UIImage imageNamed@"logo"]` on iOS.
The method `fromResource` creates an `ImageSource` instance and loads it from the specified resource name.
{%snippet imagesource-resname%}
### Load image from URL
{%snippet imagesource-load-url%}
### Save image source to PNG or JPG file
### Save image to PNG or JPG file
The method `saveToFile(path: string, format: "png" | "jpeg" | "jpg", quality?: number): boolean` saves `ImageSource` instance to the specified file, using the provided image format and quality.
The supported formats are `png`, `jpeg`, and `jpg`. The quality parameter is optional and defaults to maximum quality. Returns `true` if the file is saved successfully.
{%snippet imagesource-save-to%}
### Load image from a local file
Use `fromFile(path: string): Promise<boolean>` to load an `ImageSource` instance from the specified file asynchronously.
{%snippet imagesource-load-local%}
### Save image source from imageAsset to PNG file
### Load image from URL
Use `http.getImage(url: string): Promise<ImageSource>` to fetch `ImageSource` from online source.
{%snippet http-get-image%}
### Save image from image asset to PNG file
Use `fromAsset(asset: ImageAsset): Promise<ImageSource>` to load `ImageSource` from the specified `ImageAsset` asynchronously.
{%snippet imagesource-from-imageasset-save-to%}
### Creating base64 string from PNG image file
The method `toBase64String(format: "png" | "jpeg" | "jpg", quality?: number): string` converts the image to base64 encoded string, using the provided image format and quality.
The supported formats are `png`, `jpeg`, and `jpg`. The quality parameter is optional and defaults to maximum quality.
{%snippet imagesource-to-base-string%}
### Creating PNG image file from base64 string
The method `fromBase64(source: string): Promise<boolean>` loads this instance from the specified base64 encoded string asynchronously.
{%snippet imagesource-from-base-string%}