sean-perkins / nativescript-animated-circle

NativeScript plugin for animated progress borders on circles.
Apache License 2.0
13 stars 11 forks source link

Unable to use binding on text property #10

Open godrose opened 6 years ago

godrose commented 6 years ago

Which platform(s) does your issue occur on?

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

Please, tell us how to recreate the issue in as much detail as possible.

r04drunn3r commented 6 years ago

One quick workaround I was able to use to get this working:

<AnimatedCircle
                                backgroundColor="transparent"
                                width="60%"
                                height="auto"
                                animated="true"
                                animateFrom="0"
                                rimColor="#2ACFFF"
                                barColor="#2FACFE"
                                fillColor="#FFFFFF"
                                clockwise="true"
                                rimWidth="150"
                                [progress]="percentage"
                                [text]="progtext"
                                textSize="250"
                                textColor="black" ></AnimatedCircle>  
import { Component, OnInit,NgZone } from "@angular/core";

public constructor( private _ngZone:NgZone) { }

 this._ngZone.run(() => {
                //Do whatever you want here
                this.prog.percentage = Math.floor((temp.currentBytes/temp.totalBytes)*100);
                this.prog.progtext = Math.floor((temp.currentBytes/temp.totalBytes)*100).toString() + "%";
                this.size = 5;
              })

This will make sure the UI is refreshed.