It is currently November 15th, 2019, 11:30 am

Thread for help with the new Shape meter

Help with creating, editing & fixing problems with skins
User avatar
balala
Rainmeter Sage
Posts: 9053
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Thread for help with the new Shape meter

balala » August 8th, 2019, 2:29 pm

sl23 wrote:
August 8th, 2019, 1:02 pm
Good to know of alternatives
There always are alternatives. In some cases many.
xenium
Posts: 397
Joined: January 4th, 2018, 9:52 pm

Re: Thread for help with the new Shape meter

xenium » October 18th, 2019, 11:23 am

Hi,
It is possible to use Shape Meter to achieve this:
Picture2.png
Thanks
You do not have the required permissions to view the files attached to this post.
User avatar
jsmorley
Developer
Posts: 19710
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Re: Thread for help with the new Shape meter

jsmorley » October 18th, 2019, 11:50 am

Sure. Pretty much anything you can draw with vector graphics can be done with a Shape meter.

You can do it purely in handwritten code, but that shape has a lot of bezier curves, and it would be a chore (and that's putting it mildly) to get it right... As you will see in a second, most of the curve measurements are at a granularity of 6 or even 7 decimal places. Yike...

So I imported that .png rastor graphics file into Inkscape and then "traced" it to get a vector representation. Then I deleted the imported bitmap and saved the resulting .svg file.

https://m.wikihow.com/Trace-an-Image-Using-Inkscape

Then I used theAzack9's VectorConverter to convert the .svg file into Rainmeter code for a Shape meter.

Code: Select all

[ConvertedShape]
Meter=Shape
X=0
Y=0
Shape = Path Path1 | fill color 0, 0, 0 | StrokeWidth 0.6542815
Path1 = 38.821234, 69.694048 | CurveTo 7.2946638, 58.857159, 27.741204, 68.706562, 15.731954, 66.751974 | CurveTo 7.0208238, 34.752498, 0.85752381, 52.434597, 2.0064438, 41.68047 | CurveTo 45.824624, 7.235185, 16.069204, 21.225531, 30.861214, 12.755914 | CurveTo 87.617964, 4.002958, 59.090614, 2.682188, 73.882144, -0.21864205 | CurveTo 111.65218, 31.034724, 99.839274, 7.58722, 110.0529, 18.181259 | CurveTo 97.844524, 63.642816, 113.53563, 43.312026, 108.65077, 56.930162 | CurveTo 72.664434, 70.180257, 90.447094, 68.625079, 81.418914, 70.090775 | CurveTo 38.821234, 69.694048, 61.390064, 70.565385, 50.071784, 70.614605 | ClosePath 1

1.jpg


Drawing.svg:

Code: Select all

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="210mm"
   height="297mm"
   viewBox="0 0 210 297"
   version="1.1"
   id="svg3750"
   inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
   sodipodi:docname="drawing.svg">
  <defs
     id="defs3744" />
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.35"
     inkscape:cx="-28.571429"
     inkscape:cy="560"
     inkscape:document-units="mm"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="1920"
     inkscape:window-height="1027"
     inkscape:window-x="-8"
     inkscape:window-y="-8"
     inkscape:window-maximized="1" />
  <metadata
     id="metadata3747">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
        <dc:title></dc:title>
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <path
       style="fill:#000000;stroke-width:0.6542815"
       d="M 38.821234,69.694048 C 27.741204,68.706562 15.731954,66.751974 7.2946638,58.857159 0.85752381,52.434597 2.0064438,41.68047 7.0208238,34.752498 16.069204,21.225531 30.861214,12.755914 45.824624,7.235185 c 13.26599,-4.552997 28.05752,-7.45382705 41.79334,-3.232227 12.22131,3.584262 22.434936,14.178301 24.034216,27.031766 1.88345,12.277302 -3.00141,25.895438 -13.807656,32.608092 -7.39743,4.982263 -16.42561,6.447959 -25.18009,6.537441 -11.27437,0.385128 -22.59265,0.434348 -33.8432,-0.486209 z"
       id="path3724"
       inkscape:connector-curvature="0" />
  </g>
</svg>
I'm no expert on Inkscape, and to be honest I'm far, far from an expert in vector graphics in general, so play with it to see how best to size and tweak your drawing as you like. Getting a more complex .png image to trace properly is as much arcane dark art as it is science.
You do not have the required permissions to view the files attached to this post.
xenium
Posts: 397
Joined: January 4th, 2018, 9:52 pm

Re: Thread for help with the new Shape meter

xenium » October 18th, 2019, 1:15 pm

jsmorley wrote:
October 18th, 2019, 11:50 am
Sure. Pretty much anything you can draw with vector graphics can be done with a Shape meter.
....
Thanks a lot for explaining the conversion procedure in detail. :bow: :rosegift:
User avatar
jsmorley
Developer
Posts: 19710
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Re: Thread for help with the new Shape meter

jsmorley » October 18th, 2019, 1:31 pm

xenium wrote:
October 18th, 2019, 1:15 pm
Thanks a lot for explaining the conversion procedure in detail. :bow: :rosegift:
Glad to help...

Once you have the Shape created by VectorConverter, you can then tweak it as you need in Rainmeter code.

Code: Select all

[ConvertedShape]
Meter=Shape
X=0
Y=0
Shape = Path Path1 | Fill Color 255,0,0,100 | StrokeWidth 2 | Stroke Color 255,255,255,255
Path1 = 38.821234, 69.694048 | CurveTo 7.2946638, 58.857159, 27.741204, 68.706562, 15.731954, 66.751974 | CurveTo 7.0208238, 34.752498, 0.85752381, 52.434597, 2.0064438, 41.68047 | CurveTo 45.824624, 7.235185, 16.069204, 21.225531, 30.861214, 12.755914 | CurveTo 87.617964, 4.002958, 59.090614, 2.682188, 73.882144, -0.21864205 | CurveTo 111.65218, 31.034724, 99.839274, 7.58722, 110.0529, 18.181259 | CurveTo 97.844524, 63.642816, 113.53563, 43.312026, 108.65077, 56.930162 | CurveTo 72.664434, 70.180257, 90.447094, 68.625079, 81.418914, 70.090775 | CurveTo 38.821234, 69.694048, 61.390064, 70.565385, 50.071784, 70.614605 | ClosePath 1

1.jpg
You do not have the required permissions to view the files attached to this post.
xenium
Posts: 397
Joined: January 4th, 2018, 9:52 pm

Re: Thread for help with the new Shape meter

xenium » October 18th, 2019, 2:26 pm

jsmorley wrote:
October 18th, 2019, 1:31 pm
Glad to help...

Once you have the Shape created by VectorConverter, you can then tweak it as you need in Rainmeter code.

Code: Select all

[ConvertedShape]
Meter=Shape
X=0
Y=0
Shape = Path Path1 | Fill Color 255,0,0,100 | StrokeWidth 2 | Stroke Color 255,255,255,255
Path1 = 38.821234, 69.694048 | CurveTo 7.2946638, 58.857159, 27.741204, 68.706562, 15.731954, 66.751974 | CurveTo 7.0208238, 34.752498, 0.85752381, 52.434597, 2.0064438, 41.68047 | CurveTo 45.824624, 7.235185, 16.069204, 21.225531, 30.861214, 12.755914 | CurveTo 87.617964, 4.002958, 59.090614, 2.682188, 73.882144, -0.21864205 | CurveTo 111.65218, 31.034724, 99.839274, 7.58722, 110.0529, 18.181259 | CurveTo 97.844524, 63.642816, 113.53563, 43.312026, 108.65077, 56.930162 | CurveTo 72.664434, 70.180257, 90.447094, 68.625079, 81.418914, 70.090775 | CurveTo 38.821234, 69.694048, 61.390064, 70.565385, 50.071784, 70.614605 | ClosePath 1


1.jpg
:Ok
User avatar
jsmorley
Developer
Posts: 19710
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Re: Thread for help with the new Shape meter

jsmorley » October 18th, 2019, 2:57 pm

Code: Select all

[Rainmeter]
Update=1000
DynamicWindowSize=1
AccurateText=1

[Variables]

[ConvertedShape]
Meter=Shape
X=0
Y=0
Shape = Path Path1 | fill color 0, 0, 0 | StrokeWidth 0.13229166
Shape2 = Path Path2 | StrokeWidth 0
Shape3 = Combine Shape1 | XOR Shape2
Path1 = 25.557487, 51.049384 | CurveTo 15.834049, 47.746884, 22.439228, 50.745174, 18.580426, 49.434554 | CurveTo 4.788827, 24.27569, 8.707553, 43.367573, 4.781232, 35.024108 | CurveTo 17.585884, 5.7988778, 4.796427, 13.550556, 8.551947, 8.1281808 | CurveTo 37.794465, 4.0583348, 21.502254, 4.7890848, 23.917901, 4.5810278 | CurveTo 100.03769, 4.0725348, 43.554423, 3.8413728, 89.91372, 3.8519528 | CurveTo 121.86582, 5.8786918, 113.84338, 4.3733408, 117.57777, 4.6823418 | CurveTo 134.38692, 22.938907, 130.56652, 8.3061588, 133.98916, 12.969563 | CurveTo 130.31379, 40.831815, 134.65302, 29.608072, 133.16027, 36.165591 | CurveTo 113.4103, 51.051969, 126.87895, 46.462549, 120.22209, 50.487399 | CurveTo 106.29998, 51.056969, 111.47006, 51.212779, 108.21263, 51.214939 | CurveTo 95.24984, 47.461259, 103.23982, 50.803759, 98.69235, 49.324009 | CurveTo 87.42309, 41.533318, 92.41367, 45.926599, 90.19994, 44.249929 | CurveTo 79.33995, 30.812243, 83.73583, 37.926046, 81.34395, 34.753565 | CurveTo 75.96251, 19.128632, 77.30151, 26.80317, 76.46195, 23.898877 | CurveTo 74.61641, 14.858488, 75.66967, 16.33167, 75.51368, 15.836844 | CurveTo 71.84488, 13.078524, 73.88536, 14.061378, 72.91776, 13.439952 | CurveTo 69.34634, 12.839521, 71.11937, 12.834118, 70.76712, 12.800423 | CurveTo 66.70019, 13.361021, 67.76371, 12.883071, 67.64959, 12.905561 | CurveTo 63.5951, 16.581529, 64.98548, 14.183624, 63.97211, 15.234665 | CurveTo 63.2596, 18.970453, 63.49209, 16.949552, 63.34111, 18.024568 | CurveTo 59.88155, 30.884963, 62.87739, 23.405772, 61.8619, 26.987443 | CurveTo 48.642382, 44.370149, 57.42998, 35.709916, 53.13275, 40.865892 | CurveTo 38.758147, 49.709229, 45.701066, 46.665529, 42.15255, 48.582309 | CurveTo 32.897527, 51.045459, 36.269107, 50.535589, 34.841209, 50.861149 | CurveTo 25.557487, 51.049459, 31.289541, 51.197939, 27.101956, 51.200349 | ClosePath 1
Path2 = 63.64594, 12.88234 | CurveTo 70.66894, 10.850943, 65.53098, 11.273298, 67.88622, 10.592047 | CurveTo 75.5628, 12.876745, 72.57179, 11.027977, 74.09595, 11.658901 | CurveTo 76.37165, 13.480057, 75.96246, 13.208567, 76.32645, 13.480057 | CurveTo 76.67784, 12.893498, 76.41685, 13.480057, 76.55464, 13.216106 | CurveTo 77.40397, 11.537509, 76.80104, 12.570891, 77.1278, 11.960696 | CurveTo 85.15488, 6.5820188, 78.74804, 9.4779158, 80.87442, 8.1184278 | CurveTo 87.06209, 5.8621908, 86.17353, 6.2163908, 87.03177, 5.8924678 | CurveTo 69.53344, 5.8138008, 87.09239, 5.8319108, 79.20451, 5.8101408 | LineTo 51.949673, 5.8205008 | LineTo 53.53717, 6.3893828 | CurveTo 60.62366, 10.161621, 57.56393, 7.8323778, 59.13316, 8.6677008 | CurveTo 62.21116, 12.321941, 61.37768, 10.917379, 61.76944, 11.450497 | CurveTo 62.87164, 13.479493, 62.5337, 12.958266, 62.83091, 13.479164 | CurveTo 63.64594, 12.882374, 62.91234, 13.479824, 63.2608, 13.211118 | ClosePath 1

1.jpg
You do not have the required permissions to view the files attached to this post.
Yincognito
Posts: 682
Joined: February 27th, 2015, 2:38 pm

Re: Thread for help with the new Shape meter

Yincognito » October 18th, 2019, 3:11 pm

jsmorley wrote:
October 18th, 2019, 11:50 am
So I imported that .png rastor graphics file into Inkscape and then "traced" it to get a vector representation. I deleted the imported bitmap and saved the resulting .svg file. [...] Then I used theAzack9's VectorConverter to convert the .svg file into Rainmeter code for a Shape meter.
jsmorley wrote:
October 18th, 2019, 2:57 pm
Image
Wow, I had no idea you could do such things in Rainmeter! Absolutely amazing! :thumbup:
User avatar
sl23
Posts: 407
Joined: February 17th, 2011, 7:45 pm
Location: a Galaxy S7 far far away

Re: Thread for help with the new Shape meter

sl23 » October 27th, 2019, 10:02 pm

This is something more from curiosity at this stage, but if it's possible, I'd want to change my existing Sidebar skin to use it.

Can a ShapeMeter adjust size dynamically the same way that the [Rainmeter] Background=2 does?
I don't think this will work as it's not taking into account what other meters do.

Perhaps this is more related to the new Container function?
It's just that I quite like the whole shape meter as a background. Rounded corners and show Stroke on hover stuff. Useful and subtle which I prefer. Can that be done with Containers? I'm a bit wary of Containers as it looks a bit too much for me!

Anyway, just a thought...
Live for an ideal and leave no place in the mind for anything else
- MuLab - SoundCloud -
User avatar
jsmorley
Developer
Posts: 19710
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Re: Thread for help with the new Shape meter

jsmorley » October 27th, 2019, 10:31 pm

sl23 wrote:
October 27th, 2019, 10:02 pm
This is something more from curiosity at this stage, but if it's possible, I'd want to change my existing Sidebar skin to use it.

Can a ShapeMeter adjust size dynamically the same way that the [Rainmeter] Background=2 does?
I don't think this will work as it's not taking into account what other meters do.

Perhaps this is more related to the new Container function?
It's just that I quite like the whole shape meter as a background. Rounded corners and show Stroke on hover stuff. Useful and subtle which I prefer. Can that be done with Containers? I'm a bit wary of Containers as it looks a bit too much for me!

Anyway, just a thought...
Not exactly as DynamicWindowSize does. That would depend on the Shape meter basing its size on itself, which is a circular reference that can only run amok and never stop growing.

But you can have a Shape meter act as a background dynamically, if you know what other meter(s) are 1) The widest possible in the skin, and 2) The one at the bottom of the skin.

Code: Select all

[Rainmeter]
Update=1000
DynamicWindowSize=1
AccurateText=1

[Variables]

[MeterBackGround]
Meter=Shape
X=0
Y=0
DynamicVariables=1
Shape=Rectangle 0.5,0.5,([WidestMeter:X]+[WidestMeter:W]+10),([LastMeter:Y]+[LastMeter:H]+10),10 | StrokeWidth 1 | Stroke Color 255,255,255,255 | Fill Color 47,47,47,255

[WidestMeter]
Meter=String
X=10
Y=10
FontSize=11
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Some really wide text in a string meter

[AnotherMeter]
Meter=String
X=10
Y=10R
FontSize=11
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Some other meter

[LastMeter]
Meter=String
X=10
Y=10R
FontSize=11
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Some text at the bottom of the skin

1.jpg


There is no way to ask "what is the largest X+W value in the skin?" or "what is the largest Y+H value in the skin?", and even if you could, using that in a Shape meter would just once again cause a circular reference that would run amok.

I don't see that Container adds anything of any value to this.
You do not have the required permissions to view the files attached to this post.