Creates a small graphics issue

[AkshayChordiya]

Hi @bonnyfone

Thank you for this library.

The Icons

The start icon (SVG): https://storage.googleapis.com/material-icons/external-assets/v1/icons/svg/ic_menu_white_24px.svg

The end icon (SVG): https://storage.googleapis.com/material-icons/external-assets/v1/icons/svg/ic_close_white_24px.svg

The Path generated by Vect Align

Start path (drawer_path): M 3.0,18.0 l 18.0,0.0 l 0.0,-2.0 l -18.0,0.0 l 0.0,2.0 L 3.0,18.0 m 0.0,-5.0 l 18.0,0.0 l 0.0,-2.0 l -18.0,0.0 l 0.0,2.0 L 3.0,13.0 M 3.0,6.0 L 3.0,6.0 L 3.0,6.0 L 3.0,6.0 L 3.0,6.0 L 3.0,6.0 L 3.0,8.0 L 21.0,8.0 L 21.0,6.0 L 3.0,6.0 L 3.0,6.0

End path (close_path): M 19.0,6.41 l 0.0,0.0 l 0.0,0.0 l 0.0,0.0 l 0.0,0.0 L 17.59,5.0 m 0.0,0.0 l0.0,0.0 l 0.0,0.0 l 0.0,0.0 l 0.0,0.0 L 12.0,10.59 M 12.0,10.59 L 6.41,5.0 L 5.0,6.41 L 10.59,12.0 L 5.0,17.59 L 6.41,19.0 L 12.0,13.41 L 17.59,19.0 L 19.0,17.59 L 13.41,12.0 L 19.0,6.41

Screenshot of the issue

XML Files in the Project:

Vector FIle (ic_drawer.xml):

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24">

    <path
        android:name="v"
        android:fillColor="#FFFFFF"
        android:pathData="@string/drawer_path" />

</vector>

Animated Vector File (ic_drawer_to_close.xml):

<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/ic_drawer">

    <target
        android:name="v"
        android:animation="@anim/drawer_to_close" />

</animated-vector>

The Anim File (drawer_to_close.xml):

<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="650"
    android:propertyName="pathData"
    android:valueFrom="@string/drawer_path"
    android:valueTo="@string/close_path"
    android:valueType="pathType" />

I hope you help me with this issue.

[bonnyfone]

Hi @AkshayChordiya, thank you for your detailed report. As stated in the main doc, the quality of the result may vary and can lead to graphical artifacts (as in you case); this because there's (still) no assumption regarding the results esthetics, it's just an alignment of sequences. That's to say, I cannot directly solve your specific issue at this moment bacause the current alignment algorithm has some specific limitations :(

The good news is: on the development branch (dev) I'm currently working on different aligment techniques which could change the alignment and thus the final result. I think that this new techniques may help to solve this kind of issues. On the dev branch I'm also working on a GUI which will make the whole aligning process much more user friendly and fast (there will be a live preview of the morphing animation, so you won't need to compile and run an android app every time you want to try a new animation).

As I said, these are things under development. During the waiting, I can suggest you to try one of these:

• slightly edit one or both of your SVG files without changing the aspect of your images (e.g. using InkScape)
• reduce (or increase) the complexity of the SVG path (again, with Inkscape)

These operations change the path of your SVG files, in this way the vectalign alignment can produce different results and (maybe) fix your issue.

[AkshayChordiya]

@bonnyfone Thank you for such fast response. I got the issue. I'll take a look at dev branch, if possible just push a binary (jar) of the dev branch.

About GUI: It's just wow and really fantastic idea. And I'm really excited to use it. Things you suggested: I'm not going to edit those files because they are the official icons. And changing them is of not much use.

PS: I'd like to add that the result paths differed when I used vectalign with both svg compared when using with path values in a txt file. I hope you take a look there too. You can use the svgs which I gave above for trying.

[bonnyfone]

@AkshayChordiya Uhm that should not happen, I'll take a look! Thanks again

[AkshayChordiya]

@bonnyfone Thanks

[bonnyfone]

@AkshayChordiya v0.2 of VectAlign has just been released. You can now try different morphing strategies directly from the VectAlign GUI! Check it out: v0.2