Slight dark border wrapping the ring

[FranciZ]

Which platform(s) does your issue occur on?

Android, Pixel XL 2

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

• CLI: 3.4.2
• Cross-platform modules: 3.4.1
• Runtime(s): tns-android 3.4.2
• Plugin(s):

  "devDependencies": {
  "@angular/compiler-cli": "~5.2.0",
  "@ngtools/webpack": "~1.9.4",
  "babel-traverse": "6.26.0",
  "babel-types": "6.26.0",
  "babylon": "6.18.0",
  "codelyzer": "~4.0.2",
  "copy-webpack-plugin": "~4.3.0",
  "css-loader": "~0.28.7",
  "extract-text-webpack-plugin": "~3.0.2",
  "lazy": "1.0.11",
  "nativescript-dev-sass": "1.5.0",
  "nativescript-dev-typescript": "~0.6.0",
  "nativescript-dev-webpack": "~0.9.1",
  "nativescript-worker-loader": "~0.8.1",
  "raw-loader": "~0.5.1",
  "resolve-url-loader": "~2.2.1",
  "sass-loader": "~6.0.6",
  "tslint": "~5.8.0",
  "typescript": "~2.6.2",
  "uglifyjs-webpack-plugin": "~1.1.6",
  "webpack": "~3.10.0",
  "webpack-bundle-analyzer": "^2.9.1",
  "webpack-sources": "~1.1.0"
  }

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

There's a slight border around the ring on android that I can't get rid of. See attached image. Is there some way to get rid of that border?

Thanks!

[pichurichko]

Try this workaround.

Declare reference to circle component first:

@ViewChild("circle") circle: ElementRef;

Then use code like this (when reference to element became available):

if(isAndroid)
{
    this.circle.nativeElement._androidView.setOuterContourSize(0);
    this.circle.nativeElement._androidView.setInnerContourSize(0);
}

[7ammer]

In Vue this can be done like so...

<AnimatedCircle @loaded="onLoadCircle" />

methods: {
    onLoadCircle(args) {
        let nativeView = args.object.nativeView;

        if(isAndroid) {
            nativeView.setOuterContourSize(0);
            nativeView.setInnerContourSize(0);
        }
    },
}