You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

WebView2中YouTube播放器退出全屏移位及全屏尺寸异常问题

解决WebView2中YouTube播放器的两个全屏问题

针对你遇到的两个问题,提供以下实用解决方案:

问题1:退出全屏后播放器随Panel滚动条偏移

退出全屏后WebView2控件位置偏移,核心原因是全屏切换后控件未同步Panel的滚动状态。可以通过监听全屏状态变化事件,强制修正控件位置:

  1. 给WebView2绑定ContainsFullscreenElementChanged事件
  2. 检测到退出全屏(e.IsFullscreenElement为false)时,同步控件位置并刷新布局:
private void WebView2_ContainsFullscreenElementChanged(object sender, CoreWebView2ContainsFullscreenElementChangedEventArgs e)
{
    if (!e.IsFullscreenElement)
    {
        // 抵消Panel滚动偏移,修正WebView2位置
        webView21.Location = new Point(
            webView21.Location.X + panel1.AutoScrollPosition.X,
            webView21.Location.Y + panel1.AutoScrollPosition.Y
        );
        // 强制刷新控件布局
        webView21.Refresh();
        panel1.Refresh();
    }
}

如果上述方法无效,可尝试调用panel1.PerformLayout()强制重新计算容器布局。

问题2:全屏时最大化Panel而非按指定大小显示

默认情况下WebView2会将父容器(Panel)拉伸成全屏,这是因为它把YouTube的全屏请求映射到了容器级别。要实现自定义全屏尺寸,需拦截全屏请求手动控制:

  1. 监听WebView2的FullscreenRequested事件,取消默认行为
  2. 根据需求设置WebView2的尺寸(指定宽高或屏幕全屏):
private async void WebView2_FullscreenRequested(object sender, CoreWebView2FullscreenRequestedEventArgs e)
{
    // 取消默认的容器全屏行为
    e.Handled = true;

    // 方案1:设置为指定固定尺寸(示例800x600)
    webView21.Size = new Size(800, 600);
    // 居中显示在屏幕上
    webView21.Location = new Point(
        (Screen.PrimaryScreen.Bounds.Width - 800) / 2,
        (Screen.PrimaryScreen.Bounds.Height - 600) / 2
    );
    // 将WebView2临时脱离Panel,避免容器限制(可选)
    webView21.Parent = this;

    // 方案2:实现真正的屏幕全屏
    // webView21.Dock = DockStyle.Fill;
    // this.WindowState = FormWindowState.Maximized;
}

同时,记得在退出全屏时恢复WebView2的原始状态:

private void WebView2_ContainsFullscreenElementChanged(object sender, CoreWebView2ContainsFullscreenElementChangedEventArgs e)
{
    if (!e.IsFullscreenElement)
    {
        // 恢复原始尺寸和父容器
        webView21.Size = new Size(你的原始宽度, 你的原始高度);
        webView21.Parent = panel1;
        // 若使用了屏幕全屏方案,恢复窗口状态
        // this.WindowState = FormWindowState.Normal;
    }
}

另外,建议将WebView2更新至最新稳定版,旧版本可能存在全屏处理的兼容性bug。

内容的提问来源于stack exchange,提问作者RobbGarner

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.09 06:28:28