No animation is displayed on Angular

[Sunderik]

Which platform(s) does your issue occur on?

• Android
• iOS/Android versions
• emulator or device. honor 10 lite

Please, provide the following version numbers that your issue occurs with:

• CLI: 6.0.2
• Cross-platform modules: 6.0.1
• Runtime(s): 6.0.0
• Plugin(s):

"dependencies": { "@angular/animations": "8.0.0", "@angular/common": "8.0.0", "@angular/compiler": "8.0.0", "@angular/core": "8.0.0", "@angular/forms": "8.0.0", "@angular/http": "8.0.0-beta.10", "@angular/platform-browser": "8.0.0", "@angular/platform-browser-dynamic": "8.0.0", "@angular/router": "8.0.0", "@nstudio/nativescript-loading-indicator": "^1.0.0", "class-transformer": "^0.2.0", "nativescript-angular": "8.0.2", "nativescript-background-http": "^3.4.0", "nativescript-camera": "^4.4.0", "nativescript-cardview": "^3.1.1", "nativescript-drop-down": "^5.0.2", "nativescript-floatingactionbutton": "^5.0.3", "nativescript-geolocation": "^5.0.0", "nativescript-loading-indicator": "^2.5.1", "nativescript-localstorage": "^2.0.0", "nativescript-photoviewer": "^2.1.1", "nativescript-plugin-firebase": "9.0.2", "nativescript-ripple": "^2.2.1", "nativescript-sentry": "^1.9.1", "nativescript-theme-core": "^1.0.4", "nativescript-ui-dataform": "5.0.0", "nativescript-ui-listview": "7.0.0", "nativescript-ui-sidedrawer": "7.0.0", "reflect-metadata": "^0.1.13", "rxjs": "~6.3.0", "tns-core-modules": "6.0.1", "uglifyjs-webpack-plugin": "^2.1.3", "zone.js": "0.9.1" }, "devDependencies": { "@angular/compiler-cli": "8.0.0", "@nativescript/schematics": "~0.5.0", "@ngtools/webpack": "8.0.0", "codelyzer": "~4.5.0", "nativescript-dev-webpack": "1.0.1", "tslint": "~5.11.0", "tns-platform-declarations": "6.0.1", "node-sass": "4.12.0", "typescript": "3.4.5" }

Is there any code involved?

###Service with the loading indicator ` import { LoadingIndicator, Mode, OptionsCommon } from '@nstudio/nativescript-loading-indicator'; import { Injectable } from "@angular/core";

@Injectable({ providedIn: 'root', }) export class LoadingIndicatorHelper { public loader = new LoadingIndicator(); public options: OptionsCommon = { message: 'Loading...', details: 'Additional detail note!', progress: 0.65, margin: 10, dimBackground: true, color: '#4B9ED6', backgroundColor: 'yellow', userInteractionEnabled: false, hideBezel: true, mode: Mode.AnnularDeterminate, android: { cancelable: true, cancelListener: function (dialog) { console.log('Loading cancelled'); } }, }; }###Show of the indicator in components that.loadingIndicator.loader.show(that.loadingIndicator.options);`

Results

[bradmartin]

Can you try a different Mode value?

[Sunderik]

tried to change the modes, but all have no animation

[Giovanni2293]

Hello, im having this same issue. Im trying to find the option where is a circle animation instead of a bar. Actually the bar works with animation (mode:indeterminate) but i need a Circle, how can i achieve that? because the only circle option is the one reported here and it doesn't have animation. Thank you

[alonstar]

I have the same issue, too. I'm using nativescript 6.0.1 + angular 8.2

[felixkrautschuk]

I have the same issue using NS 6.1 without Angular, but for me the issue occurs only on Android 4 devices

[bradmartin]

Must be an Android version issue. I've got this working fine in a NS 6.1 angular app running on Android 21+

[bradmartin]

Maybe there is an API being used internally not available on lower Android version. Can anyone confirm the results across different Android OS versions

[felixkrautschuk]

@bradmartin I re-tested this behaviour using the demo app on multiple Android devices and emulators and Mode.Indeterminate works as expected on our test devices with Android 5, 6, 7, 8, 9 and Q, but it does not work on Android 4.2, 4.3 and 4.4 devices and emulators (it just shows a circle without any animated spinner)

[bradmartin]

that's good to know 👍 - no promises from me on when I can look at it. However, that seems to indicate some API we're using internally in the android side doesn't work on Android 4x so we should be able to find a workaround or... drop support 😄. Hate to but ugh when it comes to that old of Android 🙃

[felixkrautschuk]

@bradmartin I made one more investigation and I found out, that the animation works on Mode.Indeterminate for Android 4 devices, if you define backgroundColor OR color in the options, not both at the same time 😄

[bradmartin]

If you have an idea to propose a fix, be glad to help sort thru it for a PR with you 👍

[edrick27]

i have the same problems when i run the APP get this error node_modules/@nstudio/nativescript-loading-indicator/index.d.ts(77,10): error TS2304: Cannot find name 'UIView'

[bradmartin]

@edrick27 your issue is that your app is looking in node_modules when it shouldn't be analyzing those type defs. skipLibCheck: true should be in your tsconfig, if not, add it so your app doesn't check libs (node_modules).