I have a dotnet 8 MAUI IOS app that has a view that records the user. I receently updated the app from dotnet 7 to 8 and now I am having some styling issues on this page. The pause and reset buttons have a grey background at times. The background aren’t always there. It is dependent on which buttons are selected and the state of the view. Initially only reset and pause have the weird background. When you click play it is only reset and when you click stop it is only pause.

This is the area in question:

<Grid IsVisible="{Binding Path=BindingContext.IsControlsVisible, Source={x:Reference mainPage}}">
                    <Image Source="recording.png" ZIndex="1"/>
                    <FlexLayout WidthRequest="210" JustifyContent="SpaceBetween" AlignItems="Center" ZIndex="2">
                        <Button ImageSource="restart.png" BackgroundColor="Transparent" WidthRequest="80"
                                Clicked="ResetButtonClicked"
                                IsEnabled="{Binding Path=BindingContext.IsRestartButtonEnabled, Source={x:Reference mainPage}}"/>
                        <Button ImageSource="stop.png" BackgroundColor="Transparent" WidthRequest="80"
                                IsVisible="{Binding Path=BindingContext.IsStopButtonVisible, Source={x:Reference mainPage}}"
                                Command="{Binding Path=BindingContext.StopCommand, Source={x:Reference mainPage}}"/>
                        <Button ImageSource="start.png" BackgroundColor="Transparent" WidthRequest="80"
                                IsVisible="{Binding Path=BindingContext.IsRecordButtonVisible, Source={x:Reference mainPage}}"
                                Command="{Binding Path=BindingContext.RecordCommand, Source={x:Reference mainPage}}"/>
                        <Button ImageSource="pause.png" BackgroundColor="Transparent" WidthRequest="80"
                                Command="{Binding Path=BindingContext.PauseCommand, Source={x:Reference mainPage}}"
                                IsEnabled="{Binding Path=BindingContext.IsPauseButtonEnabled, Source={x:Reference mainPage}}"/>
                    </FlexLayout>
                    <Label ZIndex="2" Text="{Binding Path=BindingContext.TimerLabel, Source={x:Reference mainPage}}"
                           IsVisible="{Binding Path=BindingContext.IsCountupVisible, Source={x:Reference mainPage}}"
                           TextColor="{StaticResource AppGray}" FontSize="Large"
                           VerticalOptions="Center" HorizontalOptions="Center" Margin="6, 110, 0, 0"/>
                    <Label ZIndex="2" Text="{Binding Path=BindingContext.TimerRemainingLabel, Source={x:Reference mainPage}}"
                           IsVisible="{Binding Path=BindingContext.IsCountdownVisible, Source={x:Reference mainPage}}"
                           TextColor="Red" FontSize="Large"
                           VerticalOptions="Center" HorizontalOptions="Center" Margin="6, 110, 0, 0"/>
                </Grid>

This code is in the view model and handles when the buttons are clicked:

   public ICommand ResetCommand { get; set; }
   public ICommand PauseCommand { get; set; }

...

ResetCommand = new Command(ResetRecording);
PauseCommand = new Command(PauseRecording);

...

 private void PauseRecording()
        {
            if (recordAudioService != null)
            {
                isRecord = false;
                IsPauseButtonEnabled = false;
                IsStopButtonVisible = false;
                IsResumeButtonVisible = true;
                IsRecordButtonVisible = true;
                IsRestartButtonEnabled = true;
                recordAudioService.PauseRecord();
            }
        }

   private void ResetRecording()
        {
            if (IsRecordingAudio && !isRecord)
            {
                recordAudioService.ResetRecord();
                timerValue = new TimeSpan();
                timerRemainingValue = new TimeSpan();
                TimerLabel = string.Format("{0:mm\:ss}", timerValue);
                IsRecordingAudio = false;
                IsPauseButtonEnabled = false;
                IsResumeButtonVisible = false;
                IsStopButtonVisible = false;
                IsRestartButtonEnabled = false;
                CreateTimer();
                questionNumber = 1;
                RecordingStatus = "";
                IsAnswerRecorded = false;
            }
        }

I also recently updated these packages :

        <PackageReference Include="CommunityToolkit.Maui" Version="9.0.3" />
        <PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
        <PackageReference Include="Plugin.Maui.Audio" Version="3.0.0" />
        <PackageReference Include="Microsoft.Maui.Controls" Version="8.0.82" />
        <PackageReference Include="Microsoft.Maui.Controls.Compatibility" Version="8.0.82" />

So maybe one of these has something to do with it?

Here is a picture of the issue in question:

I do not want that grey background around the pause button. That is the same background that shows up around the reset button as well.