This widget use a lot of parameters but only 3 parameters are mandatory, others are optional. If they are missing, default values are used.
Link to download on deviantArt : here
As usual, settings are made through tables :
rings_settings={
{table_setting for ring1},
{table_setting for ring2},
{table_setting for ring3},
}
The 3 mandatory parameters are
name
, arg
and max
.In a conky, you write:
${cpu cpu1}
, In the script, you will write :rings_settings={
{
name="cpu",
arg="cpu1",
max=100,
--(max is set to 100 because maximum value of $cpu is 100% but you can set it to 50% if you want)
}
}
This simple table will draw this kind of circle in the center of the conky window (the radius will be a quarter of the conky's window width):

Defaults colours used in the script have to be used with a dark background.
You can set the colour of the conky window with
own_window_colour 000000
own_window_transparent no
Position and appearance can be changed with
xc
, yc
, thickness
and radius
.{
name="cpu",
arg="cpu0",
max=100,
xc=100,
yc=100,
thickness=20,
radius=60
},

Number of sectors is set with
sectors
.{
name="time",
arg="%S",
max=60,
sectors=50,
radius=90
},

If you look at the first circle above, you will see a gap at the top of the ring, it's because the script draw only sectors, and the parameter
gap_sectors
is set to 1 by default. So the gap_sectors
parameter set the space in pixels between two sectors :{
name="time",
arg="%S",
max=60,
sectors=5,
thickness=20,
radius=75,
gap_sectors=5
},

There is two way to close a sector, this is done with the
cap
parameter.cap="p"
for parallel (default value)cap="r"
for radialSee picture :
{
name="time",
arg="%S",
max=60,
sectors=5,
thickness=30,
radius=75,
xc=500,
yc=85,
gap_sectors=15,
cap="r"
},

Another way to change the shape of a ring is to change the angles with
start_angle
and end_angle
.Values are in degrees and default values are :
start_angle=0
end_angle=360
end_angle
has to be greater than start_angle
but both can be negatives{
name="time",
arg="%S",
max=60,
sectors=6,
thickness=30,
radius=75,
xc=500,
yc=85,
start_angle=45,
end_angle=315
},

Of course, arcs can be inversed with
inverse_arc
parameter (default value is false).If
inverse_arc=true
arc will be anticlockwise.{
name="time",
arg="%S",
max=60,
sectors=12,
thickness=30,
radius=75,
xc=500,
yc=85,
gap_sectors=10,
inverse_arc=true
},

Another parameter used to change the shape is the
border_size
parameter. Default is set to zero (i.e. "no border").{
name="time",
arg="%S",
max=60,
sectors=6,
thickness=30,
radius=75,
xc=500,
yc=85,
gap_sectors=10,
border_size=5
},

Next paramater is
fill_sector
, default value is false
.If set to
true
, each sector will be completely filled (like in the next picture)Of course, this parameter is inoperate with
sectors=1
{
name="time",
arg="%S",
max=60,
sectors=12,
thickness=30,
radius=75,
xc=300,
yc=85,
gap_sectors=10,
fill_sector=true,
},

I forgot these two parameters
background
and foreground
which can be useful sometimes. If set to false
, background or foreground are not drawn.{
name="time",
arg="%S",
max=60,
sectors=6,
thickness=30,
radius=75,
xc=300,
yc=85,
gap_sectors=10,
border_size=2,
background=false
},

Well, I think I didn't forgot anything. I think I will add more parameters in the future...
Now, I will explain the colours parameters.
Each colours for background, foreground and border are set in theses parameters :
bg_colour1
, fg_colour1
and bd_colour1
For example, for a single colour table:
bg_colour1={{0,0x0000ff,1}}
for a 2-colours table :
bg_colour1={
{0,0x0000ff,1},
{1,0xff00ff,1}
}
for a 3-colours table:
bg_colour1={
{0,0x0000ff,1},
{0.5,0xff00ff,1},
{1,0xff00ff,1}
}
and so on ...
Each "table colour" above contains one or more tables which defines the colours of a gradient :
table={P,C,A}
P = position inside the gradient (0 = internal radius, 1= external radius)
C = hexadecimal colour
A = alpha (opacity) of colour (0=invisible,1=opacity 100%)

With 5 colours for background and 3 colours for foreground :
{
name="time",
arg="%S",
max=60,
sectors=10,
thickness=40,
radius=75,
xc=500,
yc=85,
gap_sectors=5,
bg_colour1={{0,0xFF6600,0.5},{0.25,0xFFFF00,1},{0.5,0xdddddd,1},{0.75,0X99CCFF,1},{1,0X0000FF,0.5}},
fg_colour1={{0,0xFF6600,0.5},{0.5,0xFF0000,1},{1,0x0000FF,0.5}},
},

Another example :
{
name="time",
arg="%S",
max=60,
sectors=10,
thickness=40,
radius=75,
xc=500,
yc=85,
end_angle=270,
gap_sectors=5,
fg_colour1={{0,0xFFff00,0.8},{0.5,0xFF0000,0.8},{1,0xffff00,0.8}},
bd_colour1={{0,0xFF0000,0.8},{0.5,0xFFff00,0.8},{1,0xff0000,0.8}},
background=false,
border_size=2,
},

With the previous setup, each sectors have the same color.
But, for each colour (background, foreground and border), a gradient can be created with
fg_colour2
, bg_colour2
and bd_colour2
parameters.This is the most interesting part of this script, if we have two colours
fg_colour1={{P1,colour1,alpha1}}
fg_colour2={{P2,0xcolour2,alpha2}}
For each sector a colour will be calculated with the "gradient" from
P1
to P2
, for each red, green and blue composantes from colour1
to colour2
and from alpha1
to alpha2
.Some examples in picture for a better understanding 8-)
Two tables with same colours and same alpha but with P1 and P2 differents : this has no effects because colours and alpha are the same.

