如何显示WebView2内容不闪烁？

Question

在我的UWP项目中，一个页面包含多个子页面。一个子页面有一个 WebView2（来自 Microsoft.UI.Xaml.Controls）。我需要用它来打开一些链接，例如www.bing.com，仅限一次。当导航到完成的网页时，我需要切换到其他子页面然后再返回。

我发现WebView2的内容会闪烁：从黑色到网页内容。闪烁问题是由WebView2的可见性变化引起的。

下面是我的代码，有什么建议吗？

用户界面：

<Page
    x:Class="WebView2FlickerDemo.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WebView2FlickerDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    xmlns:controls="using:Microsoft.UI.Xaml.Controls"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
        <Button Click="Button_Click" Width="200" Height="100"></Button>

        <controls:WebView2 x:Name="WebView2" Height="567.55" Width="792" Margin="200 150 0 0" Visibility="Visible"/>
        <Grid x:Name="myGrid" Background="Blue" Height="567.55" Width="792" Margin="200 150 0 0" Visibility="Collapsed"></Grid>
    </Grid>
</Page>

C#：

public MainPage()
{
    this.InitializeComponent();
    StartWebView2();
}

private async void StartWebView2()
{
    try
    {
        await WebView2.EnsureCoreWebView2Async();
        WebView2.CoreWebView2.Navigate("https:///www.bing.com");
    }
    catch (Exception ex)
    {
    }
}

private void Button_Click(object sender, RoutedEventArgs e)
{
    if (WebView2.Visibility == Visibility.Visible)
    {
        WebView2.Visibility = Visibility.Collapsed;
        myGrid.Visibility = Visibility.Visible;
    }
    else if (WebView2.Visibility == Visibility.Collapsed)
    {
        WebView2.Visibility = Visibility.Visible;
        myGrid.Visibility = Visibility.Collapsed;
    }
}

Answer 1

我可以重现相同的行为。由于我不知道你的具体场景，根据目前提供的代码，如果你不想要当前的闪烁行为，建议删除

WebView2.Visibility

部分，并使用

myGrid

覆盖 webview2。

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        if (myGrid.Visibility == Visibility.Visible)
        {
            // WebView2.Visibility = Visibility.Collapsed;

            //WebView2.Opacity = 1;
            myGrid.Visibility = Visibility.Collapsed;
        }
        else if (myGrid.Visibility == Visibility.Collapsed)
        {
            //WebView2.Visibility = Visibility.Visible;

            //WebView2.Opacity = 0;
            myGrid.Visibility = Visibility.Visible;
        }
    }