It is currently February 19th, 2020, 11:49 am

Border around a meter

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

Border around a meter

Post by jsmorley »

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: 9711
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Border around a meter

Post by balala »

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
dvo
Posts: 657
Joined: February 7th, 2016, 6:08 am

Re: Border around a meter

Post by dvo »

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: 3759
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Border around a meter

Post by eclectic-tech »

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.
dvo
Posts: 657
Joined: February 7th, 2016, 6:08 am

Re: Border around a meter

Post by dvo »

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