Two differents colours with same alpha:

Two colours, same colours and differents alpha :

Two colours, differents colours and differents alpha :

Now, just start a new rings with 2 colours (a 2-colours table):

If I change the first parameter of the yellow colour which is the starting position of the gradient, we got that :

Adding a second 2-colours table
bg_colour2
with the same bluebg_colour1={{0,0xffff00,1},{1,0xff0000,1}},
bg_colour2={{0,0x0000ff,1},{1,0x0000ff,1}},

and with a 2-colours table with two differents colours
bg_colour1={{0,0xffff00,1},{1,0xff0000,1}},
bg_colour2={{0,0x0000ff,1},{1,0x00ffff,1}},

With 3 colours :
bg_colour1={{0,0x0000ff,1},{0.5,0xffffff,1},{1,0xff0000,1}},
bg_colour2={{0,0xff0000,1},{0.5,0xffffff,1},{1,0x0000ff,1}},

Tweaking with alpha parameters :
bg_colour1={{0,0x000000,0},{0.5,0xffffff,1},{1,0x000000,0}},
bg_colour2={{0,0xff0000,1},{0.5,0xffffff,1},{1,0xff0000,1}},

Playing with alpha parameters and position parameters :
bg_colour1={{0,0x000000,0},{0.5,0xffffff,1},{1,0x000000,0}},
bg_colour2={{0.49,0xff0000,1},{0.5,0xffffff,1},{0.51,0xff0000,1}},

or this one :
bg_colour1={{0.49,0xffffff,0},{0.5,0xffffff,1},{0.51,0xffffff,0}},
bg_colour2={{0,0xffffff,0},{0.5,0xffffff,1},{1,0xffffff,0}},

As you can see, tweaking with colours, positions and alpha parameters are endless !
Two of my favorites rings :
This one to display CPU temperature and fan speed :
{
name="exec",
arg="sensors | grep 'CPU Temp' | cut -c15-16",
max=60,
xc=100,
yc=100,
radius=90,
thickness=20,
start_angle=-120,
end_angle=120,
sectors=20,
bg_colour1={{0,0x999999,0},{0.5,0x999999,1}, {1,0x999999,0}},
fg_colour1={{0,0XffFF00,0},{0.5,0xffFF00,1}, {1,0xffFF00,0}},
fg_colour2={{0,0XFF0000,0},{0.5,0xFF0000,1}, {1,0xFF0000,0}},
},
{
name="exec",
arg="sensors | grep 'CPU Fan' | cut -c12-16",
max=1500,
xc=100,
yc=100,
radius=70,
thickness=20,
start_angle=-120,
end_angle=120,
sectors=20,
bg_colour1={{0,0x999999,0},{0.5,0x999999,1}, {1,0x999999,0}},
fg_colour1={{0,0XFFFF00,0},{0.5,0xFFFF00,1}, {1,0xFFFF00,0}},
fg_colour2={{0,0XFF0000,0},{0.5,0xFF0000,1}, {1,0xFF0000,0}},
bd_colour1={{0,0X00FF00,1},{0.5,0x00FF00,1}, {1,0x00FF00,1}},
},

With a text widget :

And this one, made of two vertical rings of 180 degrees. Each ring has colours inverted.
{
name="fs_used_perc",
arg="/home",
max=50,
xc=350,
yc=150,
radius=90,
thickness=30,
start_angle=0,
end_angle=180,
inverse_arc=false,
border_size=0,
sectors=50,
gap_sectors=-1,
fill_sector=true,
bg_colour1={{0,0X111111,1},{0.5,0x111111,1}, {1,0x888888,1}},
bg_colour2={{0,0X888888,1},{0.5,0x888888,1}, {1,0x111111,1}},
fg_colour1={{0,0XFF4500,1},{0.5,0xFF4500,1}, {1,0xFFFFFF,1}},
fg_colour2={{0,0XFFFFFF,1},{0.5,0xFFFFFF,1}, {1,0xFF4500,1}},
bd_colour1={{0,0X00FF00,1},{0.5,0x00FF00,1}, {1,0x00FF00,1}},
},
{
name="",
arg=conky_parse("${fs_used_perc /home}")-50,
max=50,
xc=350,
yc=150,
radius=90,
thickness=30,
start_angle=180,
end_angle=360,
sectors=50,
gap_sectors=-1,
fill_sector=true,
bg_colour2={{0,0X111111,1},{0.5,0x111111,1}, {1,0x888888,1}},
bg_colour1={{0,0X999999,1},{0.5,0x888888,1}, {1,0x111111,1}},
fg_colour2={{0,0XFF4500,1},{0.5,0xFF4500,1}, {1,0xFFFFFF,1}},
fg_colour1={{0,0XFFFFFF,1},{0.5,0xFFFFFF,1}, {1,0xFF4500,1}},
bd_colour1={{0,0X00FF00,1},{0.5,0x00FF00,1}, {1,0x00FF00,1}},
},
Note the use of conky_parse in the second ring. This ring has to start at 50 but the script doesn't have the
min
parameter, so I have to "translate" the starting point at 50 and set the max
to 100-50=50.And I use
gap_sectors=-1
to draw a plain circle.In this picture, left ring is for a zero-value,

The same with the default value for
gap_sectors
, gap_sectors=1

That's all for the moment !
Edit :
The widget in real use :

A palette of differents rings :
