Home > Mobile >  android how to load SVG into imageView
android how to load SVG into imageView

Time:11-30

I tried loading the SVG path into imageView, but I couldn't

for example, I have SVG path as String

"<svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M6.48918 13.6276C6.70383 13.0193 7.37699 12.6841 7.98482 12.8979C8.59265 13.1117 8.89133 13.7854 8.67782 14.3938C8.33132 15.3794 8.16683 16.4263 8.16683 17.4949C8.16683 18.572 8.36283 19.64 8.71399 20.6325C8.92864 21.2403 8.59148 21.8766 7.98482 22.0919C7.37699 22.3072 6.70501 22.0065 6.48918 21.3988C6.0505 20.1567 5.8335 18.8386 5.8335 17.4949C5.8335 16.1619 6.05634 14.861 6.48918 13.6276ZM26.3225 14.4302C26.1125 13.8209 26.4438 13.1817 27.0528 12.9709C27.6606 12.76 28.3 13.0547 28.5111 13.6641C28.9311 14.8823 29.1668 16.1806 29.1668 17.4949C29.1668 18.8454 28.9545 20.1511 28.5111 21.3988C28.2941 22.0061 27.6233 22.3448 27.0155 22.1285C26.4088 21.912 26.0705 21.24 26.2863 20.6325C26.641 19.6356 26.8335 18.5775 26.8335 17.4949C26.8335 16.4413 26.6597 15.4037 26.3225 14.4302ZM17.5002 24.4999C18.1445 24.4999 18.6668 23.9772 18.6668 23.3324C18.6668 22.6876 18.1445 22.1649 17.5002 22.1649C16.8558 22.1649 16.3335 22.6876 16.3335 23.3324C16.3335 23.9772 16.8558 24.4999 17.5002 24.4999Z" fill="#88B8E9"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M10.5 11.0833C10.5 8.82817 12.3282 7 14.5833 7H20.4167C22.6718 7 24.5 8.82817 24.5 11.0833V23.9167C24.5 26.1718 22.6718 28 20.4167 28H14.5833C12.3282 28 10.5 26.1718 10.5 23.9167V11.0833ZM17.5 24.5C18.1443 24.5 18.6667 23.9777 18.6667 23.3333C18.6667 22.689 18.1443 22.1667 17.5 22.1667C16.8557 22.1667 16.3333 22.689 16.3333 23.3333C16.3333 23.9777 16.8557 24.5 17.5 24.5Z" fill="#88B8E9"/> </svg>"

how can load this path into imageView

CodePudding user response:

Hello bro try this one!

The best way is to go to res-> drawable-> Vector Asset -> Local file (SVG, PSD) ->select your SVG file from the place you save it.

and use image in your project

CodePudding user response:

You can use Glide for loading SVG images and setting them onto your ImageView

There is an example for this.

After creating SvgDetector.java, SvgDrawableTranscoder.java, SvgModule.java, SvgSoftwareLayerSetter.java you can load svg files:

GenericRequestBuilder<Uri,InputStream,SVG,PictureDrawable>
    requestBuilder = Glide.with(context)
    .using(Glide.buildStreamModelLoader(Uri.class, context), InputStream.class)
    .from(Uri.class)
    .as(SVG.class)
    .transcode(new SvgDrawableTranscoder(), PictureDrawable.class)
    .sourceEncoder(new StreamEncoder())
    .cacheDecoder(new FileToStreamDecoder<SVG>(new SvgDecoder()))
    .decoder(new SvgDecoder())
    .placeholder(R.drawable.svg_image_view_placeholder)
    .error(R.drawable.error_image)
    .listener(new SvgSoftwareLayerSetter<Uri>());

Uri uri = Uri.parse(svgImageUrl);
requestBuilder
    .diskCacheStrategy(DiskCacheStrategy.SOURCE)
    .load(uri)
    .into(imageView);

CodePudding user response:

Maybe These libraries could help you

  • Related