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.

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

Anti-aliasing issue causing progress bar to look bad when background color is white #48

Open
rsml opened this issue Nov 9, 2024 · 0 comments

Comments

@rsml
Copy link

rsml commented Nov 9, 2024

Describe the bug
There is (what looks to be) an anti-aliasing issue causing a sliver of the foreground color to be visible in places where it shouldn't be

To Reproduce
This happens for any width and size. Here's the props I used in this screenshot. Make sure that background color is white (otherwise it's too hard to see)

<AnimatedProgressWheel
        size={400}
        width={40}
        color="#56D719"
        progress={20}
        rotation="270deg"
        backgroundColor="#FFFFFF"
        duration={300}
        rounded
>
    ....
</AnimatedProgressWheel>

Expected behavior
No sliver of foreground color should appear on areas where it's not expected

Screenshots
Screenshot 2024-11-09 at 11 23 07
(Notice in the top left quadrant of the image, there's a green sliver in the inside curve of where the progress bar would be.

Desktop (please complete the following information):
N/A (not tested)

Smartphone (please complete the following information):

  • React Native v0.74.5
  • iOS 18.1
  • Both debug and release. Both simulator and device.

Additional context
N/A

Thanks for this great component!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant