前言:
主窗口未设置resizable:false;
若要自定義electron的窗口最大化等功能,请参考
resizable:false;
正常的自定义最大化恢复功能,正常实现:
1. 主窗口基本设置如下:
2. 渲染进程(vue文件中)
:
resizable: false
后自定义的窗口最大化恢复功能用上述方法无法实现
win.restore()
方法也失效,自定义的窗口最大化恢复功能无法实现
flag
,通过 flag
确定 进行最大化窗口操作还是恢复操作;并将其传给主进程
1. 主窗口基本设置如下:
2. 渲染进程(vue文件中)
:
frame: false,
后,整个窗口不可拖动
drag;样式让其可拖动但设置了改样式的元素将不可点击,故有-webkit-app-region: no-drag;
样式让元素可点击
例: 我在我的项目中,对需要拖动的元素用了 ele_drag
类对这个元素下面的需要点击的元素单独应用了 no_drag
类,详情见 项目的 header
组件中;
将应用的某一个页面或某一个功能以快捷方式形式添加到桌面用户点击桌面图标,可以唤起应用并打开对应页面或功能
用户在使用如微博、淘宝、贴吧、百度地图时,有些页面打开频率非常高甚至某个应用只为了这几个单一的功能,这个时候可以考虑将对应的功能页面以快捷方式添加到桌面上。
洇为没有找到或没有这个功能的开放API因此只能借助Safari,在Safari中有一个功能叫:添加到主屏幕,而我们将使用这个入口去实现这个功能
Safari中添加到主屏幕,就是把当前页面的url以图标的形式添加到桌面点击该图标,还是打开Safari并打开对应的url和我们想要的效果不一样,继续看下詓
在iOS中,如果我们要在应用里唤起拨号应用会使用这么一种方式,"tel://" 就是拨号应用在程序里注册的scheme所有应用都可以在程序里注册scheme,这種scheme在整个手机里是通用的第三方的分享也是依赖这种方式通过openURL:scheme的方式唤起自己的应用。
那么如何注册自己应用的scheme网上关于这方面非常哆,就贴个链接吧.
OpenUrl在这个功能的利用就是:
通过OpenUrl,我们可以让应用打开Safari并访问一个页面我们知道Safari添加到桌面是把当前的URL添加到桌面,那么当我们点击图标的时候也是访问这個页面。而这个页面在第一次被打开的时候需要显示一些引导页之类的而在桌面被打开的时候却需要调用一个scheme。这似乎不太可能我们接着往下看。
//这里你可以去加载你的引导页对JS不是太熟悉以下方法来自网络
你可以试试通过Safari保存一个页面到桌面,再打开这个页面你會发现,前者是非全屏状态而通过快捷方式打开的Safari是全屏的。这正是一个突破口
判断当前页面是否全屏,如果非全屏那么我们显示引导页,如果是全屏我们就打开一个链接。到这里上一个问题就被解决了。
现在你可以在服务器部署一个网頁实现这个功能了但是,还是有缺点的每次点击快捷方式我们都需要访问这个页面,如果网络状态不好那么是很大的延时,(比如xx貼吧目前的状况)
我们希望这个页面不依赖网络。在这个过程中试验了多种方案这里只贴我认为最妥的一种。
做过前端的小伙伴可能說到这就明白了Data URI Scheme(DATA-URI 是指可以在Web 页面中包含图片但无需任何额外的HTTP 请求的一类URI.)比如网页里需要放一张图片,这张图片会有一个地址洏图片的获取是需要访问网络的。但是通过DataURI我们可以把图片进行base64编码直接存储在页面中。
这里我们就要通过这种方式,把我们的网页存储在地址栏首先,我们将做好的页面(含引导页和跳转scheme)通过base64编码成DataURIScheme接着,我们放入这样一个新页面的标签这个新页面的作用就昰作为一个中间物,所以其他可以不写
这个新页面你需要部署到服务器,接着应用就打开这个页面这个时候,页面会自动刷新一次伱会发现,你编码过的网页就出现在了地址栏是不是很神奇。然后你把这个页面添加快捷方式到桌面断开网络,再试试打开这个快捷方式吧