主题
创建对话框
在 Electron 中,创建对话框主要使用 dialog
模块。dialog
是一个用于显示系统对话框的模块,比如打开文件、保存文件或显示警告等。这个模块必须在 BrowserWindow
创建后才能使用。
以下是一个简单的示例,展示如何使用 dialog
模块来创建一个打开文件的对话框:
javascript
const { app, BrowserWindow, dialog } = require('electron')
function createWindow () {
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
})
// 加载 index.html 到窗口
win.loadFile('index.html')
}
app.whenReady().then(createWindow)
// 打开文件对话框
app.on('ready', () => {
dialog.showOpenDialog({
properties: ['openFile']
}).then(result => {
console.log(result.canceled)
console.log(result.filePaths)
}).catch(err => {
console.log(err)
})
})
在这个例子中,我们首先引入了 app
, BrowserWindow
, 和 dialog
模块。然后定义了一个 createWindow
函数用来创建一个新的 BrowserWindow
。当 Electron 应用准备就绪时,我们调用了 showOpenDialog
方法来显示一个打开文件的对话框。
showOpenDialog
方法接受一个选项对象作为参数,可以配置对话框的属性,如是否选择文件夹、是否多选等。在这个例子中,我们只允许用户选择单个文件。
对话框显示后,会返回一个 Promise,Promise 的结果是一个包含 canceled
和 filePaths
属性的对象。如果用户取消了对话框,canceled
将为 true
;否则,filePaths
将包含用户选择的文件路径。
你还可以使用 showSaveDialog
来创建一个保存文件的对话框,或者使用 showMessageBox
来显示一个消息框。每个方法都有其特定的参数和返回值,具体可以参考 Electron 的官方文档。