It is currently October 21st, 2019, 4:14 am

Border around a meter

Tips and Tricks from the Rainmeter Community
User avatar
jsmorley
Developer
Posts: 19591
Joined: April 19th, 2009, 11:02 pm
Location: Fort Hunt, Virginia, USA

Border around a meter

jsmorley » September 27th, 2017, 4:03 pm

Someone on IRC asked how to put a border on a meter...

Code: Select all

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

[Variables]
BorderWidth=3
BorderColor=150,150,150,255

[MeterText]
Meter=String
X=#BorderWidth#
Y=#BorderWidth#
FontSize=20
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Hello World

[MeterBorder]
Meter=Shape
Shape=Rectangle #BorderWidth#, #BorderWidth#, [MeterText:W], [MeterText:H] | Fill Color 0,0,0,0 | StrokeWidth #BorderWidth# | Stroke Color #BorderColor#
DynamicVariables=1
1.png
You do not have the required permissions to view the files attached to this post.
User avatar
balala
Rainmeter Sage
Posts: 8871
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Border around a meter

balala » September 27th, 2017, 6:02 pm

jsmorley wrote:Someone on IRC asked how to put a border on a meter...
I think if the SolidColor of the String meter is opaque, something similar could be created even without using a Shape meter:

Code: Select all

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

[Variables]
BorderWidth=3
BorderColor=150,150,150,255

[MeterBorder]
Meter=Image
SolidColor=#BorderColor#
X=0
Y=0
W=(2*#BorderWidth#+[MeterText:W])
H=(2*#BorderWidth#+[MeterText:H])
DynamicVariables=1

[MeterText]
Meter=String
X=#BorderWidth#
Y=#BorderWidth#
FontSize=20
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Hello World
However, the Shape meter has the great advantage that even a rounded border can be applied, which can't be with an Image meter:

Code: Select all

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

[Variables]
BorderWidth=3
BorderColor=150,150,150,255

;[MeterBorder]
;Meter=Image
;SolidColor=#BorderColor#
;X=0
;Y=0
;W=(2*#BorderWidth#+[MeterText:W])
;H=(2*#BorderWidth#+[MeterText:H])
;DynamicVariables=1

[MeterText]
Meter=String
X=#BorderWidth#
Y=#BorderWidth#
FontSize=20
FontWeight=400
FontColor=255,255,255,255
SolidColor=47,47,47,255
Padding=5,5,5,5
AntiAlias=1
Text=Hello World

[MeterBorder]
Meter=Shape
Shape=Rectangle #BorderWidth#, #BorderWidth#, [MeterText:W], [MeterText:H], 5 | Fill Color 0,0,0,0 | StrokeWidth #BorderWidth# | Stroke Color #BorderColor#
DynamicVariables=1
User avatar
dvo
Posts: 632
Joined: February 7th, 2016, 6:08 am

Re: Border around a meter

dvo » September 27th, 2017, 7:15 pm

uhm fake rounded fill :D it's rectangle instead :?

Code: Select all

 [MeterText:H], 5 << make for the fun 15 or 20
and you will see it ...
User avatar
eclectic-tech
Rainmeter Sage
Posts: 3575
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Border around a meter

eclectic-tech » September 27th, 2017, 7:34 pm

DVO makes a point that string meters are always RECTANGULAR, so if you wanted a rounded corner border, the posted code would show the rectangular background of the string meter.
badworld.png
Let the shape meter provide any fill color and place that meter before the string meter, so it is drawn behind the text. Here's alternate code that allows rounded corners...

Code: Select all

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

[Variables]
BorderWidth=3
BorderColor=150,150,150,255
BorderCornerRadius=12

[MeterBorder]
Meter=Shape
Shape=Rectangle #BorderWidth#, #BorderWidth#, [MeterText:W], [MeterText:H],#BorderCornerRadius# | Fill Color 47,47,47,255 | StrokeWidth #BorderWidth# | Stroke Color #BorderColor#
DynamicVariables=1

[MeterText]
Meter=String
X=#BorderWidth#
Y=#BorderWidth#
FontSize=20
FontWeight=400
FontColor=255,255,255,255
SolidColor=0,0,0,1
Padding=8,8,8,8
AntiAlias=1
Text=Hello World

goodworld.png
You do not have the required permissions to view the files attached to this post.
User avatar
dvo
Posts: 632
Joined: February 7th, 2016, 6:08 am

Re: Border around a meter

dvo » September 27th, 2017, 7:39 pm

played with it and this works for it :welcome: cleaned up version

Code: Select all

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

[Variables]
BorderWidth=2

[MeterBorder]
Meter=Shape
Shape=Rectangle #BorderWidth#, #BorderWidth#, [MeterText:W], [MeterText:H], 15 |  Fill Color 150,100,150,50 | Stroke Color 255,255,255
DynamicVariables=1

[MeterText]
Meter=String
X=#BorderWidth#
Y=#BorderWidth#
FontSize=12
FontWeight=400
FontColor=255,255,255,255
Padding=25,10,25,10
AntiAlias=1
Text=Hello World