How to use SVG image in ImageView

73,136

Solution 1

In new Android Studio there is possibility to import SVG to XML file, so You don't need to use external library.

In drawable right click -> New -> Vector Asset -> Local SVG file.

enter image description here

Then You use it normally as other drawables:

android:src="@drawable/btn_image"

Solution 2

On newer devices that have hardware rendering turned on by default, you need to explicitly turn on software rendering.

imgView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

OR add this tag in your xml

android:layerType="software"

Solution 3

To properly use the svgimageview:svg attribute, the app needs to know it's definition. Unfortunately, there is only a JAR version of the library at the moment, and (unlike with AARs) the needed definition does not get merged properly when the app is built.

Try copying the attrs.xml file from the library source

https://github.com/BigBadaboom/androidsvg/blob/master/androidsvg/src/main/res/values/attrs.xml

into your res/values folder.

I believe that should fix your problem.

Solution 4

Though SVG is XML-based Vector image, Imageview can render only XML(Vector Drawables). Thus, We need to convert SVG to XML format. We can do it using Android Vector Asset Studio.

This may be helpful to convert SVG, PSD to XML
https://medium.com/@iamitgupta1994/converting-svg-psd-to-xml-vector-drawable-using-android-vector-asset-studio-8e8ec23d5405

Solution 5

Right Click on Drawable -> New -> Vector Asset -> select Local file (SVG, PSD) select Path where your image

example /Users/yourpcname/Desktop/taka.svg

enter image description here

enter image description here

its save drawable as a xml file Then you can use into your imageview.

Share:
73,136
VLeonovs
Author by

VLeonovs

Updated on July 05, 2022

