is there a simple way to display SVGZ images within an Android app. I know that there are a few libraries to display SVG images. But they do not support SVGZ as far as I know.
In case that there is no library that can display SVGZ images, is it possible to unzip the file with java.util.zip?
Yes it should be possible to extract the svg file and visualize it with a small lib called svg-android.
Small Example:
GZIPInputStream is=/*...*/;
PictureDrawable img = SVGParser.getSVGFromInputStream(is, 0, 0)
.createPictureDrawable();
Try this fork of svg-android.
It detects svgz automatically, so you can do directly
SVGParser.getSVGFromResource(getResources(), R.raw.mysvgz);
and it is more compatible with the svg definition. In other words, the original version of svg-android can not view many svgs due to lacks of some features.
Related
I want to create a Splash screen for my android application for this purpose i create ".svg" file by using three different ".png" images using Adobe XD. bust when i import ".svg" file through vector Asset it only show background of ".svg" image it does not show other images which i used to create this file for splash screen. I also used this http://inloop.github.io/svg2android/ to get proper ".xml" file and past it in drawable folder but still no change. I am attaching images of my error this is where error is shown
when i click on error foe more detail i I found this error
I want to use my app logo for splash screen "Please Help" me an tell me how to use logo on splash screen i just started android development.
Thankyou.
The Android Studio SVG importer only supports a subset of SVG. Remember that it is converting the SVG to a VectorDrawable. So only things that work in a VectorDrawable can be imported from the SVG. Basically that means you must stick to just the vector shapes - rectangles, ellipses, paths etc
See: Which SVG elements are supported by Android studio and which are not?
If your SVG only contains PNG images, then there is no point in using an SVG anyway. Just import your PNGs to your project and use an ImageView to display them.
If you really need to display an SVG. Then use a library that properly supports SVGs. Such as my one: AndroidSVG.
Have a look at this Gist.
Above gist creates a drawable which looks like this:
Clearly in the gist, pathData property has been provided coordinates. How is this achieved, I mean, ofcourse someone doesn't found each point according to his needs.
My question : How is this achieved? Is there any tool present to do so?
Drawable like this reduces app size by avoiding to have an image instead. Also, there are questions for drawables in XML like this, this and many more but I think my Question is very different (and useful, probably).
You can design your SVG files using some tools such as Android Vector Asset Studio
Usually people don't write the SVG paths themselves, they use a tool or an editor where they sketch the drawing and generate the file.
What you have to do is to create a SVG image using an SVG editor such as Inkscape (the one I use)
or if you want a more professional (and expensive) editor you can use Adobe Illustrator. You can even use a tool called svg-edit which is accessible in the browser.
After creating your required art, save your SVG file.
Next goto and open Android Studio.
Right click on the res folder (any folder where drawables are usually placed)
Select New > Vector Asset. This opens the following window.
Select local file
Edit the path to direct it to the location of your svg file
Depending on the complexity of your image, errors may be thrown (not all svg elements get converted to xml. Hence, avoid using complex art in svg, use raster images in that case).
Android studio does some fixes on its own. So even if errors are thrown, if your image renders fine, then you are good to go.
Click Next > adjust a few more settings > Click Finish
Your xml vector asset has been created successfully.
Note:
To ensure backward compatibility, add the following to your build.gradle
android{
defaultConfig{
vectorDrawables.useSupportLibrary = true
}
}
dependencies{
compile 'com.android.support:appcompat-v7:23.2.0'
}
Hope this has helped you.
For more info see the official documentation.
I am using the standard code stated in the example of the library of https://code.google.com/p/svg-android/wiki/Tutorial, here is my OnCreate method :
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
ImageView imageView = (ImageView)findViewById(R.id.imageViewTest);
// Set the background color to white
imageView.setBackgroundColor(Color.GRAY);
// Parse the SVG file from the resource
SVG svg = SVGParser.getSVGFromResource(getResources(), R.drawable.android);
//Get a drawable from the parsed SVG and set it as the drawable for the ImageView
imageView.setImageDrawable(svg.createPictureDrawable());
}
I am not able to add the layout code here, so sharing it in this doc: https://docs.google.com/document/d/1fbi3B_hAYUh_C2IwPfInvZ-BG2bgsa4pZoJKj8NBT9o/edit?usp=sharing
It does not give any error but it also does not display the image.
I was earlier getting doubts that the image is incorrect, then I used the one in the same example.
Yet it is not displaying the image nor giving any error.
Please suggest how to debug further.
On newer devices have hardware rendering turned on by default so you need to explicitly turn on software rendering.
use this after your code:
imageView.setLayerType(View.LAYER_TYPE_SOFTWARE,null);
Your problem is almost certainly hardware acceleration. You may need to set the View LayerType to software mode.
See Having issue on Real Device using vector image in android. SVG-android
If that doesn't fix it, then it may be an issue with svg-android, which can have trouble rendering correctly anything other than simple SVGs. You might have better luck with my library AndroidSVG.
The best practice for SVG on Android is going to be to use a tool to convert your SVG to PNG at the size(s) you're interested in. Existing SVG support for Android is not comprehensive of what you're likely to find in an SVG file, and even if it were, the support is not built into the OS so using them directly is out of source .
If the library you're working with can process the SVGs you have well, you can make it work for every icon but not through the standard Android API; you'll need to create a custom view. Around months ago I used the library you linked and at that time it had trouble with many SVGs I had created in Inkscape or downloaded from various places. Perhaps its support has improved since then, but I recommend testing it with the exact SVGs you plan to use before you write a lot of custom code for it.
After finding Display SVG Image in image view in android on Google and going to Having issue on Real Device using vector image in android. SVG-android, I find that "You need a 3rd-party JAR to do it" is a bit of overkill. Is there any way to render an SVG without using 3rd-party libraries?
I managed to display an SVG using a WebView, since that is more than capable of rendering an SVG:
webView.loadUrl("file:///android_res/drawable/file.svg"); // point it to the SVG
webView.setBackgroundColor(0x00000000); // set the background to transparent
This makes it render much like a transparent PNG would in an ImageView. The only caveat is that the SVG must use the viewBox attribute and not use the height or width attributes, to ensure it resizes properly.
Using custom fonts actually works really well in Android.
You can use the free icomoon web application to convert SVGs to custom .ttf font characters.
If you are using it for imagePicker sort of feature then,
webView.loadURl(selectedFileLocation.toString)
else if it is to display a .svg image from web,
webView.loadURl(/*url for the .svg file*/)
i have converted a psd file into svg, it works good at browser but not works on android native applications, how can i do this?
ImageView imageView = (ImageView)findViewById(R.id.img1);
imageView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
//Parse the SVG file from the resource
SVG svg = SVGParser.getSVGFromResource(getResources(), R.raw.android);
//Get a drawable from the parsed SVG and apply to ImageView
imageView.setImageDrawable(svg.createPictureDrawable());
This is the code i used to display svg image. it works when i used simple svg images, but it not works converted svg images using illustrator . how can i do?
I am guessing that your SVG just contains the image from the PSD. Is that the case?
If all that the SVG contains is a bitmap image, then you are not really using SVGs for their proper purpose (vector art). You would be better off just converting the PSD to a JPEG or PNG and loading that into an ImageView.
However, if you are definitely sure you want to load an SVG, then the solution depends on which SVG library you are using.
svg-android: As far as I know, it doesn't support <image> elements, so there is no solution
AndroidSVG: supports <image>, so it should work as long as the device has the memory to load the image. If the image is embedded in the file, you should be fine. If it references an external image, you will need to pass in an SVGExternalFileResolver so it knows how to find the bitmap. See my answer to the following question: https://stackoverflow.com/a/21531168/1292848