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

SVG Component Showing Blank After Updating to Version 15.4.0 #2449

Closed
aljadan opened this issue Sep 14, 2024 · 3 comments
Closed

SVG Component Showing Blank After Updating to Version 15.4.0 #2449

aljadan opened this issue Sep 14, 2024 · 3 comments

Comments

@aljadan
Copy link

aljadan commented Sep 14, 2024

Description

After updating to React Native SVG version 15.4.0, everything works as expected except for one specific SVG component, which appears blank

15.3.0 15.4.0
Screenshot 2024-09-14 at 4 31 07 PM Screenshot 2024-09-14 at 4 25 31 PM

Steps to reproduce

1- Build the application for iOS/Android using version 15.4.0
2- Open the application on a simulator (both iOS and Android)
3- Observe that the SVG component appears blank

Snack or a link to a repository

https://github.com/aljadan/react-native-svg-issue

SVG version

15.4.0

React Native version

0.74.5

Platforms

Android, iOS

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

@TomCorvus
Copy link

Did you try to update to 15.5.0 version? I saw this in changelog #2345

jakex7 added a commit that referenced this issue Sep 18, 2024
…ty (#2456)

# Summary

On Android when element before masked element has strokeOpacity
different from 1, the paint is reused to draw an offscreen layer
resulting in wrong opacity. Partially fixes (only on Android) #2449

## Test Plan

Add `stroke` and `strokeOpacity` to element directly before masked
element.

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| Android |    ✅      |
jakex7 added a commit that referenced this issue Sep 23, 2024
# Summary

Without the `maskUnits` attribute, masks may not render correctly, as
seen in issue #2449. This pull request adds support for `maskUnits` and
ensures proper cropping within the mask boundaries.

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| iOS     |    ✅      |
| MacOS   |    ✅      |
| Android |    ✅      |
@jakex7
Copy link
Member

jakex7 commented Oct 28, 2024

Hi @aljadan,
I tested your icon on the latest version, v15.8.0, following the recent fixes, and everything is working as expected. Let me know if it’s working on your end or if there's anything that needs to be fixed.

@jakex7 jakex7 closed this as completed Oct 28, 2024
@aljadan
Copy link
Author

aljadan commented Oct 28, 2024

Hello @jakex7
Everything is working as expected, thank you so much for all your hard work

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

No branches or pull requests

3 participants