WinUI3中页面单个组件能否全屏？CanvasControl全屏实现方法问询

方法一：通过布局属性直接填充父容器 #

修改XAML中CanvasControl的布局属性，让它自动占满外层Grid的全部空间：

<Grid>
    <canvas:CanvasControl x:Name="canvas"
                          HorizontalAlignment="Stretch"
                          VerticalAlignment="Stretch"
                          Margin="0"/>
</Grid>

• HorizontalAlignment="Stretch"和VerticalAlignment="Stretch"会让控件自动填充父容器的可用区域
• 移除默认Margin避免出现不必要的留白

方法二：绑定窗口尺寸实现实时同步 #

如果需要跟随窗口大小变化始终保持全屏，可将控件宽高绑定到当前窗口的实际尺寸：

<Grid>
    <canvas:CanvasControl x:Name="canvas"
                          Width="{x:Bind Window.Current.Bounds.Width, Mode=OneWay}"
                          Height="{x:Bind Window.Current.Bounds.Height, Mode=OneWay}"/>
</Grid>

这种方式会实时同步窗口的宽高变化，适合需要严格匹配窗口尺寸的场景。

方法三：代码实现全屏切换功能 #

如果需要点击控件切换全屏/还原状态，可通过后台代码处理：

1. 保留基础XAML结构：

<Grid>
    <canvas:CanvasControl x:Name="canvas"
                          HorizontalAlignment="Stretch"
                          VerticalAlignment="Stretch"
                          Tapped="Canvas_Tapped"/>
</Grid>

2. 后台C#逻辑：

private async void Canvas_Tapped(object sender, TappedRoutedEventArgs e)
{
    var appWindow = GetAppWindowForCurrentWindow();
    if (appWindow.Presenter is OverlappedPresenter overlappedPresenter)
    {
        if (overlappedPresenter.State == OverlappedPresenterState.Maximized || 
            overlappedPresenter.State == OverlappedPresenterState.FullScreen)
        {
            overlappedPresenter.Restore();
        }
        else
        {
            await overlappedPresenter.TryEnterFullScreenAsync();
        }
    }
}

private AppWindow GetAppWindowForCurrentWindow()
{
    if (AppWindow.GetFromWindowId(Win32Interop.GetWindowIdFromWindow(Window.Current.CoreWindow)) is AppWindow appWindow)
    {
        return appWindow;
    }
    throw new InvalidOperationException("无法获取当前窗口的AppWindow实例");
}

• 点击CanvasControl即可切换全屏/还原状态
• 进入全屏后，控件会因布局属性自动填充整个窗口

注意事项 #

• 不要给CanvasControl设置固定的Width和Height，否则会覆盖拉伸属性
• 如果视频流有固定比例，全屏时可在绘制逻辑中调整渲染区域，实现保持比例或全屏填充的效果

内容的提问来源于stack exchange，提问作者fengwanxiyu