VectorConverter [V 0.1.3]

[theAzack9]

Ok, so i've been working on a tool (made as a skin) that can convert .svg files to actual shape meters. It is far from finished, but it is working in enough cases that i'm opening it for a beta

Download

VectorConverter_0.1.2.rmskin

Changelog

• Fixed a big oversight when parsing paths

• Fixed bug in xml-parser where tags with hyphens wouldn't be recognized.
• Fixed bug where path wouldn't recognized numbers with powers (e.g 2.1e-5).
• Made path smaller, but it needs some cleanup :/

• fixed stroke-width not always working.
• added rgb syntax.
• fixed issue where arc sweep direction was switched

• Open beta

This tool is far from finished an even the gui is in an unfinished state. The way you currently use it is to use the browse button which gives you a file explorer to select the svg file, or you can drop the file directly into the path field. Afterwards do you just press convert and it will all convert automagically
When it is converted is it automatically pasted into you clipboard, so you just move to the skin you want to paste it into and do ctrl+v. (Warning, this will clear your clipboard)
This is a temporary solution.

If all goes well you'll get a nice preview of the code, but you can't select it or interact with it at all.

Warning!
There is no error system at this moment, if the file could not be converted will the the lua converter either crash or make something that does not look like the end result.

There are also added some test svg files for now, these will probably be removed at a later date.

Here is a preview of the gui:


