Customize position of OSD on screen

[ttzhou]

I can't for the life of me figure this out - is there a way to specify where the notification displays show up on screen? Default appears to be center bottom.

I must be missing something obvious - any help is appreciated!

[jmickelin]

The vertical position can be set with the --top-margin argument to swayosd-server, which takes a value from 0 to 1 indicating the percentage of the screen height to offset it from the top of the screen. Internally, this option uses the wlr layershell protocol to anchor it in a precise location on screen, and updates the position automatically if e.g. the resolution or scaling changes.

For the horizontal position, it's a bit trickier, but possible using CSS. Since there is no corresponding argument, you won't get any of the automatic updates. But it's better than nothing. Here's how to do it in SwayOSD 0.2.0:

* {
    --screen-width: 1920px;
    --screen-scaling: 0.9;
    --window-side-padding: 20px;
    --container-width: 250px;
    --container-margin: 16px;
    --window-edge-offset: 50px;
    --window-width: calc(var(--container-width) + 2*var(--window-side-padding) + 2*var(--container-margin));
    --screen-edge-distance: calc(var(--screen-width) / var(--screen-scaling) - var(--window-width));
}

window#osd {
    margin: 0;
    padding: 12px var(--window-side-padding);
    border-width: 0;
    margin-left: calc(var(--screen-edge-distance) - var(--window-edge-offset));
}

#container {
    min-width: var(--container-width);
    margin: var(--container-margin);
    padding: 0;
    border-width: 0;
} 

Here it's configured for a screen width of 1920px, with scaling set to 0.9, and the window aligned to the right edge of the screen with an offset of 50px. To instead use the left edge of the screen, you only need to change margin-left to margin-right.

I duplicated the properties whose default values are 0 to make it explicit. If you set any of them to a non-zero value, you would also need to take those into account in the --window-width calculation.

Unfortunately GTK4 is very limited in that you can't use percentage lengths in the margin or min-width properties (despite the documentation claiming so), so I had to resort to hard-coding the resolution. There also isn't any width property (only min-width), so this might overflow off the edge of the screen if the contents can't fit in the container.

I'm not exactly sure how to adapt this for multi-monitor setups where the monitors have different resolutions or scaling. For that to work reliably, I think we'd need a new option similar to --top-margin...

(Note that this won't work in SwayOSD 0.1.*, since it uses GTK3, which lacks support for custom --properties and calc(). Even if you precompute the values by hand, the trick with setting margin-left on the window element does not work. If you need to use that version and can't upgrade to 0.2.0, you can get around this by making the window transparent, and moving all the default properties of window into #container, and setting the margin of that.)

[ttzhou]

ty!