BigBadaboom / androidsvg

SVG rendering library for Android
http://bigbadaboom.github.io/androidsvg/
Apache License 2.0
1.19k stars 226 forks source link

How to change svg title? #235

Closed immujahidkhan closed 3 years ago

immujahidkhan commented 3 years ago

I have list of svg images with text and i want to allow user to edit text , How it can be possible?

image

I want to make my project like this app :

BigBadaboom commented 3 years ago

AndroidSVG doesn't yet have any feature to let you modify the content of an SVG.

What you could do is

  1. Turn your SVG(s) into template form. For example:
<svg>
   ...
   <text ...>%%name%%</text>
   ...
</svg>
  1. In your app, load the SVG as a string
  2. Do a search and replace: svgStr.replace("%%name&&", name);
  3. Then with AndroidSVG do SVG.getFromString(svgStr)
  4. Then you can render it.

But to it this way, the text in your SVG needs to be plain <text> elements. In your example image above, the text "TEXT" is warped. So it cannot be plain text. So this technique will not work if you need to modify images like this.

If you needed to edit warped text, like the image above, you would need to:

  1. Get the text input from the user
  2. Read in the SVG as text
  3. Read in the font file
  4. Read the glyph data (the path shape) for each character in the text
  5. Warp the glyph paths
  6. Convert to SVG paths
  7. Insert the SVG paths into the right place in theSVG file string
  8. Then with AndroidSVG do SVG.getFromString(svgStr)
  9. Then render it.

You can probably find libraries for steps #3 and #4. Finding code to do step #5 is probably harder.

Hope this helps a little. Good luck with your project.

immujahidkhan commented 3 years ago

Thanks for the detailed answer love you