如何在 Xamarin.Forms 中允许 iOS 状态栏和 iPhone X 缺口

Question

我对此很陌生，如果这是一个愚蠢的问题，我深表歉意。如何让我的 Xamarin.Forms 应用程序在状态栏或缺口下方启动（如果适用）？我试过使用 NavigationPage，但它开始磨损到屏幕顶部以下。我也看到了一些其他的解决方案，但我无法让它发挥作用。有人可以帮忙吗？

谢谢！

Answer 1

使用UseSafeArea

using Xamarin.Forms.PlatformConfiguration.iOSSpecific;
using Xamarin.Forms;

namespace iPhoneX 
{
    public partial class ItemsPage : ContentPage
    {
        public ItemsPage()
        {
            InitializeComponent();

            On<Xamarin.Forms.PlatformConfiguration.iOS>().SetUseSafeArea(true);
        }
    }
}

Answer 2

is it possible to make one thing on the screen expand all the way to the edges?

（来自答案）

将元素拉伸出安全区域的边界可以说是您提供的案例中的一个用例。该栏只是一个背景元素，而不是内容，就像导航栏一样，它也会伸展以填满整个屏幕。

话虽如此，很遗憾，您无法免费获得此功能，而是必须自己实施。假设您有以下 XAML

<ContentPage ...>
    <StackLayout>
        <ContentView BackgroundColor="LightSkyBlue" HorizontalOptions="Fill" x:Name="Header">
            <!-- Header -->
        </ContentView>
        <ContentView x:Name="Content">
            <!-- Content -->
        </ContentView>
    </StackLayout>
</ContentPage>

在您的代码隐藏中（我不会像这样使用它，但为了说明这一点就足够了。对于实际的应用程序，我编写了一个实用程序 class，它附加到视图并管理插图。）您现在可以检查属性 SafeAreaInsets 是否已更改

class SafeAreaPage : ContentPage
{
    // elided constructor

    protected override void OnPropertyChanged(string propertyName)
    {
        if(propertyName = "SafeAreaInsets")
        {
            var insets = On<Xamarin.Forms.PlatformConfiguration.iOS>.GetSafeAreaInsets();

            var headerInsets = insets; // Thickness is a value type
            headerInsets.Bottom = 0;

            var contentInsets = insets;
            contentInsets.Top = 0;

            Header.Padding = headerInsets;
            Content.Padding = contentInsets;
        }
    }
}

如何设置视图的 Paddings 取决于您的布局，但通过这种方式您可以更好地控制安全区域插图的使用方式，尽管它有点繁琐。

Answer 3

您需要考虑安全区域，但将背景色扩展到全屏。所以你不应该使用

On<Xamarin.Forms.PlatformConfiguration.iOS>().SetUseSafeArea(true);

这将使您的页面在底部和顶部边缘有较大的空白区域。

相反，您应该测量安全区域并将其作为填充应用到您的根视图。

[assembly: ResolutionGroupName("Enterprise")]
[assembly: ExportEffect(typeof(SafeAreaPaddingEffect), nameof(SafeAreaPaddingEffect))]
namespace Enterprise.iOS.Effects
{
    class SafeAreaPaddingEffect : PlatformEffect
    {
        Thickness _padding;
        protected override void OnAttached()
        {
            if (Element is Layout element)
            {
                if (UIDevice.CurrentDevice.CheckSystemVersion(11, 0))
                {
                    _padding = element.Padding;
                    var insets = UIApplication.SharedApplication.Windows[0].SafeAreaInsets; // Can't use KeyWindow this early
                    if (insets.Top > 0) // We have a notch
                    {
                        element.Padding = new Thickness(_padding.Left + insets.Left, _padding.Top + insets.Top, _padding.Right + insets.Right, _padding.Bottom);
                        return;
                    }
                }
                // Uses a default Padding of 20. Could use an property to modify if you wanted.
                element.Padding = new Thickness(_padding.Left, _padding.Top + 20, _padding.Right, _padding.Bottom);
            }
        }

        protected override void OnDetached()
        {
            if (Element is Layout element)
            {
                element.Padding = _padding;
            }
        }
    }
}

然后在 xaml:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"                 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             x:Class="Enterprise.View.Features.Authentication.LoginView"                 
             xmlns:effect="clr-namespace:Enterprise.View.Effects">        
    <Grid>                      
        <Grid.RowDefinitions>               
            <RowDefinition Height="100"/>                
            <RowDefinition Height="*" />            
        </Grid.RowDefinitions>            
        <ContentView BackgroundColor="Green">                
            <ContentView.Effects>                    
                <effect:SafeAreaPaddingEffect />                
            </ContentView.Effects>                
            <Label Text="Hello, from XamarinHelp.com" />            
        </ContentView>                    
    </Grid>
</ContentPage>

ref: https://xamarinhelp.com/safeareainsets-xamarin-forms-ios/ 感谢 Adam，不是我！

如何在 Xamarin.Forms 中允许 iOS 状态栏和 iPhone X 缺口

How to allow for iOS status bar and iPhone X notch in Xamarin.Forms

xamarin.ios

xamarin.forms

iphone-x