如何实现Toga.WebView中视频的全屏播放？

要解决Toga WebView无法实现视频全屏的问题，核心是启用WebView的全屏权限并配合窗口状态切换，具体步骤如下：

1. 启用WebView全屏权限 #

初始化WebView时，显式开启allow_fullscreen参数，允许页面发起全屏请求：

self.webview = toga.WebView(
    style=Pack(flex=1),
    allow_fullscreen=True
)

2. 添加全屏事件回调 #

视频页面触发全屏时，需要手动切换主窗口的全屏状态，添加on_fullscreen回调处理：

def handle_fullscreen(self, widget, fullscreen):
    self.main_window.fullscreen = fullscreen

将该回调绑定到WebView初始化参数中：

self.webview = toga.WebView(
    style=Pack(flex=1),
    allow_fullscreen=True,
    on_fullscreen=self.handle_fullscreen
)

完整修改后的代码 #

"""
影视采集测试
"""
from toga import App, Box, Button, MainWindow, WebView
from toga.style import Pack
from toga.style.pack import COLUMN, ROW

class VideoPlayerApp(App):
    def startup(self):
        main_box = Box(style=Pack(direction=COLUMN))
        self.webview = WebView(
            style=Pack(flex=1),
            allow_fullscreen=True,
            on_fullscreen=self.handle_fullscreen
        )
        main_box.add(self.webview)

        control_box = Box(style=Pack(direction=ROW))
        button = Button('播放', on_press=self.video_play)
        control_box.add(button)
        
        main_box.add(control_box)
        self.main_window = MainWindow(title=self.formal_name)
        self.main_window.content = main_box
        self.main_window.show()

    def handle_fullscreen(self, widget, fullscreen):
        self.main_window.fullscreen = fullscreen

    async def video_play(self, widget):
        self.webview.url = "https://jx.wujinkk.com/dplayer/?url=https://top.1080pzy.co/202311/07/q311g19B863/video/index.m3u8"

def main():
    return VideoPlayerApp()

if __name__ == "__main__":
    main().main_loop()

平台注意事项 #

• macOS：开发模式下Briefcase已默认配置全屏权限，打包时无需额外操作
• Windows/Linux：依赖系统WebView控件，启用allow_fullscreen后即可正常生效

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