yezarela / nativescript-image-cache Goto Github PK

View Code? Open in Web Editor NEW

13.0 2.0 9.0 2.1 MB

:zap: Nativescript image caching plugin using Fresco for Android and SDWebImageCache for iOS

License: MIT License

TypeScript 99.87% Ruby 0.13%

nativescript image-cache fresco sdwebimage typescript

nativescript-image-cache's People

Contributors

Stargazers

Watchers

Forkers

bnussey rowandh sis0k0 sethboyd tronix117 keetup-development newapx hiperbou

nativescript-image-cache's Issues

navigation problem

Hi, when i navigate with slide transition, images disappears from old page on android.

Problem with ngFor in AngularJS

Hi,

Thanks for the plugin. During my testing images were missed when I had tried to load multiple images in one page using ngFor. Will you please check?

<ScrollView orientation="vertical" >
        <StackLayout>
            <StackLayout class="cardStack" *ngFor="let post of articles" >
                <NSImage *ngIf="post.img.image_fulltext" style="height: 120; width: 120"  src="{{baseURL}}/{{post.img.image_fulltext}}"></NSImage>
            </StackLayout>
        </StackLayout>
    </ScrollView>

Thanks in advance :)

setImageWithURLPlaceholderImageCompleted is not a function

I am using Nativescript+angular project.
I am getting following error on iOS devices.

Does any one know how to resolve this error..??

file:///app/tns_modules/nativescript-image-cache/ns-image-cache.js:146:66: JS ERROR TypeError: image.ios.sd_setImageWithURLPlaceholderImageCompleted is not a function. (In 'image.ios.sd_setImageWithURLPlaceholderImageCompleted(value, placeholderImage, function () {

                image.isLoading = false;

            })', 'image.ios.sd_setImageWithURLPlaceholderImageCompleted' is undefined)



file:///app/tns_modules/nativescript-image-cache/ns-image-cache.js:146:66: JS ERROR TypeError: image.ios.sd_setImageWithURLPlaceholderImageCompleted is not a function. (In 'image.ios.sd_setImageWithURLPlaceholderImageCompleted(value, placeholderImage, function () {

                image.isLoading = false;

            })', 'image.ios.sd_setImageWithURLPlaceholderImageCompleted' is undefined)

stretch not working

The stretch attribute seems not to be working.

Whatever I put in it (aspectFill, aspectFit, etc.), I inspect it on the Chrome dev tools debugger, and it's always 'fill'.

Seems to be the same on Android and iOS.

As a result, if I have a picture of, say, 120x120px with a square in it... it will look as a rectangle.

Currently on TNS 3.2.1, and nativescript-image-cache 1.0.8

How to retry loading the image

Due to some issue on the back end (have no idea why), sometimes image fails to load from the server. 😢
How can we retry to load the same resource if the rendering failed?

I have tried adding try / catch block to various places in the code, but none of it seems to work.

The issue happens both when the NSImage is used in the Listview and in the other containers.

The only error I get is onFailure 408 java.io.EOFException.

If I scroll back to the place where the image is supposed to be, it loads fine. So I guess having a second try won't hurt. It happens quite often.

I guess a retry code needs to be added here

onFailure: function (id, throwable) {
            console.log('onFailure', id, throwable);
            if (throwable == "java.io.EOFException") {
              
            }
        }

but I am struggling to figure out what to add.

Snapshot issue

If I add require("nativescript-image-cache"); to vendors.ts file, because I'd like to put the plugin in the snapshot code - the webpack will fail with status:

# Script run failed in <embedded>@1740:1547
ReferenceError: com is not defined

#
# Fatal error in ../src/snapshot/mksnapshot.cc, line 175
# Check failed: blob.data.
#

Snapshot generation failed with the following error:
Error: Cannot find suitable v8 version! Original error: # Script run failed in <embedded>@1740:1547
ReferenceError: com is not defined

#
# Fatal error in ../src/snapshot/mksnapshot.cc, line 175
# Check failed: blob.data.
#

    at getV8Version.then.catch.error (/Users/dvdbrk/sample-app/node_modules/nativescript-dev-webpack/snapshot/android/project-snapshot-generator.js:254:15)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

Any ideas on how to optimise the plugin so it can be snapshotted?

There is a great article on topic at https://www.nativescript.org/blog/improving-app-startup-time-on-android-with-webpack-v8-heap-snapshot.

