快捷键与系统 #

一、全局快捷键 #

1.1 globalShortcut 模块 #

javascript
const { globalShortcut, app } = require('electron');

app.whenReady().then(() => {
    // 注册全局快捷键
    globalShortcut.register('CommandOrControl+Shift+D', () => {
        console.log('快捷键被触发');
        mainWindow.show();
    });

    // 注册多个快捷键
    globalShortcut.register('CommandOrControl+Alt+L', () => {
        lockScreen();
    });
});

// 应用退出时注销所有快捷键
app.on('will-quit', () => {
    globalShortcut.unregisterAll();
});

1.2 快捷键组合 #

javascript
// 常用修饰键
// Windows/Linux: Ctrl, Alt, Shift, Super
// macOS: Cmd (Command), Option (Alt), Shift, Control

// 示例
'CommandOrControl+A'  // macOS: Cmd+A, Windows/Linux: Ctrl+A
'CommandOrControl+Shift+S'  // 保存为
'Alt+F4'  // 关闭窗口
'F5'  // 刷新
'MediaPlayPause'  // 媒体键

1.3 检查与注销 #

javascript
// 检查快捷键是否已注册
if (globalShortcut.isRegistered('CommandOrControl+X')) {
    console.log('快捷键已被占用');
}

// 注销单个快捷键
globalShortcut.unregister('CommandOrControl+Shift+D');

// 注销所有快捷键
globalShortcut.unregisterAll();

1.4 快捷键管理器 #

javascript
// shortcutManager.js
class ShortcutManager {
    constructor() {
        this.shortcuts = new Map();
    }

    register(accelerator, callback) {
        if (this.shortcuts.has(accelerator)) {
            console.warn(`快捷键 ${accelerator} 已注册`);
            return false;
        }

        const success = globalShortcut.register(accelerator, callback);
        if (success) {
            this.shortcuts.set(accelerator, callback);
        }
        return success;
    }

    unregister(accelerator) {
        if (this.shortcuts.has(accelerator)) {
            globalShortcut.unregister(accelerator);
            this.shortcuts.delete(accelerator);
            return true;
        }
        return false;
    }

    unregisterAll() {
        globalShortcut.unregisterAll();
        this.shortcuts.clear();
    }

    isRegistered(accelerator) {
        return globalShortcut.isRegistered(accelerator);
    }

    getAll() {
        return Array.from(this.shortcuts.keys());
    }
}

module.exports = new ShortcutManager();

1.5 动态快捷键 #

javascript
// 根据应用状态动态注册快捷键
function updateShortcuts(isPlaying) {
    if (isPlaying) {
        shortcutManager.register('MediaPlayPause', pausePlayback);
        shortcutManager.unregister('MediaPlay');
    } else {
        shortcutManager.register('MediaPlayPause', startPlayback);
        shortcutManager.unregister('MediaPause');
    }
}

二、窗口快捷键 #

2.1 菜单快捷键 #

javascript
// 通过菜单定义快捷键
const template = [
    {
        label: '文件',
        submenu: [
            {
                label: '新建',
                accelerator: 'CmdOrCtrl+N',
                click: () => createNew()
            },
            {
                label: '打开',
                accelerator: 'CmdOrCtrl+O',
                click: () => openFile()
            },
            {
                label: '保存',
                accelerator: 'CmdOrCtrl+S',
                click: () => saveFile()
            }
        ]
    }
];

2.2 本地快捷键 #

javascript
// 在渲染进程中监听键盘事件
document.addEventListener('keydown', (e) => {
    // Ctrl/Cmd + S
    if ((e.ctrlKey || e.metaKey) && e.key === 's') {
        e.preventDefault();
        saveFile();
    }

    // Ctrl/Cmd + Shift + S
    if ((e.ctrlKey || e.metaKey) && e.shiftKey && e.key === 'S') {
        e.preventDefault();
        saveFileAs();
    }

    // Escape
    if (e.key === 'Escape') {
        closeModal();
    }
});

2.3 加速器字符串 #

javascript
// 加速器格式
'CommandOrControl'  // macOS: Command, Windows/Linux: Control
'Super'             // Windows: Windows键, Linux: Super键
'Cmd'               // Command (macOS)
'Ctrl'              // Control
'Shift'             // Shift
'Alt'               // Alt
'Option'            // Option (macOS)

// 组合示例
'CmdOrCtrl+Shift+K'
'Alt+Enter'
'F11'
'PageUp'
'Delete'
'Insert'
'Home'
'End'
'ArrowUp'
'ArrowDown'
'ArrowLeft'
'ArrowRight'

