Search Unity

Unity Vector Graphics Preview Package

Discussion in '2D Experimental Preview' started by rustum, May 4, 2018.

  1. coshea

    coshea

    Joined:
    Dec 20, 2012
    Posts:
    256
    Colour tint on SVG sprites isn't working for me on an iPad 3 running iOS 9. Any ideas why? Tint isn't applied at all. Works on on newer iPad and in Unity Editor.

    Using Unity 2019.1.9f1 with vg package 1.0.0

    Thanks
     
  2. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    I think this is because the iPad 3 doesn't support GPU instancing, which is required for tinting to work with SVG sprites. This is caused by the fact that SVG sprites already use the color channel to store the shape's colors, so that channel can't be used for tinting anymore.

    The only workaround we have at the moment is to use separate materials and change the material's tint instead. But this is only a good workaround if you have a limited number of tints you want to use.
     
  3. coshea

    coshea

    Joined:
    Dec 20, 2012
    Posts:
    256
    Ah thanks, good to know about the instancing.

    I'd love to see opaque shaders included too by default in this package, giving users starting from scratch the chance to use them and get updates in one place. Any thoughts on this? A lot of vectors graphics stuff doesn't need alpha and would run better particularly on mobile with opaque shaders.
     
  4. meikellp

    meikellp

    Joined:
    Apr 6, 2014
    Posts:
    8
    Hey @mcoted3d I just tested the SVG package for the first time and I get a weird bug when I try to rotate the UI Image component via the RectTransform component (changing Z).


    Is this intentional? If yes, how do I fix it?
     
  5. hazel_koop

    hazel_koop

    Joined:
    Apr 9, 2019
    Posts:
    8
    Is this where to file bug reports? I've just encountered a file, produced by InkScape, that works correctly in every SVG parser that I've found except this one (and that only takes a small manual change to get it working in this one).

    The issue is that for some reason, for some of the gradients, InkScape wrote the
    xlink:href="#linearGradient17606"
    tag BEFORE the
    id="linearGradient17606"
    tag, and I guess the parser doesn't collect all the tags before it starts parsing them; if I change the order of those two tags so that the xlinking tag comes AFTER what it's linking to, it works fine.

    We're not sure what resulted in InkScape printing the tags in that order; we've been working on a project full of hundreds of SVG files for months now, and this is the first time it's happened... I've fixed the offending SVG file manually for now, but I thought it would be worth bringing up since it seems like there's no guarantee that it has to happen the way the parser assumes it would, and it might happen again for other folks, maybe in quantities that aren't so easy to fix manually...

    I've attached the file here so you can see what I mean; compare the character's hair and shirt in Unity vs in Firefox (for example). In Unity they turn out flat white, because that's what VectorUtils.SampleGradient returns if a gradient's
    stops
    property is null.
     

    Attached Files:

  6. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    Definitely not intentional. Can you report a bug with the problematic asset please? (Help > Report a Bug...)
     
  7. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    I think we're supposed to handle gradients defined later in the file properly. If not, please report a bug with the regular bug reporter (Help > Report a Bug...). Thanks!
     
  8. meikellp

    meikellp

    Joined:
    Apr 6, 2014
    Posts:
    8
    Please see 1197327
     
    mcoted3d likes this.
  9. coshea

    coshea

    Joined:
    Dec 20, 2012
    Posts:
    256
    So is instancing only used for tinting, not the SVG sprites in general?

    How do other sprite based assets get around this, like 2dtoolkit, where the material is shared but the tint can be changed? They don't use instancing as the tint works on old devices.

    Is there any specific info on what GPU/devices don't support instancing? What about on Android?

    Thanks
     
  10. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    Other sprite using the color channel of the vertices to apply the tint. The problem is that SVG sprites use the color channel to store the shapes color instead, so the tint has to be provided by a different mecanism.

    Older Android devices may have a similar problem. The GPU instancing page mentions which are the supported platforms:

    GPU Instancing is available on the following platforms and APIs:
    • DirectX 11 and DirectX 12 on Windows
    • OpenGL Core 4.1+/ES3.0+ on Windows, macOS, Linux, iOS and Android
    • Metal on macOS and iOS
    • Vulkan on Windows, Linux and Android
    • PlayStation 4
    • Xbox One
    • WebGL (requires WebGL 2.0 API)

    (From: https://docs.unity3d.com/Manual/GPUInstancing.html)
     
  11. FlorentFal

    FlorentFal

    Joined:
    Nov 20, 2015
    Posts:
    41
    Hello,

    On a Unity 2019.2.9 mobile project (LWRP), I use some sprite vectors to build a UI (canvas - Screen space overlay). I create an android build and launch it on a Samsung S9, the scene and sprites are correctly display, but as soon the app lose the focus (if I switch to another app without closing the unity app), once I'm come back to the app all sprite vectors are no more display. I've got 0 error messages..

    Any idea on how to solve this issue ?

    UPDATE: switching the canvas mode to Camera screen space camera solve the issue...is it normal for the screen space overlay mode to trigger such behavior ??


    Thanks
     
    Last edited: Nov 14, 2019
  12. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    Not normal. Can you please file a bug report? (Help > Report a Bug...)
     
  13. denis_88

    denis_88

    Joined:
    Apr 20, 2015
    Posts:
    8
    Hello, how to get rid of annoying error, thanks

    "Missing Profiler.EndSample (BeginSample and EndSample count must match): GenerateAtlas
    Previous 5 samples:
    Mono.JIT
    CopyChannels
    Mono.JIT
    GC.Alloc
    Mono.JIT
    In the scope:
    GenerateAtlas
    TestVectorUtils.Update()
    BehaviourUpdate
    Update.ScriptRunBehaviourUpdate
    PlayerLoop"

    Code (CSharp):
    1.  
    2. using Unity.VectorGraphics;
    3. using UnityEngine;
    4. using System.IO;
    5.  
    6. public static class PetFoodSVG
    7. {
    8.     #region fields
    9.  
    10.     const string svg =
    11.      "<svg width=\"91px\" height=\"65px\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xml:space=\"preserve\" xmlns:serif=\"http://www.serif.com/\" style=\"fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;\"><g id=\"petFood\"><path d=\"M5.907,54.636c-11.678,-12.785 -4.281,-22.943 6.954,-29.214c1.187,-9.202 5.935,-15.64 16.95,-14.994c16.338,-16.07 34.799,-14.929 46.503,13.039c15.265,5.992 19.353,19.401 5.65,31.169c-15.95,13.698 -63.545,13.698 -76.057,0Z\" style=\"fill:#f3f3f3;\"/><clipPath id=\"_clip1\"><path d=\"M5.907,54.636c-11.678,-12.785 -4.281,-22.943 6.954,-29.214c1.187,-9.202 5.935,-15.64 16.95,-14.994c16.338,-16.07 34.799,-14.929 46.503,13.039c15.265,5.992 19.353,19.401 5.65,31.169c-15.95,13.698 -63.545,13.698 -76.057,0Z\"/></clipPath><g clip-path=\"url(#_clip1)\"><path d=\"M71.273,4.868c2.474,24.749 -11.232,40.852 -35.995,33.15c-2.98,19.675 -20.725,22.233 -37.99,26.892l101.409,15.056l2.825,-65.192l-30.249,-9.906Z\" style=\"fill:#e6e6e6;\"/></g></g></svg>";
    12.  
    13.     static VectorUtils.TessellationOptions tessOptions;
    14.     static Scene scene;
    15.  
    16.     // static Shape s1, s2;
    17.     static Color c1, c2;
    18.     static SolidFill f1, f2;
    19.     static bool hasInit;
    20.  
    21.     #endregion
    22.  
    23.     static void initialize()
    24.     {
    25.         tessOptions = new VectorUtils.TessellationOptions()
    26.         {
    27.             StepDistance = 100.0f,
    28.             MaxCordDeviation = 0.5f,
    29.             MaxTanAngleDeviation = 0.1f,
    30.             SamplingStepSize = 0.01f
    31.         };
    32.  
    33.         SVGParser.SceneInfo sceneInfo = SVGParser.ImportSVG(new StringReader(svg));
    34.         scene = sceneInfo.Scene;
    35.  
    36.         SceneNode sceneNode = scene.Root;
    37.         Shape s1 = sceneNode.Children[0].Children[0].Shapes[0];
    38.         Shape s2 = sceneNode.Children[0].Children[1].Children[0].Shapes[0];
    39.  
    40.         f1 = s1.Fill as SolidFill;
    41.         c1 = f1.Color;
    42.  
    43.         f2 = s2.Fill as SolidFill;
    44.         c2 = f2.Color;
    45.  
    46.         hasInit = true;
    47.     }
    48.  
    49.     public static Sprite getSprite(Color color)
    50.     {
    51.         if (!hasInit)
    52.         {
    53.             initialize();
    54.         }
    55.  
    56.         f1.Color = c1 * color;
    57.         f2.Color = c2 * color;
    58.         // s1.Fill = new SolidFill { Color = c1 * color };
    59.         // s2.Fill = new SolidFill { Color = c2 * color };
    60.  
    61.         var geoms = VectorUtils.TessellateScene(scene, tessOptions);
    62.         var sprite = VectorUtils.BuildSprite(geoms, 100.0f, VectorUtils.Alignment.Center, Vector2.zero, 16, true);
    63.  
    64.         return sprite;
    65.     }
    66. }
    67.  
    68. // TestVectorUtils.cs...
    69. //  void Update()
    70. // {
    71.  
    72. //  if (Input.GetKeyDown(KeyCode.E))
    73. //  {
    74. //error
    75. //      GetComponent<SpriteRenderer>().sprite = PetFoodSVG.getSprite(Random.ColorHSV());
    76. //  }
    77. // }
    78.  
    79.  
     
    Last edited: Nov 18, 2019
  14. hdxpmc

    hdxpmc

    Joined:
    May 1, 2016
    Posts:
    26
    Hello
    How to know the mesh use vertex color or gradient to apply ?

    Thank you
     
  15. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    It probably occurs when calling GenerateAtlas() when the geometry doesn't have any texture/gradient to put in an atlas. We'll fix this in the next version. In the meantime, if you detect there's no texture or gradient fills in your scene, you can skip the GenerateAtlas() call altogether.
     
  16. dgoyette

    dgoyette

    Joined:
    Jul 1, 2016
    Posts:
    2,102
    When going from preview 30 to preview 31, all of the SVG images lose their image names. For example, here are some SVGs under preview 30:

    upload_2019-11-18_16-59-2.png

    And the same thing under preview 31:

    upload_2019-11-18_16-58-49.png

    Notice that the name is gone. This happened to all of my SVGs. This is a known problem? This change means that I can no longer search by name when picking SVG images in the inspector.
     
  17. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    This isn't intended and will be fixed in the next version (will be released this week).
     
    dgoyette likes this.
  18. umiringo73

    umiringo73

    Joined:
    Apr 18, 2017
    Posts:
    3
    Hi
    I am using the function RenderSpriteToTexture2D to convert a svg sprite to a texture2D.
    My game is pixel senstive, and I found that the pixel of this texture2D in iOS and Android is different?
    Is this possible? or I did something wrong?

    Thank you!
     
  19. hazel_koop

    hazel_koop

    Joined:
    Apr 9, 2019
    Posts:
    8
    Has this been addressed yet? I'm still having the same problem nickfourtimes was having, of being unable to do tinting and masking on the same svg sprite... I've worked around it with a separate component that assigns the tint through materialpropertyblocks, but that relies on finding and using the same materialpropertyblock that the sprite system is already using to assign the texture that holds the gradient altas, which seems too fragile to depend on... (the "make a new material" system isn't really an option for us, because we want to be able to change the colors in the editor outside of play mode too, and that would leak materials into the scene...)
     
  20. hazel_koop

    hazel_koop

    Joined:
    Apr 9, 2019
    Posts:
    8
    Here's the bug report for the gradient-order parsing bug: http://fogbugz.unity3d.com/default.asp?1199682_3q4r9fs1a4b26tr5
     
    mcoted3d likes this.
  21. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    Hard to tell. Different platforms may render the same geometry slightly differently. If the images are totally different and it looks like a bug, I would encourage you to file a bug report (Help > Report a Bug...). Thanks!
     
  22. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    No, unfortunately. This turned out more complex than anticipated. Our strategy was to use an additional vertex channel to store the shape color, but at the same time, we don't want to add more bandwidth than necessary when GPU instancing is available. This makes the situation pretty hard to deal with.

    We will revisit. A "good enough" workaround for us could be to make the color channel optional in the SVG importer, so you only activate it when you know you need it.
     
  23. hdxpmc

    hdxpmc

    Joined:
    May 1, 2016
    Posts:
    26
    Hello,
    We try to split svg layer to sprites as guiding in page 5 in unity 2019.3.0b12 with latest preview svg package 2.0. After draging svg to unity

    OnPostProcessSprites: Not called
    OnPostprocessAllAssets: Called with exception "Not allowed to override geometry on sprite ''

    UnityEngine.Sprite:OverrideGeometry(Vector2[], UInt16[])

    Unity.VectorGraphics.VectorUtils:BuildSprite(List`1, Rect, Single, Alignment, Vector2, UInt16, Boolean) (at Library/PackageCache/com.unity.vectorgraphics@2.0.0-preview.10/Runtime/VectorSprite.cs:119)

    Unity.VectorGraphics.VectorUtils:BuildSprite(List`1, Single, Alignment, Vector2, UInt16, Boolean) (at Library/PackageCache/com.unity.vectorgraphics@2.0.0-preview.10/Runtime/VectorSprite.cs:72)

    Unity.VectorGraphics.SVGPostprocessor:OnPostprocessAllAssets(String[], String[], String[], String[]) (at Assets/Editor/SVGPostProcessor.cs:156)

    UnityEditor.AssetPostprocessingInternalPostprocessAllAssets(String[], String[], String[], String[], String[])

    UnityEditorInternal.InternalEditorUtilityProjectWindowDrag(HierarchyProperty, Boolean)

    UnityEngine.GUIUtilityProcessEvent(Int32, IntPtr)

    ----------- The script running -------------
     

    Attached Files:

  24. mcoted3d

    mcoted3d

    Unity Technologies

    Joined:
    Feb 3, 2016
    Posts:
    358
    As far as I can tell, you should be able to override the sprite geometry during the asset postprocessor phase. Can you please file a bug report (Help > Report a Bug...), we'll try to find what introduced this issue.
     
  25. Little10Robot

    Little10Robot

    Joined:
    Aug 23, 2017
    Posts:
    14
    Using the Vector Graphics Package to iOS has been very smooth for me. I'm finally getting around to testing on Android and am running into a lot of issues. The app builds and installs, but the sprites are rendering pink on my device. Do I have to manually add certain shaders?

    Currently in Unity 2019.2.13f1
     
    Last edited: Nov 25, 2019
  26. vzlomvl

    vzlomvl

    Joined:
    Jun 25, 2016
    Posts:
    16
    Hello Unity team.
    After updating to 1.0.0-preview.32 SVGImage with Unlit_VectorGradientUI material start to render transparent elements incorrectly.
    Like a workaround, I have changed Blend in VectorGradientUI from "Blend SrcAlpha OneMinusSrcAlpha" to "Blend One OneMinusSrcAlpha" and render back to normal.
    But I'm not sure if something else has broken.
    Bug report link: https://fogbugz.unity3d.com/default.asp?1200826_p0ljij9jdec4l2do
    Thanks.
     
    mcoted3d likes this.
  27. hdxpmc

    hdxpmc

    Joined:
    May 1, 2016
    Posts:
    26
    Hello,
    We have tested to import at runtime, it is alright to import SVG to multiple sprite.
     
  28. jarnott-speedwell

    jarnott-speedwell

    Joined:
    Nov 9, 2019
    Posts:
    1
    Hi,

    I'm fairly new to Unity, so apologies if this is user error or if I use the wrong terminology. I'm running into an issue where any SVG that contains a gradient is rendering incorrectly. Example:

    upload_2019-11-27_1-44-9.png

    Bottom right is how it's meant to appear, top left is how it's actually rendering. It's like it's drawing the gradient texture overlaid on top instead of mapping it to the SVG paths. This happens for even the simplest, smallest gradients in an otherwise gradient-free SVG - basically anything that makes it use the Unlit_VectorGradient material. SVGs without a gradient appear fine.

    I'm on Unity 2019.2.13f1 with Vector Graphics 2.0.0-preview.10.
     
  29. FlorentFal

    FlorentFal

    Joined:
    Nov 20, 2015
    Posts:
    41
    1. Make sure the SpriteRenderer is using the "Unlit/VectorGradient" shader
    2. Make sure the Canvas has "TexCoord2" enabled in the "Additional Shader Channels".
     
  30. hazel_koop

    hazel_koop

    Joined:
    Apr 9, 2019
    Posts:
    8
    I've just hit a pretty major problem with the SVG importer, that thankfully has a tiny fix, but took me ages to find:

    Certain assets in our project were showing up at very different sizes on each developer's machine, even though our projects were perfectly in sync; the asset files were identical and so were the import settings (it was all being managed by git). After enough debugging, I finally tracked down the point at which the values diverged during the import process, and it turned out to be because SVGParser.cs was doing
    if (dpi == 0.0f) dpi = Screen.dpi
    !

    Why would anyone want their project's graphics to all change their world size according to the screen DPI of the machine that the project is being edited on?? I'm not sure if it would even make sense to make the DPI match whatever screen it was imported on, but at least that way it wouldn't be inconsistent across everyone's machines...

    For the time being, we've just edited that line to hardcode the dpi to 96 (what it was on our artist's machine) but I feel like this should probably be changed in the official plugin too; I can't think of a reason to include a feature that silently makes assets turn out different under the same importer settings, let alone one that treats Unity's 3D world space as being in different units depending on the properties of each developer's monitor.

    For the record, it looks like this situation only occurs when the
    width
    and
    height
    attributes of the root
    <svg>
    tag use units; it was happening for us in an asset whose dimensions were
    width="30.37601mm" height="29.94224mm"
    , but not one whose dimensions were
    width="1964.0498" height="1979.70947"
    , for example. (We haven't yet isolated what caused some of the files to be exported with units and others without.)

    We have a test case that demonstrates the problem; I can submit it as a bug report if you'd like.
     
    Miguel_LZ likes this.