Border on iOS redraws with 1 frame lag, creating lag before drawn 1 frame after other elements

[jonmdev]

Description

As was discussed here there was a problem where borders are being drawn with square elements or wrong colors on their first frames:

https://github.com/dotnet/maui/issues/23070

I am unable to text the fix as I was told to use 8.0.80-ci.net8.24367.6, but this does not work (Gives me a bunch of errors and won't build.). ie.

<ItemGroup>
    <PackageReference Include="Microsoft.Maui.Controls" Version="8.0.80-ci.net8.24367.6" />
    <PackageReference Include="Microsoft.Maui.Controls.Compatibility" Version="8.0.80-ci.net8.24367.6" />
    <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="8.0.0" />
</ItemGroup>

In any case, one can see from the "fix" that a lag persists. This is most visible with the black Hello where we see it appear one frame before the Border behind it:

Any final fix would be appreciated @albyrock87

Steps to Reproduce

No response

Link to public reproduction project repository

No response

Version with bug

8.0.70 SR7

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

Unknown/Other

Affected platforms

iOS

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

No response

[github-actions[bot]]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

• Border has an unexpected background animation (#21643), similarity score: 0.81

Closed similar issues:

• Border on iOS redraws with 1 frame lag, creating flashes of (1) square corners on redraws, and (2) old background color before new color update (#23070), similarity score: 0.85
• Drawing of Borders lags behind other elements on iOS creating bizarre overlaps and glitches (okay in Windows/Android) (#18204), similarity score: 0.83
• Border size changes appear to be animated on iOS/MacCatalyst (#15363), similarity score: 0.81
• iOS Border crops/masks underlying elements wrong with clearly abnormal visual effect (iOS only) - repro project included (#17998), similarity score: 0.81

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[Zhanglirong-Winnie]

This issue has been verified using Visual Studio 17.11.0 Preview 4.0(8.0.70&8.0.80-ci.net8.24367.6). Can repro on iOS platform.

[thisisthekap]

@albyrock87 @jonmdev Are there any news on how to do a workaround or a fix?

[albyrock87]

@thisisthekap I spent a good amount of time trying to fix this, and it appears it's very hard to fix as probably there is a huge problem with the rendering workflow.

[thisisthekap]

@dalexsoto Anything you might be able to help with?

[albyrock87]

May you all verify if my PR now fixes everything and doesn't produce additional glitches on your applications? Packages here: https://dev.azure.com/xamarin/6fd3d886-57a5-4e31-8db7-52a1b47c07a8/_apis/build/builds/122164/artifacts?artifactName=nuget&api-version=7.1&%24format=zip

https://youtu.be/B2FOBjZKm9k?si=HzduJaMZihyeMp4V

[albilaga]

@albyrock87 this is working now. Great works. Thank you. Is it possible to include it just in handler? or we do need custom maui build?

[albyrock87]

@albilaga it is not possible unfortunately, but it is probably going to be included in the next SR.

To temporary fix the animation only (not the 1 frame lag) you can override the arrange method of the handler and wrap the base method execution into a CATransaction with animation length set to 0.

[PureWeen]

Duplicate of #21643