question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

App crashing with fill property on SVG

See original GitHub issue

Bug

Hello,

When I run the application with react-native run-android everything goes well, but when I try to generate an apk for testing as soon as I open some screen with the SVG (that contains the fill property) it crashes.

image

I ran it with the adb logcat and this is the error message I’m getting:

E/AndroidRuntime( 5567): java.lang.IllegalStateException: java.lang.NoSuchFieldException: fill
E/AndroidRuntime( 5567): 	at com.horcrux.svg.t.a(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.j.b(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.j.a(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.t.d(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.x.a(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.x.j(Unknown Source)
E/AndroidRuntime( 5567): 	at com.horcrux.svg.x.onDraw(Unknown Source)

Environment info

React native info output:

  React Native Environment Info:
    System:
      OS: Linux 5.0 Ubuntu 19.04 (Disco Dingo)
      CPU: (4) x64 Intel(R) Core(TM) i7-2640M CPU @ 2.80GHz
      Memory: 133.89 MB / 7.70 GB
      Shell: 5.5.1 - /usr/bin/zsh
    Binaries:
      Node: 10.15.2 - /usr/bin/node
      npm: 6.10.1 - /usr/local/bin/npm
    SDKs:
      Android SDK:
        API Levels: 23, 28, 29
        Build Tools: 28.0.3, 29.0.0
        System Images: android-21 | Google APIs Intel x86 Atom, android-22 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google APIs Intel x86 Atom, android-29 | Google Play Intel x86 Atom
    npmPackages:
      react: 16.8.3 => 16.8.3 
      react-native: 0.59.10 => 0.59.10 
    npmGlobalPackages:
      react-native-cli: 2.0.1

Library version: 9.5.3

I initially installed the version 9.5.1, and upgraded to try to solve this problem but it didn’t

Steps To Reproduce

  1. Generate an apk with assembleRelease
  2. Open the app …

Describe what you expected to happen:

  1. Run without crashing

Reproducible sample code

This is the SVG making the app crash (if I remove the fill prop and build my apk it runs normally)

<Svg fill="#f09e3e" height="64px" viewBox="-4 0 480 480.00003" width="64px">
    <Path d="m184 288h16v16h-16zm0 0" />
    <Path d="m136 288h16v16h-16zm0 0" />
    <Path d="m88 288h16v16h-16zm0 0" />
    <Path d="m232 288h16v16h-16zm0 0" />
    <Path d="m224 160h16.574219l4.25 56.601562 15.953125-1.203124-4.152344-55.398438h174.75l-22.800781 304h-56.574219v16h64c4.195312.011719 7.683594-3.21875 8-7.398438l23.425781-312.601562h16.574219c4.417969 0 8-3.582031 8-8v-40c0-4.417969-3.582031-8-8-8h-96v-96c0-4.417969-3.582031-8-8-8h-32c-4.417969 0-8 3.582031-8 8v96h-96c-4.417969 0-8 3.582031-8 8v40c0 4.417969 3.582031 8 8 8zm112-144h16v88h-16zm-104 104h224v24h-224zm0 0" />
    <Path d="m40 480h256c22.082031-.027344 39.972656-17.917969 40-40v-32c0-4.417969-3.582031-8-8-8h-.207031c10.941406-14.128906 10.941406-33.871094 0-48h.207031c4.417969 0 8-3.582031 8-8 .011719-31.625-12.503906-61.972656-34.808594-84.390625l-2.917968-44.136719-16 1.054688 1.910156 28.863281c-20.007813-13.929687-43.804688-21.394531-68.183594-21.390625h-96c-66.242188.074219-119.9257812 53.757812-120 120 0 4.417969 3.582031 8 8 8h.207031c-10.941406 14.128906-10.941406 33.871094 0 48h-.207031c-4.417969 0-8 3.582031-8 8v32c.0273438 22.082031 17.917969 39.972656 40 40zm280-40c0 13.253906-10.746094 24-24 24h-256c-13.253906 0-24-10.746094-24-24v-24h304zm-79.398438-40 63.796876-46.398438c10.875 4.042969 17.285156 15.296876 15.21875 26.714844-2.066407 11.414063-12.015626 19.707032-23.617188 19.683594zm-24.800781-1.742188-69.402343-46.257812h133zm-95.800781-158.257812h96c54.3125.0625 99.453125 41.855469 103.695312 96h-303.390624c4.242187-54.144531 49.386718-95.9375 103.695312-96zm-104 136c0-13.253906 10.746094-24 24-24h77.601562l72 48h-149.601562c-13.253906 0-24-10.746094-24-24zm0 0" />
    <Path d="m208 256h16v16h-16zm0 0" />
    <Path d="m160 256h16v16h-16zm0 0" />
    <Path d="m112 256h16v16h-16zm0 0" />
    <Path d="m280.019531 184.566406 15.960938-1.140625 1.144531 16-15.960938 1.140625zm0 0" />
  </Svg>

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:20
  • Comments:26

github_iconTop GitHub Comments

599reactions
fgagnetencommented, Jul 31, 2019

You have to add:

-keep public class com.horcrux.svg.** {*;}

in proguard-rules.pro (app)

27reactions
vinicius98scommented, Jul 31, 2019

You have to add:

-keep public class com.horcrux.svg.** {*;}

in proguard-rules.pro (app)

This solved the problem, thank you!

Read more comments on GitHub >

github_iconTop Results From Across the Web

App crashing with fill property on SVG · Issue #1061 - GitHub
Describe what you expected to happen: Run without crashing. Reproducible sample code. This is the SVG making the app crash (if I remove...
Read more >
react-native android app crashes with in release apk
I have written one hybrid app which is using react-native-svg to render svg images in react-native views. Everything works perfectly.
Read more >
SVG fill for a button causes crash of PBI Desktop
What used to be a flawless process of adding an SVG image to a button now causes PBD show uncalncellable error message: screen.png....
Read more >
Namespaces crash course - SVG: Scalable Vector Graphics
Namespaces crash course. As an XML dialect, SVG is namespaced. It is important to understand the concept of namespaces and how they are...
Read more >
react-native-svg - npm
react-native-svg provides SVG support to React Native on iOS, Android, ... Supports most SVG elements and properties (Rect, Circle, Line, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found