// 媒体键
'VolumeUp'
'VolumeDown'
'VolumeMute'
'MediaNextTrack'
'MediaPreviousTrack'
'MediaStop'
'MediaPlayPause'

三、剪贴板 #

3.1 clipboard 模块 #

javascript
const { clipboard } = require('electron');

// 写入文本
clipboard.writeText('Hello, World!');

// 读取文本
const text = clipboard.readText();
console.log(text);  // 'Hello, World!'

// 写入 HTML
clipboard.writeHTML('<b>Bold text</b>');

// 读取 HTML
const html = clipboard.readHTML();

// 写入图片
const image = nativeImage.createFromPath('image.png');
clipboard.writeImage(image);

// 读取图片
const img = clipboard.readImage();

// 清空剪贴板
clipboard.clear();

// 检查格式
const formats = clipboard.availableFormats();
console.log(formats);  // ['text/plain', 'text/html']

3.2 剪贴板监听 #

javascript
// 监听剪贴板变化
let lastText = clipboard.readText();

setInterval(() => {
    const currentText = clipboard.readText();
    if (currentText !== lastText) {
        lastText = currentText;
        console.log('剪贴板内容变化:', currentText);
        onClipboardChange(currentText);
    }
}, 500);

3.3 自定义格式 #

javascript
// 写入自定义数据
clipboard.write({
    text: 'plain text',
    html: '<b>html</b>',
    bookmark: 'bookmark title'
});

// 读取特定格式
const bookmark = clipboard.read('bookmark');

四、系统集成 #

4.1 shell 模块 #

javascript
const { shell } = require('electron');

// 在默认浏览器中打开 URL
await shell.openExternal('https://example.com');

// 在默认应用中打开文件
await shell.openPath('/path/to/file.pdf');

// 显示文件在文件夹中
shell.showItemInFolder('/path/to/file.pdf');

// 移动文件到回收站
shell.trashItem('/path/to/file.txt');

// 播放系统提示音
shell.beep();

// 写入快捷方式(Windows)
if (process.platform === 'win32') {
    shell.writeShortcutLink('shortcut.lnk', {
        target: 'C:\\path\\to\\app.exe',
        workingDirectory: 'C:\\path\\to',
        args: '--arg1'
    });
}

4.2 默认应用 #

javascript
// 打开默认邮件客户端
await shell.openExternal('mailto:example@email.com');

// 打开默认电话应用
await shell.openExternal('tel:+1234567890');

// 打开默认地图应用
await shell.openExternal('https://maps.google.com/?q=location');

4.3 协议处理 #

javascript
// 注册自定义协议
app.setAsDefaultProtocolClient('myapp');

// 处理协议调用
app.on('open-url', (event, url) => {
    event.preventDefault();
    console.log('协议调用:', url);
    // myapp://action?param=value
});

五、屏幕信息 #

5.1 screen 模块 #

javascript
const { screen } = require('electron');

// 获取主显示器
const primaryDisplay = screen.getPrimaryDisplay();
console.log('分辨率:', primaryDisplay.size);
console.log('缩放因子:', primaryDisplay.scaleFactor);
console.log('工作区:', primaryDisplay.workAreaSize);

// 获取所有显示器
const displays = screen.getAllDisplays();
displays.forEach((display, index) => {
    console.log(`显示器 ${index + 1}:`);
    console.log('  分辨率:', display.size);
    console.log('  位置:', display.bounds);
    console.log('  工作区:', display.workArea);
});

// 获取鼠标位置
const cursorPosition = screen.getCursorScreenPoint();
console.log('鼠标位置:', cursorPosition);

// 获取指定位置的显示器
const displayAtPoint = screen.getDisplayNearestPoint({ x: 100, y: 100 });

5.2 显示器事件 #

javascript
// 显示器添加
screen.on('display-added', (event, newDisplay) => {
    console.log('新显示器:', newDisplay);
});

// 显示器移除
screen.on('display-removed', (event, oldDisplay) => {
    console.log('移除显示器:', oldDisplay);
});

// 显示器变化
screen.on('display-metrics-changed', (event, display, changedMetrics) => {
    console.log('显示器变化:', changedMetrics);
    // changedMetrics: ['bounds', 'workArea', 'scaleFactor', 'rotation']
});

5.3 窗口位置管理 #

javascript
// 将窗口居中到鼠标所在的显示器
function centerWindowOnCurrentDisplay(win) {
    const cursorPos = screen.getCursorScreenPoint();
    const display = screen.getDisplayNearestPoint(cursorPos);
    
    const [width, height] = win.getSize();
    const x = display.workArea.x + (display.workArea.width - width) / 2;
    const y = display.workArea.y + (display.workArea.height - height) / 2;
    
    win.setPosition(Math.round(x), Math.round(y));
}

