解决使用YoutubePlayerFlutter时SystemUi Overlay消失问题

问题现象 #

使用YoutubePlayerFlutter播放视频时，进入全屏模式再退出后，会出现以下异常：

• 点击全屏前：系统UI（状态栏、导航栏等）正常显示
• 全屏中：系统UI自动隐藏
• 退出全屏后当前页面：SystemUi Overlay完全消失
• 切换到其他页面：SystemUi Overlay依然处于消失状态

解决方案 #

在YoutubePlayerBuilder中添加onExitFullScreen回调，强制恢复系统UI的显示状态：

onExitFullScreen: () => SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: SystemUiOverlay.values),

完整代码示例 #

Widget build(BuildContext context) {
  return YoutubePlayerBuilder(
    onExitFullScreen: () => SystemChrome.setEnabledSystemUIMode(
      SystemUiMode.manual,
      overlays: SystemUiOverlay.values,
    ),
    player: YoutubePlayer(controller: _ytController),
    builder: (context, player) {
      return Column(
        children: [
          Container(),
          player,
        ],
      );
    },
  );
}

注：我曾花费大量时间排查该问题，解决后决定分享出来，因为网上并未找到相关解决方案。如有需要进一步说明的地方，可补充更多细节。

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