ProgressBlock

ProgressBlock

This block is used provide a progress bar that tracks the value of the value hint (if one exists). For information on how to send the value hint, see #Sending Progress Data

Required Properties

Name	Type	Description	Example
padding	Padding	Padding around the block, which is applied before hooking.	padding: Padding(left: 7.0, right: 7.0, top: 7.0, bottom: 7.0
border_width	float	The width in pixels of the border around the progress bar.	border_width: 3.0
border_rounding	float	Rounding of the border, where 0.0 is no rounding and higher values are progressively more rounded.	border_rounding: 3.0
fill_rounding	float	Rounding of the fill, where 0.0 is no rounding and higher values are progressively more rounded.	fill_rounding: 3.0
border_color	Color	Border color.	color: Color(hex: "#ebdbb2")
background_color	Color	Background color, or the secondary progress bar color.	background_color: Color(hex: "#282828")
fill_color	Color	Fill color, or the primary progress bar color.	background_color: Color(hex: "#282828")
width	float	The width of the progress bar (border included). A negative width specifies that width should match that of the parent block (padding included).	width: 100.0 width: -1.0
height	float	The height of the progress bar (border included). A negative height specifies that height should match that of the parent block (padding included).	height: 30.0 height: -1.0

Optional Properties

Name	Type	Description	Example
border_color_hovered	Color	The border color that should be used while the mouse is hovered over this block. Default: use border_color	border_color_hovered: Color(hex: "#fbf1c7")
background_color_hovered	Color	The background color that should be used while the mouse is hovered over this block. Default: use background_color	background_color_hovered: Color(hex: "#3c3836")
fill_color_hovered	Color	The fill color that should be used while the mouse is hovered over this block. Default: use fill_color	fill_color_hovered: Color(hex: "#fbf1c7")

Additional Information

Sending Progress Data

This block works by reading the the value hint, which you can send like the following:

notify-send -h int:value:<progress> "Working..." "I'm working on something."

Where is an integer from 0-100.

More information: https://github.com/Toqozz/wired-notify/issues/4

Padding With Negative width/height Values

When using the "match parent" sizing (setting width or height to a negative value), padding will apply subtractively rather than additively. This is a bit counter intuitive, but the design intent is that the parent block you're matching probably has padding applied as well, and without this behavior matching the parent sizing wouldn't be very helpful.

Rounding + Border Behavior

When trying to do "perfectly" rounded corners (i.e. when rounding == <width or height>/2), take note to take into account the border width when specifying fill_rounding.

For example, in the following config, if we do not account for border_width and just specify a fill_rounding that is the same as the border rounding, we'll get a result with artifacts:

params: ProgressBlock((
    padding: Padding(left: 3.0, right: 3.0, top: 3.0, bottom: 3.0),
    border_width: 10.0,
    border_rounding: 50.0,
    fill_rounding: 50.0,
    border_color: Color(hex: "#ebdbb2"),
    background_color: Color(hex: "#ff0000"),
    fill_color: Color(hex: "#00ff00"),
    width: -1.0,
    height: 100.0,
    border_color_hovered: Color(hex: "#fbf1c7"),
    background_color_hovered: Color(hex: "#3c3836"),
    fill_color_hovered: Color(hex: "#fbf1c7"),
)),

This happens because, essentially, our Cairo code gets confused about where to put the curve when it doesn't fit. This behavior is considered undefined, and I don't intend on fixing it.

To solve this, we just need to take into account the border width with our fill rounding; fill_rounding = border_rounding - border_width:

params: ProgressBlock((
...
    border_width: 10.0,
    border_rounding: 50.0,
    fill_rounding: 40.0,
...
)),