Xamarin Forms新手求助：如何创建仅占部分屏幕的独立页面？

嘿，作为Xamarin Forms新手，碰到这个需求太正常了！毕竟原生Android的实现思路和Forms里不太一样，我来给你一步步拆解怎么搞定这个「独立的部分屏幕弹窗页面」。

核心思路是自定义页面渲染器——因为Xamarin Forms的默认Page都是全屏的，我们需要在各原生平台上修改页面的渲染行为，让它变成非全屏的独立窗口，同时保持它是一个完全独立的Page（不是嵌套在父布局里的View）。

步骤1：创建共享项目的自定义Page #

首先在你的共享/PCL项目里定义一个自定义Page类，用来标记我们要特殊处理的页面：

public class PartialScreenPage : ContentPage
{
    // 这里可以加自定义属性（比如控制宽高比例），暂时留空也没问题
}

然后你可以在XAML里给这个Page添加自定义内容，比如：

<local:PartialScreenPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:YourAppNamespace"
             x:Class="YourAppNamespace.YourPartialPage">
    <ContentPage.Content>
        <Frame BackgroundColor="White" CornerRadius="10" Padding="20">
            <StackLayout>
                <Label Text="这是我的部分屏幕独立页面！" FontSize="Large"/>
                <Button Text="关闭" Clicked="CloseButton_Clicked"/>
            </StackLayout>
        </Frame>
    </ContentPage.Content>
</local:PartialScreenPage>

步骤2：Android平台自定义渲染器 #

在Android项目里创建渲染器，修改页面的Window属性来实现非全屏：

[assembly: ExportRenderer(typeof(PartialScreenPage), typeof(PartialScreenPageRenderer))]
namespace YourAppNamespace.Droid.Renderers
{
    public class PartialScreenPageRenderer : PageRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Page> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                // 获取当前Window
                var window = Context.GetActivity().Window;
                // 设置窗口大小为包裹内容（也可以设固定像素值）
                window.SetLayout(ViewGroup.LayoutParams.WrapContent, ViewGroup.LayoutParams.WrapContent);
                // 设置窗口居中显示
                window.SetGravity(GravityFlags.Center);
                // 去掉默认标题栏
                window.RequestFeature(WindowFeatures.NoTitle);
                // 设置窗口背景透明，避免黑色背景
                window.SetBackgroundDrawable(new ColorDrawable(Android.Graphics.Color.Transparent));
                // 禁用窗口外部点击关闭（可选，根据需求调整）
                window.SetFlags(WindowManagerFlags.NotTouchModal, WindowManagerFlags.NotTouchModal);
            }
        }
    }
}

步骤3：iOS平台自定义渲染器 #

在iOS项目里创建对应的渲染器，调整页面的Frame和模态样式：

[assembly: ExportRenderer(typeof(PartialScreenPage), typeof(PartialScreenPageRenderer))]
namespace YourAppNamespace.iOS.Renderers
{
    public class PartialScreenPageRenderer : PageRenderer
    {
        public override void ViewDidAppear(bool animated)
        {
            base.ViewDidAppear(animated);

            // 设置页面Frame，这里是屏幕中间50%宽高的区域，可自定义
            var screenBounds = UIScreen.MainScreen.Bounds;
            View.Frame = new CGRect(
                screenBounds.Width / 4, 
                screenBounds.Height / 4, 
                screenBounds.Width / 2, 
                screenBounds.Height / 2);
            
            // 设置模态呈现样式为覆盖全屏，让后面的页面可见
            ModalPresentationStyle = UIModalPresentationStyle.OverFullScreen;
            // 设置背景透明
            View.BackgroundColor = UIColor.Clear;
            // 给页面加圆角（可选，和XAML里的Frame呼应）
            View.Layer.CornerRadius = 10;
            View.ClipsToBounds = true;
        }
    }
}

步骤4：使用这个独立页面 #

在你的主页面里，通过模态导航打开这个页面——它是完全独立的，不属于任何父布局：

private async void OpenPartialPageButton_Clicked(object sender, EventArgs e)
{
    await Navigation.PushModalAsync(new YourPartialPage());
}

一些实用小提示 #

• 记得给PartialScreenPage设置半透明/透明背景色，这样后面的页面才能透出来
• Android端如果出现黑色背景，检查window.SetBackgroundDrawable是否正确设置了透明
• iOS端如果页面位置不对，调整View.Frame的坐标计算即可

内容的提问来源于stack exchange，提问作者David Christopher Reynolds