六、电源管理 #

6.1 powerMonitor 模块 #

javascript
const { powerMonitor } = require('electron');

// 系统挂起
powerMonitor.on('suspend', () => {
    console.log('系统即将挂起');
    saveState();
});

// 系统恢复
powerMonitor.on('resume', () => {
    console.log('系统已恢复');
    restoreState();
});

// 电源状态变化
powerMonitor.on('on-ac', () => {
    console.log('使用交流电源');
});

powerMonitor.on('on-battery', () => {
    console.log('使用电池');
});

// 锁屏
powerMonitor.on('lock-screen', () => {
    console.log('屏幕已锁定');
});

// 解锁
powerMonitor.on('unlock-screen', () => {
    console.log('屏幕已解锁');
});

// 获取电池状态
const battery = powerMonitor.getBatteryState();
console.log('电池状态:', battery);
// { charging: true, level: 0.85, ... }

6.2 阻止系统休眠 #

javascript
const { powerSaveBlocker } = require('electron');

// 阻止系统休眠
const id = powerSaveBlocker.start('prevent-display-sleep');
console.log('阻止休眠 ID:', id);

// 检查是否在阻止
const isStarted = powerSaveBlocker.isStarted(id);

// 停止阻止
powerSaveBlocker.stop(id);

// 阻止类型
// 'prevent-app-suspension' - 阻止应用被挂起
// 'prevent-display-sleep' - 阻止显示器休眠

七、进程管理 #

7.1 child_process #

javascript
const { spawn, exec, execFile } = require('child_process');

// spawn - 流式输出
const child = spawn('ls', ['-la']);

child.stdout.on('data', (data) => {
    console.log(`输出: ${data}`);
});

child.stderr.on('data', (data) => {
    console.error(`错误: ${data}`);
});

child.on('close', (code) => {
    console.log(`进程退出,代码: ${code}`);
});

// exec - 缓冲输出
exec('ls -la', (error, stdout, stderr) => {
    if (error) {
        console.error(`错误: ${error}`);
        return;
    }
    console.log(`输出: ${stdout}`);
});

// execFile - 执行文件
execFile('node', ['--version'], (error, stdout) => {
    console.log(`Node 版本: ${stdout}`);
});

7.2 打开外部程序 #

javascript
// Windows
if (process.platform === 'win32') {
    exec('start "" "C:\\path\\to\\app.exe"');
}

// macOS
if (process.platform === 'darwin') {
    exec('open -a "App Name"');
}

// Linux
if (process.platform === 'linux') {
    exec('xdg-open /path/to/file');
}

八、最佳实践 #

8.1 快捷键配置 #

javascript
// 用户可配置的快捷键
const defaultShortcuts = {
    'show-window': 'CommandOrControl+Shift+W',
    'quick-capture': 'CommandOrControl+Shift+C',
    'toggle-devtools': 'CommandOrControl+Shift+I'
};

function loadShortcuts() {
    const userShortcuts = store.get('shortcuts', defaultShortcuts);
    
    Object.entries(userShortcuts).forEach(([action, accelerator]) => {
        shortcutManager.register(accelerator, () => {
            handleShortcutAction(action);
        });
    });
}

function handleShortcutAction(action) {
    switch (action) {
        case 'show-window':
            mainWindow.show();
            break;
        case 'quick-capture':
            startCapture();
            break;
        case 'toggle-devtools':
            mainWindow.webContents.toggleDevTools();
            break;
    }
}

8.2 跨平台处理 #

javascript
// 跨平台路径处理
const path = require('path');

// 获取应用数据目录
const appDataPath = app.getPath('appData');

// 获取配置文件路径
const configPath = path.join(
    app.getPath('userData'),
    'config.json'
);

// 获取临时目录
const tempPath = app.getPath('temp');

九、总结 #

9.1 核心要点 #

要点 说明
全局快捷键 globalShortcut 注册系统级快捷键
窗口快捷键 菜单或渲染进程监听键盘事件
剪贴板 clipboard 读写剪贴板内容
系统集成 shell 打开外部应用和链接
屏幕信息 screen 获取显示器信息
电源管理 powerMonitor 监听电源事件

9.2 下一步 #

现在你已经掌握了快捷键与系统集成,接下来让我们学习 本地存储,深入了解 Electron 应用的数据持久化!

最后更新:2026-03-28