Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix:(animated-circle) color properties #36

Merged
merged 7 commits into from
Oct 28, 2020
Merged

fix:(animated-circle) color properties #36

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
777caba
fix color setters and improve the update process
bradmartin Oct 28, 2020
3895c8b
roll back color prop changes
bradmartin Oct 28, 2020
bcbc03a
bump verison
bradmartin Oct 28, 2020
23d8cb7
remove comments
bradmartin Oct 28, 2020
4c04415
fix typo
bradmartin Oct 28, 2020
0f112af
clean up the css props work
bradmartin Oct 28, 2020
df7cbdc
bump
bradmartin Oct 28, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
112 changes: 69 additions & 43 deletions packages/animated-circle/index.android.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,8 @@ export class AnimatedCircle extends AnimatedCircleCommon {
private _text = '';
private _textColor = new Color('orange');
private _textSize = 8;
private _fillColor: Color;
clockwise = true;
fillColor: any;

constructor() {
super();
Expand Down Expand Up @@ -107,7 +107,11 @@ export class AnimatedCircle extends AnimatedCircleCommon {

set rimColor(value: any) {
this._rimColor = value;
this.updateAnimatedCircle();
if (value instanceof Color) {
this.android.setRimColor(value.argb);
} else {
this.android.setRimColor(new Color(value).argb);
}
}

get rimColor() {
Expand All @@ -119,7 +123,11 @@ export class AnimatedCircle extends AnimatedCircleCommon {
}
set barColor(value: Color) {
this._barColor = value;
this.updateAnimatedCircle();
if (value instanceof Color) {
this.android.setBarColor([value.argb]);
} else {
this.android.setBarColor([new Color(value).argb]);
}
}

set rimWidth(value: number) {
Expand All @@ -133,38 +141,28 @@ export class AnimatedCircle extends AnimatedCircleCommon {

set spinBarColor(value: any) {
this._spinBarColor = value;
this.updateAnimatedCircle();
if (value instanceof Color) {
this.android.setSpinBarColor(value.argb);
} else {
this.android.setSpinBarColor(new Color(this.spinBarColor).argb);
}
}

get spinBarColor() {
return this._spinBarColor;
}

[rimColorProperty.setNative](value: any) {
this._rimColor = value;
this.updateAnimatedCircle();
get fillColor() {
return this._fillColor;
}

[rimColorProperty.getDefault]() {
return this._rimColor;
}

[barColorProperty.setNative](value: any) {
this._barColor = value;
this.updateAnimatedCircle();
}

[barColorProperty.getDefault]() {
return this._barColor;
}

[spinBarColorProperty.setNative](value: any) {
this._spinBarColor = value;
this.updateAnimatedCircle();
}

[spinBarColorProperty.getDefault]() {
return this._spinBarColor;
set fillColor(value: any) {
this._fillColor = value;
if (value instanceof Color) {
this.android.setFillCircleColor(value.argb);
} else {
this.android.setFillCircleColor(new Color(value).argb);
}
}

set startAngle(value: number) {
Expand Down Expand Up @@ -196,23 +194,62 @@ export class AnimatedCircle extends AnimatedCircleCommon {

set textColor(value: string) {
this._textColor = new Color(value);
this.updateAnimatedCircle();
this.android.setTextColor(this._textColor.argb);
}

set textSize(value: number) {
this._textSize = value;
this.updateAnimatedCircle();
this.android.setTextSize(value);
}

get textSize() {
return this.android.getTextSize();
}

// CSS Properties

[rimColorProperty.setNative](value: any) {
this._rimColor = value;
if (value instanceof Color) {
this.android?.setRimColor(value.argb);
} else {
this.android?.setRimColor(new Color(value).argb);
}
}

[rimColorProperty.getDefault]() {
return this._rimColor;
}

[barColorProperty.setNative](value: any) {
this._barColor = value;
if (value instanceof Color) {
this.android?.setBarColor([value.argb]);
} else {
this.android?.setBarColor([new Color(value).argb]);
}
}

[barColorProperty.getDefault]() {
return this._barColor;
}

[spinBarColorProperty.setNative](value: any) {
this._spinBarColor = value;
if (value instanceof Color) {
this.android?.setSpinBarColor(value.argb);
} else {
this.android?.setSpinBarColor(new Color(this.spinBarColor).argb);
}
}

[spinBarColorProperty.getDefault]() {
return this._spinBarColor;
}

private updateAnimatedCircle(): void {
if (this.android) {
this.android.setText(this._text);
this.android.setTextColor(this._textColor.argb);
this.android.setTextSize(this._textSize);
if (this.animated) {
if (this.animateFrom) {
this.android.setValueAnimated(this.animateFrom, this.progress, this.animationDuration);
Expand All @@ -227,12 +264,7 @@ export class AnimatedCircle extends AnimatedCircleCommon {
this.android.setValue(this.progress);
}
this.android.setMaxValue(this.maxValue);
if (this.rimColor) {
this.android.setRimColor(new Color(this.rimColor).argb);
}
if (this.spinBarColor) {
this.android.setSpinBarColor(new Color(this.spinBarColor).argb);
}

if (this.startAngle) {
this.android.setStartAngle(this.startAngle);
}
Expand All @@ -247,12 +279,6 @@ export class AnimatedCircle extends AnimatedCircleCommon {
if (this.rimWidth) {
this.android.setRimWidth(this.rimWidth);
}
if (this.barColor) {
this.android.setBarColor([this.barColor.argb]);
}
if (this.fillColor) {
this.android.setFillCircleColor(new Color(this.fillColor).argb);
}

this.android.setDirection(this.clockwise ? at.grabner.circleprogress.Direction.CW : at.grabner.circleprogress.Direction.CCW);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/animated-circle/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@nativescript/animated-circle",
"version": "1.1.0",
"version": "1.1.3",
"description": "Animated circle progress in your NativeScript applications.",
"main": "index",
"typings": "index.d.ts",
Expand Down