@sis0k0 has also done Firebase plugin optimisation (https://github.com/EddyVerbruggen/nativescript-plugin-firebase), but I am not sure how to apply the same changes to this plugin.

Does anyone know at least how to debug the process?

is it still actively maintained?

imageCache.clearDisk() is not a function - platform IOS

Hi,
the issue occur on: ios
the issue occur on the first run of the application after a fresh install
the issue occur with the following version numbers :
"nativescript-image-cache": "^1.0.8",
CLI 3.2.1:
Cross-platform modules: 3.2.0
Runtime(s): "tns-ios": "3.2.0"
"tns-android": "3.2.0"

everytime i reinstall the application on ios i get the following error :

imageCache.clearDisk is not a function. (In 'imageCache.clearDisk()','imageCache.clearDisk' is undefined)
clearCache@file:///app/tns_modules/nativescript-image-cache/ns-imagecache.js:191:25
setCacheLimit@file:///app/tns_modules/nativescript-image-cache/ns-image-cache.js173:19
ngOnInit@file:///app/app.componenet.js:44:49

the error occur only one time on the first run and disappear if i close and reopen the app

Cannot find module 'ui/core/view'

When I add this plugin in my nativescript project, this plugin always shows error

ERROR in node_modules/nativescript-image-cache/ns-image-cache.d.ts:1:22 - error TS2307: Cannot find module 'ui/core/view'.

And I must change the module path manually.
Please help me to fix it.

Demo is out Dated its not working for angular

error log is

System.err: com.tns.NativeScriptException:
System.err: Calling js method getView failed
System.err: TypeError: Could not load view for: ImageCacheIt.Error: com.tns.NativeScriptException: Failed to find module: "nativescript-image-cache-it", relative to: app/tns_modules/
System.err:     com.tns.Module.resolvePathHelper(Module.java:146)
System.err:     com.tns.Module.resolvePath(Module.java:55)
System.err:     com.tns.Runtime.callJSMethodNative(Native Method)
System.err:     com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1088)
System.err:     com.tns.Runtime.callJSMethodImpl(Runtime.java:970)
System.err:     com.tns.Runtime.callJSMethod(Runtime.java:957)
System.err:     com.tns.Runtime.callJSMethod(Runtime.java:941)
System.err:     com.tns.Runtime.callJSMethod(Runtime.java:933)
System.err:     com.tns.gen.android.widget.BaseAdapter_frnal_ts_helpers_l58_c38__ListViewAdapter.getView(BaseAdapter_frnal_ts_helpers_l58_c38__ListViewAdapter.java:47)
System.err:     android.widget.AbsListView.obtainView(AbsListView.java:2346)
System.err:     android.widget.ListView.measureHeightOfChildren(ListView.java:1280)
System.err:     android.widget.ListView.onMeasure(ListView.java:1188)
System.err:     android.view.View.measure(View.java:18788)
System.err:     org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     org.nativescript.widgets.StackLayout.onMeasure(StackLayout.java:83)
System.err:     android.view.View.measure(View.java:18788)
System.err:     org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     org.nativescript.widgets.MeasureHelper.measureChildFixedColumnsAndRows(GridLayout.java:1055)
System.err:     org.nativescript.widgets.MeasureHelper.measure(GridLayout.java:865)
System.err:     org.nativescript.widgets.GridLayout.onMeasure(GridLayout.java:279)
System.err:     android.view.View.measure(View.java:18788)
System.err:     org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     org.nativescript.widgets.ContentLayout.onMeasure(ContentLayout.java:32)
System.err:     android.view.View.measure(View.java:18788)
System.err:     android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     android.widget.FrameLayout.onMeasure(FrameLayout.java:194)
System.err:     android.view.View.measure(View.java:18788)
System.err:     android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     android.widget.LinearLayout.measureChildBeforeLayout(LinearLayout.java:1465)
System.err:     android.widget.LinearLayout.measureVertical(LinearLayout.java:748)
System.err:     android.widget.LinearLayout.onMeasure(LinearLayout.java:630)
System.err:     android.view.View.measure(View.java:18788)
System.err:     android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     android.widget.FrameLayout.onMeasure(FrameLayout.java:194)
System.err:     com.android.internal.policy.PhoneWindow$DecorView.onMeasure(PhoneWindow.java:2643)
System.err:     android.view.View.measure(View.java:18788)
System.err:     android.view.ViewRootImpl.performMeasure(ViewRootImpl.java:2100)
System.err:     android.view.ViewRootImpl.measureHierarchy(ViewRootImpl.java:1216)
System.err:     android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:1452)
System.err:     android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1107)
System.err:     android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6013)
System.err:     android.view.Choreographer$CallbackRecord.run(Choreographer.java:858)
System.err:     android.view.Choreographer.doCallbacks(Choreographer.java:670)
System.err:     android.view.Choreographer.doFrame(Choreographer.java:606)
System.err:     android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:844)
System.err:     android.os.Handler.handleCallback(Handler.java:739)
System.err:     android.os.Handler.dispatchMessage(Handler.java:95)
System.err:     android.os.Looper.loop(Looper.java:148)
System.err:     android.app.ActivityThread.main(ActivityThread.java:5417)
System.err:     java.lang.reflect.Method.invoke(Native Method)
System.err:     com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
System.err:     com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
System.err: File: "file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js, line: 15104, column: 8
System.err: StackTrace:
System.err:     Frame: function:'getViewClass', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/nativescript-angular/element-registry.js', line: 88, column: 15
System.err:     Frame: function:'ViewUtil.createView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/nativescript-angular/view-util.js', line: 201, column: 44
System.err:     Frame: function:'NativeScriptRenderer.createElement', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/nativescript-angular/renderer.js', line: 109, column: 30
System.err:     Frame: function:'DebugRenderer2.createElement', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 15203, column: 49
System.err:     Frame: function:'createElement', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 10576, column: 27
System.err:     Frame: function:'createViewNodes', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 13741, column: 61
System.err:     Frame: function:'createEmbeddedView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 13657, column: 5
System.err:     Frame: function:'callWithDebugContext', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 15094, column: 42
System.err:     Frame: function:'debugCreateEmbeddedView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 14406, column: 12
System.err:     Frame: function:'TemplateRef_.createEmbeddedView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 11732, column: 38
System.err:     Frame: function:'ViewContainerRef_.createEmbeddedView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 11444, column: 52
System.err:     Frame: function:'ListViewComponent.onItemLoading', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/nativescript-angular/directives/list-view-comp.js', line: 113, column: 35
System.err:     Frame: function:'Observable.notify', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/tns-core-modules/data/observable/observable.js', line: 100, column: 32
System.err:     Frame: function:'ListViewAdapter.getView', file:'file:///data/data/org.nativescript.demong/files/app/tns_modules/tns-core-modules/ui/list-view/list-view.js', line: 242, column: 24
System.err:     at com.tns.Runtime.callJSMethodNative(Native Method)
System.err:     at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1088)
System.err:     at com.tns.Runtime.callJSMethodImpl(Runtime.java:970)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:957)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:941)
System.err:     at com.tns.Runtime.callJSMethod(Runtime.java:933)
System.err:     at com.tns.gen.android.widget.BaseAdapter_frnal_ts_helpers_l58_c38__ListViewAdapter.getView(BaseAdapter_frnal_ts_helpers_l58_c38__ListViewAdapter.java:47)
System.err:     at android.widget.AbsListView.obtainView(AbsListView.java:2346)
System.err:     at android.widget.ListView.measureHeightOfChildren(ListView.java:1280)
System.err:     at android.widget.ListView.onMeasure(ListView.java:1188)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     at org.nativescript.widgets.StackLayout.onMeasure(StackLayout.java:83)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     at org.nativescript.widgets.MeasureHelper.measureChildFixedColumnsAndRows(GridLayout.java:1055)
System.err:     at org.nativescript.widgets.MeasureHelper.measure(GridLayout.java:865)
System.err:     at org.nativescript.widgets.GridLayout.onMeasure(GridLayout.java:279)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at org.nativescript.widgets.CommonLayoutParams.measureChild(CommonLayoutParams.java:262)
System.err:     at org.nativescript.widgets.ContentLayout.onMeasure(ContentLayout.java:32)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     at android.widget.FrameLayout.onMeasure(FrameLayout.java:194)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     at android.widget.LinearLayout.measureChildBeforeLayout(LinearLayout.java:1465)
System.err:     at android.widget.LinearLayout.measureVertical(LinearLayout.java:748)
System.err:     at android.widget.LinearLayout.onMeasure(LinearLayout.java:630)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951)
System.err:     at android.widget.FrameLayout.onMeasure(FrameLayout.java:194)
System.err:     at com.android.internal.policy.PhoneWindow$DecorView.onMeasure(PhoneWindow.java:2643)
System.err:     at android.view.View.measure(View.java:18788)
System.err:     at android.view.ViewRootImpl.performMeasure(ViewRootImpl.java:2100)
System.err:     at android.view.ViewRootImpl.measureHierarchy(ViewRootImpl.java:1216)
System.err:     at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:1452)
System.err:     at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1107)
System.err:     at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6013)
System.err:     at android.view.Choreographer$CallbackRecord.run(Choreographer.java:858)
System.err:     at android.view.Choreographer.doCallbacks(Choreographer.java:670)
System.err:     at android.view.Choreographer.doFrame(Choreographer.java:606)
System.err:     at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:844)
System.err:     at android.os.Handler.handleCallback(Handler.java:739)
System.err:     at android.os.Handler.dispatchMessage(Handler.java:95)
System.err:     at android.os.Looper.loop(Looper.java:148)
System.err:     at android.app.ActivityThread.main(ActivityThread.java:5417)
System.err:     at java.lang.reflect.Method.invoke(Native Method)
System.err:     at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
System.err:     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
ActivityManager: Process org.nativescript.demong (pid 3456) has died
17:28:08 - Compilation complete. Watching for file changes.

