使用Electron调用系统对话框本系列文章的应用示例已发布在GitHub上:electron-api-demos-Zh_CN。您可以克隆或下载它并运行它来查看。欢迎来到星空。Electron中的对话框模块允许您使用本地系统对话框打开文件或目录、保存文件或显示信息性消息。这是一个主进程模块,因为这个进程对于本机实用程序更有效,并且它允许在不中断页面呈现器进程中的可见元素的情况下同时进行调用。在浏览器中查看完整的API文档。打开文件或目录支持:Win、macOS、Linux|Process:Main在此示例中,ipc模块用于从渲染器进程发送消息,指示主进程启动打开文件(或目录)对话框。如果选择了一个文件,主进程可以将该信息发送回渲染器进程。渲染进程constipc=require('electron').ipcRendererconstselectDirBtn=document.getElementById('select-directory')selectDirBtn.addEventListener('click',function(event){ipc.send('open-file-dialog')})ipc.on('selected-directory',function(event,path){document.getElementById('selected-file').innerHTML=`Youselected:${path}`})mainprocessconstipc=require('electron').ipcMainconstdialog=require('electron').dialogipc.on('open-file-dialog',function(event){dialog.showOpenDialog({属性:['openFile','openDirectory']},function(files){if(files)event.sender.send('selected-directory',文件)})})macOS上的高级提示表样式对话框。在macOS上,您可以在工作表对话框或默认对话框之间进行选择。工作表版本从窗口顶部向下滑动。要使用sheet版本,请在dialog方法中使用window作为第一个参数。on('open-file-dialog-sheet',function(event){constwindow=BrowserWindow.fromWebContents(event.sender)constfiles=dialog.showOpenDialog(window,{properties:['openFile']})})错误对话框支持:Win、macOS、Linux|Process:Main在此示例中,ipc模块用于从渲染器进程发送消息,指示主进程启动错误对话框。您可以在应用程序的就绪事件之前使用错误对话框,这对于在启动时显示错误很有用。渲染进程constipc=require('electron').ipcRendererconsterrorBtn=document.getElementById('error-dialog')errorBtn.addEventListener('click',function(event){ipc.send('open-error-dialog')})主进程constipc=require('electron').ipcMainconstdialog=require('electron').dialogipc.on('open-error-dialog',function(event){dialog.showErrorBox('错误信息','错误信息演示。')})信息对话框支持:Win,macOS,Linux|工艺:Main在此示例中,ipc模块用于从渲染器进程发送消息,指示主进程启动信息对话框。可以为响应提供选项,这些选项将返回给渲染器进程。注意:title属性不会在macOS中显示。信息对话框可以包含图标、选定按钮、标题和消息。渲染进程constipc=require('electron').ipcRendererconstinformationBtn=document.getElementById('information-dialog')informationBtn.addEventListener('click',function(event){ipc.send('open-information-dialog')})ipc.on('information-dialog-selection',function(event,index){letmessage='Youhaveselected'if(index===0)message+='Yes.'elsemessage+='No.'document.getElementById('info-selection').innerHTML=message})主进程constipc=require('electron').ipcMainconstdialog=require('electron').dialogipc.on('open-information-dialog',function(event){constoptions={type:'info',title:'information',message:"ThisisAninformationdialog.Nice?",buttons:['Yes','No']}对话框.showMessageBox(options,function(index){event.sender.send('information-dialog-selection',index)})})保存对话框支持:Win,macOS,Linux|Process:Main在此示例中,ipc模块用于从渲染器进程发送消息,指示主进程启动保存对话框。它返回用户选择的路径,并可以将其路由回渲染器进程。渲染器进程constipc=require('electron').ipcRendererconstsaveBtn=document.getElementById('save-dialog')saveBtn.addEventListener('click',function(event){ipc.send('save-dialog')})ipc.on('saved-file',function(event,path){if(!path)path='nopath'document.getElementById('file-saved').innerHTML=`pathselected:${path}`})主进程constipc=require('electron').ipcMainconstdialog=require('electron').dialogipc.on('save-dialog',function(event){constoptions={title:'SaveImage',过滤器:[{名称:'图像',扩展名:['jpg','png','gif']}]}dialog.showSaveDialog(选项,函数(文件名){event.sender.send('保存文件',filename)})})如果本文对您有帮助,请点赞或starGitHub:electron-api-demos-Zh_CN支持,谢谢。
