I’ve Implemented Adaptive Font Coloring + Window Button Scrolling (No More Squashed Window Task Buttons)

I’ve implemented a way for the text on the panel to automatically adjust its font color depending on the background color behind it. This means if the background behind the panel is dark, the text will become light / white and if the background is light / bright then the text color will become dark / black automatically. The adjustment takes place after you set a different wallpaper. This is so that the text is readable.

This is because when I activated acrylic theming, the font color became a real problem.

All acrylic theming does is it applies a background blur effect to the widget so unlike before, the theme does not set a predefined background color (but it does for a text color) in the theme file, it is all dynamic / automatic. This means, the background color is not preset so you can end up with a bright background (which means the panel will also apply a bright background blur) but you have hard coded a white text.

Ok, well, just set the text to a dark color, problem solved right? No. What if you have a dark background, you end up with a dark background blur but you also have a dark text so the text is unreadable.

The solution? Adaptive text color. The theming gets the screen area behind the panel before the panel gets displayed to see if the area is bright or dark and depending on whether it is one or the other, it modifies the CSS file on the fly, only the text color and it applies it so you always end up with contrasting colors.

Take a look below. The text color in each screenshot is not hard coded, it is set dynamically based on whether the area behind the panel is light or dark. Neat! So that’s my solution.

There is also a second solution to this problem. Coat the widget with a semi-transparent background color first, dark or light, then set a hard-coded contrasting font color and then apply the acrylic effect. That would also work. The background blur will be painted over the coated background color. Both will be visible at the same time. I went with the more complicated way because it is dynamic but I think I will make use of the second one also.

So, I’ve been testing it and it seems to work so far like it should.

Next, I implemented window button scrolling. What this does is it lets yous scroll the buttons representing the windows with your wheel button. Previously, they would squash when they don’t fit. I don’t like that so I implemented scrolling.

See below, the first button (the one with the QC on it) is a bit cut off, you just scroll with the wheel button to see the rest of the buttons.

Now, I’d like to apologize for taking me so long to complete all this. I hope you understand that I work all on my own and it is a large project but rest assured that I am almost done as the majority of work has been completed. I’d say, probably about 70-80% of what I had planned has been done and it has not been easy.

To do all this, I have to develop the component first and that takes a lot of time because I have to test it, debug it, test it again, debug it and then integrate it with each part and it just takes a lot of time…

I will provide another update soon and rest assured, Pilot 11 is near. I just hope not to disappoint you with it. I am trying my best.

Leave a Comment

Your email address will not be published. Required fields are marked *