LinearGradientBrush as background page has an issue on IOS screen rotation

[TheSundayDev]

Description

If you apply a LinearGradientBrush to the background of the page it works till you rotate the screen. If you rotate the screen the background is not applied to the full page but just half ( the remain part is white).
This happens just on IOS.

Steps to Reproduce

1. Create a new .NET MAUI app
2. Set page Background with LinearGradientBrush as
   <ContentPage.Background> <LinearGradientBrush EndPoint="0,1"> <GradientStop Color="Yellow" Offset="0.0"/> <GradientStop Color="Orange" Offset="0.5"/> <GradientStop Color="Red" Offset="1.0"/> </LinearGradientBrush> </ContentPage.Background>
3. Run the app and then rotate the screen.

Link to public reproduction project repository

No response

Version with bug

8.0.40 SR5

Is this a regression from previous behavior?

Not sure, did not test other versions

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]

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:

• Can't use LinearGradientBrush as Button Background on iOS (#20218), similarity score: 0.79

Closed similar issues:

• [regression/7.0.49] LinearGradientBrush not working on Android in Landscape orientation (#16392), similarity score: 0.82
• ContentPage.Background (with LinearGradientBrush) not working for iOS (#16537), similarity score: 0.82
• Inconsitent LinearGradientBrush between Android and iOS (#9772), similarity score: 0.80
• Gradient not appearing on iOS (#8402), similarity score: 0.80

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

[BernhardPollerspoeck]

since this issue seems to have 0 priority right now, here a workaround that did the trick for me:

protected override void OnSizeAllocated(double width, double height)
{
base.OnSizeAllocated(width, height);
var tmp = this.Background;
this.Background = Application.Current!.Resources["L0Color"] as SolidColorBrush;
this.Dispatcher.StartTimer(TimeSpan.FromMilliseconds(1), () =>
{
this.Background = tmp;
return false;
});

[TheSundayDev]

Hi, thanks for this.
I hope to see it fixed asap... fingers crossed ;)

[iSeeLittleMore]

For me helps use backgound not in ContentPage but in main layout. For example:

<?xml version="1.0" encoding="utf-8"?>

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             Title="{Binding Title}"
             Shell.NavBarIsVisible="True"
             Shell.TabBarIsVisible="False"
             BindingContext="{Binding Source={RelativeSource Self}, Path=DefaultViewModel}"
             x:Class="ManagerHelper.Views.RegistrationsPage">
    <ContentPage.Background>
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
            <GradientStop Color="#aaf1fa" Offset="0.0" />
            <GradientStop Color="#e3aafa" Offset="1.0" />
        </LinearGradientBrush>
    </ContentPage.Background>
    <ContentPage.Content>
        <Grid>
            <Grid.Background>
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                    <GradientStop Color="#aaf1fa" Offset="0.0" />
                    <GradientStop Color="#e3aafa" Offset="1.0" />
                </LinearGradientBrush>
            </Grid.Background>
        </Grid>
    </ContentPage.Content>
</ContentPage>

Problem
<ContentPage.Background>




</ContentPage.Background>

No problem

        <Grid.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                <GradientStop Color="#aaf1fa" Offset="0.0" />
                <GradientStop Color="#e3aafa" Offset="1.0" />
            </LinearGradientBrush>
        </Grid.Background>    

[rodolfo-sousa]

Want to contribute to this problem.

1. I have the same issue in iOS, the workaround a used was to force a change in AppTheme since my LinearGradient is different between themes:

AppTheme myTheme = App.Current!.UserAppTheme;
if (myTheme == AppTheme.Light)
   App.Current!.UserAppTheme = AppTheme.Dark;
else
   App.Current!.UserAppTheme = AppTheme.Light;
App.Current!.UserAppTheme = myTheme;

2. I want to take the opportunity that shadows in borders are not update correctly when screen rotation;
3. When screen rotation i notice in iOS we are loosing SafeAreas on top. The workaround for this was to have on Page:

<ContentPage.Behaviors>
    <toolkit:StatusBarBehavior  StatusBarColor="..." StatusBarStyle=".." />
</ContentPage.Behaviors>

4. On my rotation, I'm using visual states VisualStateManager.GoToState(control, "Portrait/Landscape"); on SizeChanged event;