Does Android support SVG? any example?
79
votes
11 Answers
56
votes
The most complete answer is this:
- The Android 2.x default browser does not natively support SVG.
- The Android 3+ default browsers DO support SVG.
To add SVG support to 2.x versions of the platform, you have two basic choices:
- Install a more capable browser (like Firefox or Opera Mobile - both support SVG)
- Use a JavaScript polyfill that can parse SVG and render it to an HTML5 canvas
The first option is okay if you're just trying to make SVG work for personal uses or a limited (controllable) set of users. It's not a great option if you want to use SVG while targeting a large, uncontrolled user base.
In the later case, you want to use a polyfill. There are many JavaScript libraries available today that can prase SVG and render to a canvas. Two examples are:
Using a polyfill, you can render your SVG in a canavs on all versions of Android 2.x.
For a more complete example of this approach, you can refer to this blog post that discusses the use of the canvg polyfill for making Kendo UI DataViz charts (SVG-based) work on Android 2.x. Hope that helps!
22
votes
There is a new open-source library that supports loading and drawing SVG Basic 1.1 files: https://github.com/pents90/svg-android. Performance is good as the actual drawing is handled natively by an android.graphics.Picture object.
8
votes
Currently some people including me work on it independently.
You may find working solution in these articles:
Android. ImageView with SVG Support.
Android ImageView and Drawable with SVG support
8
votes
There is a new library (under active development) androidsvg which allows one to incorporate svg images directly in to projects. It has the advantage of defining an SVGImageView which allows one to incorporate an svg directly in the layout xml.
Finally, including svg in android is straightforward.
More details: Stack Overflow post
8
votes
Android supports vector drawables: https://developer.android.com/reference/android/graphics/drawable/VectorDrawable.html
And there exists an Android SVG to VectorDrawable Converter: http://inloop.github.io/svg2android/
2
votes
I've had a brief look at https://code.google.com/p/androidsvg/. So far displayed all svg files I threw at it. Looks promising.
1
votes
I've just chucked up a Github repo and example repo for my own TPSVG library, which I originally created specifically for an application of mine.
1
votes
I know my solution is somewhat hardcore, but it works great, doesn't require any external libraries (at least not in your final code) and is extremely fast.
1) Just take an existing SVG loading library, such as for example svg-android-2 (which is a fork of svg-android mentioned in another answer, just with more features and bugfixes): https://code.google.com/p/svg-android-2/
2) Write a simple app that will do nothing else but load and display your SVG image.
3) Modify the SVG loading library, so that it prints the Java code that creates the Picture class or saves it in a String variable.
4) Copy-paste the Java code obtained this way into the app you are writing.
To get more information about this technique and download sample source code, go to my blog: http://androiddreamrevised.blogspot.it/2014/06/transforming-svg-images-into-android.html
You can get a working example of this technique from Google Play here: https://play.google.com/store/apps/details?id=pl.bartoszwesolowski.svgtodrawablesample
Here's an example of a commercial app created using this technique (Milan metro map): https://play.google.com/store/apps/details?id=pl.bartoszwesolowski.atmmetroplan
Notice how fast the map loads and how pretty it looks, even when magnified.
1
votes
Check out Support vector drawable. Android studio has a tool to convert SVG files to .XML files.
when using AppCompat with ImageView (or subclasses such as ImageButton and FloatingActionButton), you’ll be able to use the new app:srcCompat attribute to reference vector drawables (as well as any other drawable available to android:src):
As of Android Support Library 23.3.0, support vector drawables can only be loaded via app:srcCompat or setImageResource()
0
votes
0
votes
