Jump to content

Recommended Posts

I'm using Affinity Designer for Windows and exporting SVGs with gradients for use with Unity. Unfortunately, Unity's SVG importer seems to have issues with the gradients. Here is what the Unity developer said:

Quote

What happens is that Affinity Designer exported the gradient definition *after* the path that uses it. Although this seems to be conformant with the SVG spec, we do not currently support this and we require the <def> section to be defined before the elements that reference it.

We will try to improve on this in future versions of the SVG importer. In the meantime, maybe there's an option to force Affinity Designer to export the gradient definitions ealier in the file? For your example, I manually moved the <def> section before the <path> to fix it.

For reference, here is the exported circle w/ gradient:

<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="54px" height="54px" 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:1.41421;"><path id="GradientHill" d="M0.012,26.717c0,-14.743 11.97,-26.713 26.714,-26.713c14.743,0 26.713,11.97 26.713,26.713c0,14.743 -11.97,26.713 -26.713,26.713c-14.744,0 -26.714,-11.97 -26.714,-26.713Z" style="fill:url(#_Linear1);"/><defs><linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(3.2714e-15,-53.4261,53.4261,3.2714e-15,26.7255,53.43)"><stop offset="0" style="stop-color:#9d9d9d;stop-opacity:1"/><stop offset="0.47" style="stop-color:#e9e9e9;stop-opacity:1"/><stop offset="1" style="stop-color:#fff;stop-opacity:1"/></linearGradient></defs></svg>

 

Does anyone know if what he says is possible? An AD export option to force gradients to be defined earlier in the file?

Thanks!

Share this post


Link to post
Share on other sites

☛ Affinity Designer 1.7.3 ◆ Affinity Photo 1.7.3 ◆ OSX El Capitan

Share this post


Link to post
Share on other sites

I mean is there an existing export option within AD to modify the format of the generated SVG upon export?

The Unity engineers will work on a better SVG importer, but for now I am unable to work around this limitation (without manually editing the generated SVG of course).

Share this post


Link to post
Share on other sites

No AFAIK there isn't actually any Affinity SVG option/setting which would affect this, so you will probably have to rearrange the generated SVG code manually.


☛ Affinity Designer 1.7.3 ◆ Affinity Photo 1.7.3 ◆ OSX El Capitan

Share this post


Link to post
Share on other sites

You should post an explicit Feature Request in the Suggestions for Affinity Designer sub-forum.

John


Windows 10, Affinity Photo 1.7 and Designer 1.7, (mainly Photo), now ex-Adobe CC

CPU: AMD A6-3670. RAM: 16 GB DDR3 @ 666MHz, Graphics: 2047MB NVIDIA GeForce GT 630

Share this post


Link to post
Share on other sites

Hi Pawl :)

As other members have confirmed, there's no way to change this from within Affinity currently and any changes will need to be done manually. I've moved this thread to our Feature Requests section of the forums!

Share this post


Link to post
Share on other sites

Thanks guys!

I can workaround for now but will follow up with the Unity devs. Ideally, their parser would account for this export format, considering it's a standard part of the SVG spec.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

These are the Terms of Use you will be asked to agree to if you join the forum. | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.