Comments

  • VLeonovs
    VLeonovs almost 2 years

    Good Day, I have a SVG image. How can I add it to ImageView background ?

    I tried to use this library But I have problem:

    01-25 12:19:02.669 27719-27719/com.dvor.androidapp E/AndroidRuntime: FATAL EXCEPTION: main
        android.view.InflateException: Binary XML file line #70: Error inflating class com.caverock.androidsvg.SVGImageView
        at android.view.LayoutInflater.createView(LayoutInflater.java:626)
        at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:702)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:761)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.rInflate(LayoutInflater.java:769)
        at android.view.LayoutInflater.inflate(LayoutInflater.java:498)
        at android.view.LayoutInflater.inflate(LayoutInflater.java:398)
        at com.dvor.mobileapp.checkout.ShoppingCart.onCreateView(ShoppingCart.java:411)
        at android.support.v4.app.Fragment.performCreateView(Fragment.java:1786)
        at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:953)
        at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1136)
       at android.support.v4.app.BackStackRecord.run(BackStackRecord.java:739)
       at android.support.v4.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:1499)
       at android.support.v4.app.FragmentManagerImpl$1.run(FragmentManager.java:456)
       at android.os.Handler.handleCallback(Handler.java:730)
       at android.os.Handler.dispatchMessage(Handler.java:92)
       at android.os.Looper.loop(Looper.java:176)
       at android.app.ActivityThread.main(ActivityThread.java:5419)
       at java.lang.reflect.Method.invokeNative(Native Method)
       at java.lang.reflect.Method.invoke(Method.java:525)
       at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1046)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:862)
       at dalvik.system.NativeStart.main(Native Method)
                                                                              Caused by: java.lang.reflect.InvocationTargetException
       at java.lang.reflect.Constructor.constructNative(Native Method)
       at java.lang.reflect.Constructor.newInstance(Constructor.java:417)
       at android.view.LayoutInflater.createView(LayoutInflater.java:600)
       at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:702) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:761) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
       at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.inflate(LayoutInflater.java:498) 
      at android.view.LayoutInflater.inflate(LayoutInflater.java:398) 
      at com.dvor.mobileapp.checkout.ShoppingCart.onCreateView(ShoppingCart.java:411) 
      at android.support.v4.app.Fragment.performCreateView(Fragment.java:1786) 
      at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:953) 
      at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1136) 
     at android.support.v4.app.BackStackRecord.run(BackStackRecord.java:739) 
     at android.support.v4.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:1499) 
      at android.support.v4.app.FragmentManagerImpl$1.run(FragmentManager.java:456) 
      at android.os.Handler.handleCallback(Handler.java:730) 
      at android.os.Handler.dispatchMessage(Handler.java:92) 
      at android.os.Looper.loop(Looper.java:176) 
      at android.app.ActivityThread.main(ActivityThread.java:5419) 
      at java.lang.reflect.Method.invokeNative(Native Method) 
      at java.lang.reflect.Method.invoke(Method.java:525) 
      at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1046) 
      at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:862) 
      at dalvik.system.NativeStart.main(Native Method) 
      Caused by: java.lang.NoClassDefFoundError: com.caverock.androidsvg.R$styleable
      at com.caverock.androidsvg.SVGImageView.init(SVGImageView.java:80)
      at com.caverock.androidsvg.SVGImageView.<init>(SVGImageView.java:66)
      at java.lang.reflect.Constructor.constructNative(Native Method) 
      at java.lang.reflect.Constructor.newInstance(Constructor.java:417) 
      at android.view.LayoutInflater.createView(LayoutInflater.java:600) 
      at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:702) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:761) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.rInflate(LayoutInflater.java:769) 
      at android.view.LayoutInflater.inflate(LayoutInflater.java:498) 
      at android.view.LayoutInflater.inflate(LayoutInflater.java:398) 
      at com.dvor.mobileapp.checkout.ShoppingCart.onCreateView(ShoppingCart.java:411) 
      at android.support.v4.app.Fragment.performCreateView(Fragment.java:1786) 
      at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:953) 
      at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1136) 
     at android.support.v4.app.BackStackRecord.run(BackStackRecord.java:739) 
      at android.support.v4.app.FragmentManagerImpl.execPendingActions(FragmentManager.java:1499) 
       at android.support.v4.app.FragmentManagerImpl$1.run(FragmentManager.java:456) 
       at android.os.Handler.handleCallback(Handler.java:730) 
       at android.os.Handler.dispatchMessage(Handler.java:92) 
       at android.os.Looper.loop(Looper.java:176) 
       at android.app.ActivityThread.main(ActivityThread.java:5419) 
       at java.lang.reflect.Method.invokeNative(Native Method) 
       at java.lang.reflect.Method.invoke(Method.java:525) 
       at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1046) 
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:862) 
       at dalvik.system.NativeStart.main(Native Method)
    

     

    What I did ?

    Firstly, I added dependency to gradle:

    compile 'com.caverock:androidsvg:1.2.1'
    

    Secondly, I changed ImageView to com.caverock.androidsvg.SVGImageView

     <com.caverock.androidsvg.SVGImageView
             android:id="@+id/recentlyViewed_imgView"
             android:layout_width="100dp"
             android:layout_height="100dp"
             svgimageview:svg="clock.svg"
             />
    

    After that I added xmls:svgimageview to root layout:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:svgimageview="http://schemas.android.com/apk/res-auto"
        android:id="@+id/rowItem"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#272727"
        android:clickable="true"
        android:orientation="vertical">
    

    This clock.svg is in the assets folder.

  • lomza
    lomza over 7 years
    In case of using Support Library, add app:srcCompat="@drawable/btn_image"
  • Mark McKenna
    Mark McKenna almost 7 years
    Support for advanced SVG features seems to be pretty weak, though.
  • spaaarky21
    spaaarky21 over 6 years
    It's a nice idea but doesn't answers the question. Android's vector drawable format is terrible for all but the simplest images. SVGs from common graphic design tools don't convert well and Studio/Android doesn't even do a very good job of respecting the image's size.
  • Chad
    Chad almost 5 years
    You're right you should use XML drawables where you can, but if you are remotely downloading SVG images on the fly, this is what the library would be beneficial for. Because using webviews sucks
  • Donald Duck
    Donald Duck almost 3 years
    This has to be done at compile time. What if I have an SVG image that I download from a server at runtime?
  • Владислав Шестернин
    Владислав Шестернин over 2 years
    And with some GRADIENTS very bad