Not fetching images from cloud [IOS]

When using a external path for the images on the src property, the images are not fetched.

Example:

<NSImage height="250" stretch="aspectFill" src="http://inventore.net/apps/0100315/images/salao1.jpg"></NSImage>

Nevertheless, when using local path like src="res://salao1" is working fine.

Note: I'm testing on an iPhone X emulator.

The project versions used on this project (package.json):
...

"tns-android": {
      "version": "3.3.1"
    },
    "tns-ios": {
      "version": "3.4.0"
    }
  },
  "dependencies": {
    "@angular/animations": "~4.4.1",
    "@angular/common": "~4.4.1",
    "@angular/compiler": "~4.4.1",
    "@angular/core": "~4.4.1",
    "@angular/forms": "~4.4.1",
    "@angular/http": "~4.4.1",
    "@angular/platform-browser": "~4.4.1",
    "@angular/router": "~4.4.1",
    "nativescript-advanced-webview": "^1.2.0",
    "nativescript-angular": "~4.4.0",
    "nativescript-geolocation": "^4.2.2",
    "nativescript-google-maps-sdk": "^2.4.3",
    "nativescript-image-cache": "^1.1.5",
    "nativescript-ngx-fonticon": "^4.0.0",
    "nativescript-pro-ui": "^3.2.0",
    "nativescript-pulltorefresh": "^2.0.3",
    "nativescript-theme-core": "~1.0.2",
    "reflect-metadata": "~0.1.8",
    "rxjs": "~5.4.2",
    "tns-core-modules": "^3.4.0",
    "zone.js": "~0.8.2"
  },
  "devDependencies": {
    "babel-traverse": "6.26.0",
    "babel-types": "6.26.0",
    "babylon": "6.18.0",
    "lazy": "1.0.11",
    "nativescript-dev-typescript": "~0.5.0",
    "typescript": "~2.4.2"
  }

