Add support for clipPath

[yuraj11]

No description provided.

[chrisjenx]

I guess no progress on this 😆

[yuraj11]

https://developer.android.com/reference/android/graphics/drawable/VectorDrawable.html
Android supports only two parameters name and pathData 😞 , I have seen complicated clipPath in SVG like combination with clip-rule="evenodd" #44 or in conjuction with groups. Could you please provide some svg file for analysis ? Keep in mind that support for vector images in Android is very limited and you can most of the time workaround those limitations by changing how svg is exported whenever possible.

[chrisjenx]

This is a perfect example:

<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="152" height="60" viewBox="0 0 152 60"><defs><clipPath id="clip-path"><rect x="-63.96359" y="-15.96372" width="81.92744" height="81.92744" transform="translate(10.94116 23.5857) rotate(45)" style="fill:none"/></clipPath><clipPath id="clip-path-2"><rect x="134.03611" y="-15.96377" width="81.92743" height="81.92751" transform="translate(281.06566 166.42127) rotate(-134.99997)" style="fill:none"/></clipPath></defs><title>ic_owlr_alerts</title><g id="_Group_" data-name="&lt;Group&gt;"><g id="_Group_2" data-name="&lt;Group&gt;"><polygon id="_Path_" data-name="&lt;Path&gt;" points="75.479 58.585 83.341 46.389 67.619 46.389 75.479 58.585" style="fill:#5dc1ce"/><path id="_Compound_Path_" data-name="&lt;Compound Path&gt;" d="M108.6271,6.93817l3.40818-5.30194H93.75718a23.58393,23.58393,0,0,0-18.27732,8.67961A23.58425,23.58425,0,0,0,57.20237,1.63623H38.77856l3.4568,5.37907A23.6352,23.6352,0,1,0,75.47985,40.2838,23.63121,23.63121,0,1,0,108.6271,6.93817ZM57.20237,38.25187A12.93653,12.93653,0,1,1,70.12778,25.31559,12.94554,12.94554,0,0,1,57.20237,38.25187Zm36.5548,0a12.93653,12.93653,0,1,1,12.92651-12.93629A12.94559,12.94559,0,0,1,93.75718,38.25187Z" style="fill:#5dc1ce"/></g><ellipse id="_Path_2" data-name="&lt;Path&gt;" cx="57.20227" cy="25.31539" rx="5.01332" ry="5.01754" style="fill:#556065"/><ellipse id="_Path_3" data-name="&lt;Path&gt;" cx="93.75759" cy="25.31539" rx="5.01332" ry="5.01754" style="fill:#556065"/></g><g style="clip-path:url(#clip-path)"><circle cx="46.27373" cy="25" r="33.61651" style="fill:none;stroke:#656564;stroke-miterlimit:10;stroke-width:4px"/><circle cx="46.27371" cy="25.00001" r="42.00842" style="fill:none;stroke:#656564;stroke-miterlimit:10;stroke-width:4px"/></g><g style="clip-path:url(#clip-path-2)"><circle cx="106.27338" cy="24.99996" r="33.61652" style="fill:none;stroke:#656564;stroke-miterlimit:10;stroke-width:4px"/><circle cx="106.2734" cy="24.99995" r="42.00844" style="fill:none;stroke:#656564;stroke-miterlimit:10;stroke-width:4px"/></g></svg>

[yuraj11]

Ok, this one works easily, I think this could work for some types of clippaths but there is a one catch:

I will implement this feature tomorrow. I hope they will fix this in future.

[chrisjenx]

Oh as in backport the clipPath to pre 21?

[yuraj11]

Ok you can try It now. 7fc25d9
Let me know If It works because I haven't tried other SVGs.

[yuraj11]

I have added It as option on site because It can broke other SVGs.

[chrisjenx]

OK great, I'll give it ago with some of our other svg's see what happens.

[yuraj11]

As this tool is deprecated and behind the official AS solution in term of conversion - you can check https://developer.android.com/studio/write/vector-asset-studio#svg - I have tried converting this SVG and It renders correctly using AS Vector Asset Studio.