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.