SwiftSVG icon indicating copy to clipboard operation
SwiftSVG copied to clipboard

Fill:"None" not working, fills as black color

Open ggua5470 opened this issue 4 years ago • 13 comments

Same as #112

I am using the v2.3.2, and when a svg has fill="none" (e.g. the one below), it fills black color. https://cdn.shopify.com/s/files/1/0496/1029/files/Freesample.svg

I have to add fill-opacity="0" to make it work.

The one without fill="none" works ok: https://raw.githubusercontent.com/efc/SwiftSVG/master/SwiftSVGExamples/hawaiiFlowers.svg

ggua5470 avatar Jul 19 '20 02:07 ggua5470

The css color names has "none" for "#00000000", which works fine for parsing the color hex string. https://github.com/mchoe/SwiftSVG/blob/5069fc8e18a73d7694e8d82d14639dc64ace916a/SwiftSVG/SVG/Helpers/cssColorNames.json

But I guess when fill-opacity is not set, its default value is 1 so it overwrites the alpha of the fill color.

ggua5470 avatar Jul 21 '20 01:07 ggua5470

I am hitting the same issue, but it's with all literal colors i.e. fill="white" still will fill with black color, but fill="#FFFFFF" works. Maybe it's not specific to none?

zkhalapyan avatar Jul 23 '20 03:07 zkhalapyan

Anyone can look at this issue? I am using Cocoapods with the latest commit but still getting the wrong color when using a named color. I tested the code that reads the namedColor json files and it works, but the parsing of svg seems not using it correctly.

This makes this great library unusable if reading named color is not supported, or we have to manually replace the named color before parsing the svg...

Thanks.

ggua5470 avatar Aug 03 '20 03:08 ggua5470

Provided fix in fork, waiting for accepting pull request to origin

rosoksdev avatar Jun 29 '22 11:06 rosoksdev

Screenshot for approvement Знімок екрана 2022-06-29 о 13 27 44

rosoksdev avatar Jun 29 '22 11:06 rosoksdev

Thanks for the update! Looks good with fill="none" (with the sample svg above).
@rosoksdev Did you try fill="white" etc.? I haven't test it. I remember it did not work with the previous version, so I can't use it in production. Will try it myself later.

ggua5470 avatar Jul 04 '22 04:07 ggua5470

@ggua5470 I will test if named colors work at all. Fix provides solve only for transparent color, so I will test it on another svgs

rosoksdev avatar Jul 04 '22 06:07 rosoksdev

I am hitting the same issue, but it's with all literal colors i.e. fill="white" still will fill with black color, but fill="#FFFFFF" works. Maybe it's not specific to none?

CSS named color "none" was not working properly because of the alpha channel this the color - it just not applied to the color, so you technically received "#000000" (black) instead of "#00000000" (transparent). What about another colors: I will check and provide screenshots if something would not work fine

rosoksdev avatar Jul 04 '22 06:07 rosoksdev

@rosoksdev I am now using your repo, and changed from Pod to Package Manager. All fill="color-name" works, e.g. fill="white", fill="red". BUT it crashes for all svg with fill="none"!!???

It is crashing at Fillable.swift, on line 105: self.svgLayer.fillColor = UIColor(red: colorComponents[0], green: colorComponents[1], blue: colorComponents[2], alpha: opacity).cgColor

the colorComponents has only 2 values. Isn't it set to be UIColor.clear on line 72? 😂

====== Updated 1 ====== I just found out that, it only crashes when fill="none", and fill-opacity="0". If there is no fill-opacity="0", it will work as expected.

====== Updated 2 ====== for path or polyline, 1): fill="none" fill-opacity="any-value" ==> Crash. If no fill-opacity, Not crash. 2): fill="any-color-name" fill-opacity="any-value" ==> Works, if color name is unknown, it is black. All good.

ggua5470 avatar Jul 04 '22 08:07 ggua5470

@ggua5470 Thanks for the report, I will look at implementations and will notify you if something changes

rosoksdev avatar Jul 04 '22 11:07 rosoksdev

@ggua5470, I updated in latest commit, check if everything works

rosoksdev avatar Jul 04 '22 14:07 rosoksdev

@rosoksdev I did a quick test, it seems working now, at least for my limited use case ^_^ Thanks very much!

ggua5470 avatar Jul 04 '22 15:07 ggua5470

@ggua5470, great! Mention me if something will break again :D

rosoksdev avatar Jul 04 '22 16:07 rosoksdev