解决Electron应用打开后短暂出现菜单栏和白屏闪烁问题

问题背景:

最近准备使用Electron来做一个桌面读书软件,由于之前接触出类似项目,但没有人深入去做,所以这次准备自己独立完成一个。
Electron打包的应用会自带上顶部菜单栏,包括(File、Edit、View、Window、Help)等菜单,由于不需要该菜单,于是在主程序文件中将他们隐藏掉了。

// 隐藏顶部菜单
  win.setMenu(null);

在这里插入图片描述

重新运行后发现,在应用启动时会出现0.5秒左右的闪烁,此时隐藏的菜单再次出来了,而且屏幕一片雪白,体验很不好

在这里插入图片描述

问题排查

本以为是不是电脑性能问题,想着是不是打包后就不会出现该现象,打包后安装发现问题照旧。
经过多次搜索,最后在网上找到了相同的问题。
解决Electron启动出现短暂的白屏
也就是说,应用在打开时会加载本地资源,在没有加载完成时是没有任何内容的,所以一片空白。
如果要解决该问题,就需要在应用资源加载完成后再显示窗口,这样就可以了。

解决方案

  1. 在主程序文件中,将窗口状态设置为关闭。即添加“show:false”。

    在这里插入图片描述

  2. 创建一个“ready-to-show”的监听,每次窗口渲染完成后会触发该事件,当该事件被触发后,就表示可以显示窗口了。
win.once('ready-to-show', () => {
    win.show();
  });

在这里插入图片描述

总结

这样以来就可以了,再次编译时,亲测不会出现闪烁现象了。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