解决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();
  });

在这里插入图片描述

总结

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

  • 2
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值