The flickering issue occurs due to a mismatch in the ActualOffset of the control in UWP when arranging the element.

[SathiyathanamSathish]

Describe the bug

We have organized our control based on the calculation of the desired size of the element. When we scroll in our control using the mouse, we subtract the scrolled pixels from the rectangle and rearrange the elements based on the updated rectangle. This allows us to hide the control. However, when we decrease the rectangle by 5 (scrolledPixels), we encounter some inconsistent results with the ActualOffset. If we further decrease the rectangle by another value (scrolledPixels), we obtain the correct ActualOffset. Because of this discrepancy in ActualOffset, we are experiencing flickering issues on our end.

Note: We have received the correct ActualOffset when the system resolution is set to 100, but the above problem occurs when the resolution is set to 125, 150, or 175.

Can you suggest a solution to obtain the exact ActualOffset when arranging the elements in all system resolutions?

Steps to reproduce the bug

Run the sample in 150 system resolution.
And add the breakpoint in ArrangeOverride method of ScrollableContentViewer.
In that method we have reduce 5 pixels from the final rectangle. Then we called the Element.Arrange(finalRect).

Observed Behavior
We received the Actual Offset as -4.66667

Expected Behavior:
The ActualOffset is should be -5

Sample:
FlickeringDemo.zip

Expected behavior

Should return the correct ActualOffset for all system resolution

Screenshots

In 150 System Resolution

In 100 System Resolution

NuGet package version

None

Windows version

Windows 11 (22H2): Build 22621

Additional context

No response

[SathiyathanamSathish]

Hi Team, - Any update on this?.

[codendone]

The behavior you describe sounds like layout rounding. If you set UseLayoutRounding="false" on the elements involved, do you then see the values you're expecting?

Layout rounding is frequently important to ensure rendering is sharp, so turning it off is generally not recommended.

[SathiyathanamSathish]

@codendone - We have checked the suggested approach of setting UseLayoutRounding to true from our end. Even then, we are getting the same differences in the ActualOffset values.

Can you confirm why these value differences do not occur in a 100% system resolution, but occur in 125% and 150% system resolutions? Please provide the correct solution to address this issue.

[codendone]

@SathiyathanamSathish You need to set UseLayoutRounding to false to turn off layout rounding. When layout rounding is on, it will adjust the values based on the system scale factor to align the elements to pixel bounds (to avoid blurring them across partial pixels).

[SathiyathanamSathish]

@codendone - Thank you for the update. The solution is working in the attached sample, but our application is still experiencing issues with values even after setting the UseLayoutRounding to false.