If you could not convert your .svg file, please consider posting it here so i can look at it and try fix it (some things won't ever work, but it is worth taking a look at )

Warning 2:
The code is really messy, don't look at it :/

Also, on another note... Sorry jsmorley for trying to make a skin into something a skin isn't

[jsmorley]

This is really great. This means we can get into InkScape or Adobe Illustrator and use those tools to create complex shapes, and then easily convert the .svg file we save into a Rainmeter skin. This is going to be a huge hit...

[jsmorley]

One thing I notice:

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 37.5 63" style="enable-background:new 0 0 37.5 63;" xml:space="preserve">
<style type="text/css">
	.st0{fill:none;stroke:#2A6D9B;stroke-width:4;}
	.st1{fill:#E09028;}
	.st2{fill:#2A6D9B;}
	.st3{fill:none;}
</style>
<path class="st0" d="M35,39.4c0,8.2-7.2,14.9-16,14.9S3,47.6,3,39.4C3,31.2,19,6.3,19,6.3S35,31.2,35,39.4z"/>
<path class="st1" d="M18.9,37.7c-8.7-6.2-11.7,0-11.7,0C7,38.1,7,38.6,7,39c0,6.2,5.4,11.2,12,11.2s12-5,12-11.2
	c0-0.4-0.1-0.8-0.1-1.3C30.9,37.7,27.5,43.9,18.9,37.7z"/>
<g>
	<path class="st2" d="M99.1,64c-0.1,0-0.3,0-0.4,0s-0.3,0-0.4,0s-0.2,0-0.4,0s-0.3,0-0.4,0"/>
</g>
<path id="_x3C_スライス_x3E__3_" class="st3" d="M289.7,9"/>
</svg>

That stroke-width:4 the first shape is not being recognized, and it is set to 0.

Code: Select all

[ConvertedShape]
Meter=Shape
X=0
Y=0
Shape = Path Path1 | stroke color 2A6D9B | fill color 0,0,0,0 | StrokeWidth 0
Shape2 = Path Path2 | fill color E09028 | StrokeWidth 0
Shape3 = Path Path3 | fill color 2A6D9B | StrokeWidth 0
Path1 = 35, 39.4 | CurveTo 19, 54.3, 35, 47.6, 27.8, 54.3 | CurveTo 3, 39.4, 10.2, 54.3, 3, 47.6 | CurveTo 19, 6.3, 3, 31.2, 19, 6.3 | CurveTo 35, 39.4, 19, 6.3, 35, 31.2 | ClosePath 1
Path2 = 18.9, 37.7 | CurveTo 7.2, 37.7, 10.2, 31.5, 7.2, 37.7 | CurveTo 7, 39, 7, 38.1, 7, 38.6 | CurveTo 19, 50.2, 7, 45.2, 12.4, 50.2 | CurveTo 31, 39, 25.6, 50.2, 31, 45.2 | CurveTo 30.9, 37.7, 31, 38.6, 30.9, 38.2 | CurveTo 18.9, 37.7, 30.9, 37.7, 27.5, 43.9 | ClosePath 1
Path3 = 99.1, 64 | CurveTo 98.7, 64, 99, 64, 98.8, 64 | CurveTo 98.3, 64, 98.6, 64, 98.4, 64 | CurveTo 97.9, 64, 98.2, 64, 98.1, 64 | CurveTo 97.5, 64, 97.7, 64, 97.6, 64

If I manually set the StrokeWidth to 4 on Shape, then it works correctly.

1.jpg

[lysy1993lbn]

Bug report: Doesn't convert RGB color, leaves "web" value rbg(0,0,0)

Otherwise it's pretty damn awesome

/Edit
SVG I have issue with

Code: Select all

<svg 
 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"
 width="1.658cm" height="1.341cm">
<path fill-rule="evenodd"  fill="rgb(0, 0, 0)"
 d="M39.902,34.000 L6.098,34.000 C3.835,34.000 2.000,32.153 2.000,29.875 L2.000,11.312 C2.000,9.034 3.835,7.187 6.098,7.187 C6.098,7.187 7.280,7.187 9.203,7.187 C10.348,7.187 11.756,1.000 13.332,1.000 C19.071,1.000 27.050,1.000 32.764,1.000 C33.900,1.000 35.971,7.187 36.893,7.187 C39.357,7.187 39.902,7.187 39.902,7.187 C42.165,7.187 44.000,9.034 44.000,11.312 L44.000,29.875 C44.000,32.153 42.165,34.000 39.902,34.000 ZM23.150,7.282 C16.644,7.282 11.370,12.591 11.370,19.141 C11.370,25.691 16.644,31.000 23.150,31.000 C29.657,31.000 34.931,25.691 34.931,19.141 C34.931,12.591 29.657,7.282 23.150,7.282 ZM23.163,25.337 C19.768,25.337 17.016,22.567 17.016,19.149 C17.016,15.732 19.768,12.962 23.163,12.962 C26.557,12.962 29.309,15.732 29.309,19.149 C29.309,22.567 26.557,25.337 23.163,25.337 Z"/>
</svg>

Made with Photoshop CC

[sephirotess]

Hi,

I really like the idea. I tried and the small tools manages to transcribe the code when there are few colors. He can not do it (according to my tests) when there are many colors or gradients.

I use many shape shapes with my last suites and I also have many PNG that I would like to be able to "transform" into codes. I will wait for the next version of the tool to test again .

[theAzack9]

Hi,

I really like the idea. I tried and the small tools manages to transcribe the code when there are few colors. He can not do it (according to my tests) when there are many colors or gradients.

I use many shape shapes with my last suites and I also have many PNG that I would like to be able to "transform" into codes. I will wait for the next version of the tool to test again .

Hi, if it is possible could you post some of the svg's that does not work? It will help me find the issues faster

Gradients and transforms are not currently implemented, but i will work on that

(i guess you meant svg's and not png's )

[theAzack9]

jsmorley and lysy1993lbn

it should be fixed in the latest version

[eclectic-tech]

Downloaded and installed version 0.1.1

The conversion is very erratic on the files I have tried. Let's start with this one...

flow-go.zip

This is a sample svg from the InkScape program.

It converted the file to Rainmeter code, but nothing displayed when loaded. Looking at the code, the StrokeWidth is zero for all shapes. Manually changing the StrokeWidth to '1' displayed the shapes.

flowgo.png

This is looking very promising, so take your time...

[sephirotess]

i guess you meant svg's and not png's

Hi,

I was talking about PNGs, but converted to SVGs . I work on Paint.Net and Gimp, so I only use PNGs. I use Inkscape for SVG conversions. As I said, I have many PNGs that I would like to be able to "transform" into code, in order to gain a little space in my "rmskin" and especially because I will be unable to transcribe them in code .

Here is a small example that does not work. This is an image I use in my docks for the "restart" function of Windows. I have enlarged the image a bit so that it is a more visible . I posted the original and the SVG version in the Zip.

RE(resize).png

Restart pictures.zip

[FreeRaider]

@theAzack9 good job! Your converter will be a masterpiece and perhaps I will like the Shape meter.

OFF-TOPIC
jsmorley, StrokeWidth is "the cause of all evil"