On Mon, 2 May 2022 19:53:44 GMT, Alisen Chung <ach...@openjdk.org> wrote:

>> Changed the drawing area to be increased by 0.5 on the left side to prevent 
>> clipping
>
> Alisen Chung has updated the pull request incrementally with one additional 
> commit since the last revision:
> 
>   updated test

I was worried that had missed something when I tested it yesterday and I 
re-built and ran the tests once again. The test still fails for me, more on it 
later.

I commented out disposing of the frame and I see issues with border rendering 
too. The border renders correctly at 150% and 175%. Yet at 200%, some parts of 
the border are rendered as 1-pixel line and some are 2-pixel line. That's the 
problem we're trying to fix.

As for the failing test, I noticed that the saved image is different from what 
I see on the screen especially when the uiScale is different from 1.5 which is 
used in the test. I can't explain it; it could be the result of rendering the 
frame on main thread after it was laid out on the EDT.

I played around with border rendering myself. To get exact lines, I always use 
1-pixel stroke. At first I used two rectangles to render the border. It's 
simple and it gives good enough result, however it leaves some pixels painted 
with background colour.

Then I reimplemented painting to the way browsers render `groove` and `ridge` 
border. ([Try 
it](https://developer.mozilla.org/en-US/docs/web/css/border-style#try_it).) I 
believe, @lukeu mentioned it in one of his comments. The border uiScale=4.0 
looks like this:  
![EtchedBorder rendered at 
400%](https://user-images.githubusercontent.com/70774172/166720386-5a58e4b5-9ec7-43bd-8b34-67861a496361.png)

I pushed the code for it to 
[alisen-8279614-border](https://github.com/aivanov-jdk/jdk/commits/alisen-8279614-border)
 branch. You can get it for testing using these commands:


git fetch https://github.com/aivanov-jdk/jdk alisen-8279614-border
git checkout alisen-8279614-border


You can also [compare my branch to this 
PR](https://github.com/openjdk/jdk/compare/pr/7449...aivanov-jdk:alisen-8279614-border),
 which should give you a quick overview of the differences.

At 150% and 175%, the border looks like this:
![EtchedBorder rendered at 
150%](https://user-images.githubusercontent.com/70774172/166722510-e8fe6839-8820-451e-8434-f07b797edfed.png)
 
![EtchedBorder rendered at 
175%](https://user-images.githubusercontent.com/70774172/166722689-928409f2-c51f-4e4d-a476-b7e50c524f19.png)

The cyan colour is the background colour of the child panel in the test. It 
highlights rounding off to coordinates. The fourth panel in the 175% case lacks 
the yellow highlight on the right; at the same time, there are two cyan pixels. 
The highlight is likely painted outside of the panel clip. It may happen to 
bottom edge too.

When I set `uiScale` to 1.0, the frame is displayed like this initially:
![Rendering bug at 
uiScale=1.0](https://user-images.githubusercontent.com/70774172/166723618-a61e2a0d-c61d-4177-9961-3d6f07670f3e.png)
Weird, isn't it?

After minimizing and restoring the window, it's painted correctly:
![Repainted at 
uiScale=1.0](https://user-images.githubusercontent.com/70774172/166723989-516644f9-9ffc-40f7-bf88-879fd2d8aef2.png)

I can't understand why it happens…

As for the test, I reformatted the code to use 4-space indents, changed the 
colours to stand out (white is too close to the grey background colour).

The still fails with my implementation of border painting. It could be because 
there are some cyan background pixels where the test expects border… I haven't 
looked into it.

The test needs updating. For each panel, it should verify _each edge_ has the 
correct thickness of both shadow and highlight colours. I still think the test 
can be made headless. Paint `content` panel to buffered image rather than the 
frame.

Since we've seen different artefacts with different scales, the test should 
verify rendering at 1.0, 1.25, 1.5, 1.75, 2.0 rather than 1.5 only.

-------------

PR: https://git.openjdk.java.net/jdk/pull/7449

Reply via email to