c# - 滚动IOS时透明状态栏显示webview内容

Question

我已经放置了一个 webview，Anroid 工作正常，但在 IOS 上，当我滚动时，我看到内容在透明状态栏后面滚动。 Click and see the top left corner of the image

我尝试使用 safari 相关的 css 添加边距和填充，但它不起作用

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        var browser = new WebView();
        browser.Source = "https://xxxxxxxxxxxxxxxx.net/";
        Content = browser;
    }
}

我希望状态栏变得不透明，并且滚动内容不会显示在状态栏后面。

Answer 1

此原因是由于 IOS 设备中的安全区域造成的。引用Safe Area Layout Guide on iOS ，您可以在 Xamarin Forms 中将安全区域设置为 true:

<ContentPage ...
             xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
             Title="Safe Area"
             ios:Page.UseSafeArea="true">
    <StackLayout>
        ...
    </StackLayout>
</ContentPage>

我的内容页面如下:

public MainPage()
{
    InitializeComponent();

    var browser = new WebView();
    browser.Source = "https://learn.microsoft.com/en-us/appcenter/test-cloud/starting-a-test-run";
    Content = browser;
}

最终效果: