Nativescript Image Cache
Nativescript image caching plugin using Fresco for Android and SDWebImageCache for iOS
Installation
tns plugin add nativescript-image-cache
Support NativeScript ~3.0.0 with Angular
Properties
| Property Name | Value | Platform |
|---|---|---|
stretch |
aspectFill, aspectFit, fill, none | ios,android |
src |
string | ios,android |
placeholder |
string | ios,android |
placeholderStretch |
aspectFill, aspectFit, fill, none | android |
radius |
number | android |
rounded |
boolean | android |
Basic Usage
Nativescript Angular
Initialization
import { initializeOnAngular } from 'nativescript-image-cache';
export class AppComponent {
constructor () {
initializeOnAngular();
}
}
Example usage:
<NSImage #myImage stretch="aspectFill" radius="20" src="res://logo">
</NSImage>
Nativescript Vanilla
Initialization (android only)
const imageCache = require('nativescript-image-cache');
if (application.android) {
application.on('launch', () => {
imageCache.initialize();
});
}
Example usage:
<Page xmlns:IC="nativescript-image-cache">
<GridLayout rows='*' columns='*'>
<IC:NSImage stretch="fill" row="0"
col="0" placeholder="res://placeholder"
src="res://logo">
</IC:NSImage>
</GridLayout>
</Page>
Caching Image
Default cache purge time can be specified in number of days.
import { setCacheLimit } from 'nativescript-image-cache';
const cacheLimitInDays : number = 7;
setCacheLimit(cacheLimitInDays);
Clearing Cache
Default cache time for SDWebImageCache is 7 days, and for Fresco is 60 days.
import { clearCache } from 'nativescript-image-cache';
clearCache();
(Android Only), you need to initialize in the application onlaunch event before clearing the cache
Credits
The starting point for this plugin was this great plugin.
-
博主简介：知名前端工程师！ ✒️ 出没地点：重庆-沙坪坝 交流扣群：559658154，欢迎您的加入！ ——————————————————————————————————————————— 版权声明：本文为 CSDN 博主「Lady Marry」的原创文章，转载请附上原文出处链接及本声明。 一. Preload / Prefetch 我们前面已经做了代码分割，同时会使用 import 动
-
NativeScript Image Colors Example import { ImageColors } from 'nativescript-image-colors';let image = page.getViewById<Image>(`image`);colors = ImageColors.getColorPalette(image);colors.color1;colors
-
NativeScript-Image-Filters Nativescript plugin for native image filters. Sample Installation From your command prompt/termial go to your app's root folder and execute: NativeScript Version 7+:tns plug
-
The author of this plugin will continue to support it in a separate repo exclusively as part of ProPlugins. This repo will remain supported by the NativeScript community. Contribution - help wanted Th
-
描述 图片展示组件，类似于 HTML image 标签，但提供了更丰富的功能，使用时需指定样式宽高值。 安装 $ npm install rax-image --save 属性 属性 类型 默认值 必填 描述 支持 source Object: {uri: String} - ✔️ 设置图片的 uri style Object: { width: Number height: Number } -
-
图片操作. 支持 安装 $ npm install universal-image --save 方法 choose(options) 拍照或从本地相册中选择图片。 参数 属性 类型 默认值 必选 描述 支持 count Number 1 x 最大可选照片数 sizeType String Array ['original', 'compressed'] x original 原图，compres
-
简介 <image> 用于在界面中显示单个图片。 TIP 在代码中请使用 <image> 标签, <img> 的存在只是因为兼容性原因，在将来的版本中可能删除。 Weex 没有内置的图片库，因为一些开源项目如 SDWebImage 和Picasso已经能很好的解决这个问题， 所以在使用 <image> 之前，请在 native 侧先接入相应的 adapter 或者 handler。参见: Andr