Cannot set property nativeView of #<ViewBase> which has only a getter

Adding this plugin to the fresh project, using latest tns-core-modules results in error:

JS: ERROR Error: Uncaught (in promise): TypeError: Cannot set property nativeView of #<ViewBase> which has only a getter
JS: TypeError: Cannot set property nativeView of #<ViewBase> which has only a getter
JS:     at NSImage.createNativeView (file:///data/data/com.test.app/files/app/tns_modules/nativescript-image-cache/ns-image-cache.js:146:25)
JS:     at NSImage.ViewBase._setupUI (file:///data/data/com.test.app/files/app/tns_modules/tns-core-modules/ui/core/view-base/view-base.js:547:35)

package.json

  "dependencies": {
    "@angular/animations": "~4.2.0",
    "@angular/common": "~4.2.0",
    "@angular/compiler": "~4.2.0",
    "@angular/core": "~4.2.0",
    "@angular/forms": "~4.2.0",
    "@angular/http": "~4.2.0",
    "@angular/platform-browser": "~4.2.0",
    "@angular/router": "~4.2.0",
    "nativescript-angular": "next",
    "nativescript-image-cache": "^1.0.8",
    "nativescript-theme-core": "~1.0.2",
    "reflect-metadata": "~0.1.8",
    "rxjs": "~5.4.0",
    "tns-core-modules": "next",
    "zone.js": "~0.8.2"
  },

Any ideas?

iOS, rounded image issue

While

<NSImage row="0" col="0"  rounded="true" stretch="aspectFit" [src]="item.image"></NSImage>

works on Android, image is not round on iOS. I have tried 'radius' property as well, works on Android, doesn't on iOS. The example above is in the ListView, if it makes any difference. Any ideas?

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.