console.lua: improve the hovered item calculation with background-box #15711
Conversation
guidocella
force-pushed
the
console-box
branch
from
33afa69 to
7bd0fda
Compare
|
Download the artifacts for this pull request: |
How do you ensure that the "tall characters" are at most 10% larger than normal characters, but not more? |
|
You don't, it's a heuristic. It works with the fonts I tried and can be increased if it doesn't work with some others. |
"Works for me" isn't a good enough justification when it changes the appearance significantly: |
|
Well it was kasper's request to do it like this. I don't use background-box personally. |
|
LGTM |
This should not divide by scale_factor() because osd_w is already scaled pixels. Also add a TODO to fix --osd-margin-x's scaling.
Follow up to c438732 which improved the calculation with the default outline-and-shadow. We can make the calculation accurate for background-box too without making semitransparent rectangle backgrounds overlap by adding margin between items. We could calculate the height of each item to make them perfectly adjacent by rendering each one with compute_bounds, but that takes 15ms per render, so 20 lines would take 300ms, which is too slow. Instead add a fixed 0.1 * opts.font_size to each item's height. This ensures the backgrounds don't overlap with tall CJK text or track circles and --osd-shadow-offset=0. Add this to outline-and-shadow too since it looks better with some margin between the items. Then add the rectangle offset to the height depending on the border style.
guidocella
force-pushed
the
console-box
branch
from
7bd0fda to
dfe0518
Compare
It's is improvement over current status, feel free to come up with better ideas for this problem. @guidocella said that |
It has appearance regression and not 100% improvement.
Here is a bounding box that doesn't require compute_bounds: You already know the total height of the box because you know the number of lines. The width can simply be the whole window width. |
It has appearance regression and not 100% improvement. See, I find separate buttons with separate background just as nice. We could compute bounds of longest string in selections, but it still means that we need to draw custom background and disable the style of default background, but I guess this can be done, wit tags for the events. |
|
This looks fine to me too by making them look like separate buttons and not drawing more background width than necessary for each item. We will also add Computing the longest width is too slow with something like 10k properties. And if you compute the width only of current matches, the background width would change as you scroll. |
Which one has larger appearance change, especially compared to regular console?
It's not nice when they have different width. As I already said no other menus look like this.
I don't see how is this complicated. You draw the selected item background over the whole background. And if you really think rounded corners are important enough here (and not just bringing it up for the sake of argument), you can draw them already, there is no need to wait for libass.
There is no problem if you make the background fixed width, like I originally mentioned. I will end my remark by pointing out that the uosc playlist selection menu uses the drawing methods I mentioned and looks much better than this PR. It additionally calculates the longest item's width, but we don't have to do that and instead keep it a constant width to avoid width calculation. |
I would prefer to not cover whole screen in background-box, just because we are too lazy to calculate the width of it. It will look obnoxious for short menu items. |
console.lua: improve the hovered item calculation with background-box
Follow up to c438732 which improved the calculation with the default outline-and-shadow. We can make the calculation accurate for background-box too without making semitransparent rectangle backgrounds overlap by adding margin between items.
We could calculate the height of each item to make them perfectly adjacent by rendering each one with compute_bounds, but that takes 15ms per render, so 20 lines would take 300ms, which is too slow.
Instead add a fixed 0.1 * opts.font_size to each item's height. This ensures the backgrounds don't overlap with tall CJK text or track circles and --osd-shadow-offset=0. Add this to outline-and-shadow too since it looks better with some margin between the items. Then add the rectangle offset to the height depending on the border style.