Gestione degli Appunti

Il modulo clipboard di Electron permette di leggere e scrivere negli appunti del sistema operativo, supportando testo, HTML, immagini e formati personalizzati.

Operazioni Base con il Testo

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

// Scrivere testo negli appunti
clipboard.writeText('Testo copiato da Electron');

// Leggere testo dagli appunti
const text = clipboard.readText();
console.log(text); // "Testo copiato da Electron"

// Verificare se gli appunti contengono testo
const hasText = clipboard.has('text/plain');

Copiare e Incollare HTML

// Scrivere HTML negli appunti
clipboard.writeHTML('<h1>Titolo</h1><p>Paragrafo con <strong>grassetto</strong></p>');

// Leggere HTML dagli appunti
const html = clipboard.readHTML();

Copiare Immagini

const { clipboard, nativeImage } = require('electron');

// Scrivere un'immagine negli appunti
const image = nativeImage.createFromPath('/path/to/image.png');
clipboard.writeImage(image);

// Leggere un'immagine dagli appunti
const clipImage = clipboard.readImage();
if (!clipImage.isEmpty()) {
  const pngBuffer = clipImage.toPNG();
  // Usa il buffer PNG
}

Formati Multipli

Puoi scrivere più formati contemporaneamente:

clipboard.write({
  text: 'Testo semplice',
  html: '<b>Testo HTML</b>',
  rtf: '{\\rtf1\\ansi Testo RTF}',
});

Svuotare gli Appunti

clipboard.clear();

Integrazione con IPC

// main.js
ipcMain.handle('clipboard:write', (_event, text) => {
  clipboard.writeText(text);
});

ipcMain.handle('clipboard:read', () => {
  return clipboard.readText();
});

ipcMain.handle('clipboard:writeHTML', (_event, html) => {
  clipboard.writeHTML(html);
});

ipcMain.handle('clipboard:hasText', () => {
  return clipboard.has('text/plain');
});

// preload.js
contextBridge.exposeInMainWorld('clipboard', {
  write: (text) => ipcRenderer.invoke('clipboard:write', text),
  read: () => ipcRenderer.invoke('clipboard:read'),
  writeHTML: (html) => ipcRenderer.invoke('clipboard:writeHTML', html),
  hasText: () => ipcRenderer.invoke('clipboard:hasText'),
});

// renderer.js
document.getElementById('copy-btn').addEventListener('click', async () => {
  const text = document.getElementById('content').textContent;
  await window.clipboard.write(text);
  showToast('Copiato negli appunti!');
});

document.getElementById('paste-btn').addEventListener('click', async () => {
  const text = await window.clipboard.read();
  document.getElementById('editor').value += text;
});

Monitorare i Cambiamenti degli Appunti

Electron non fornisce un evento nativo per i cambiamenti degli appunti. Puoi implementare un polling:

// main.js
let lastClipboardText = '';

function watchClipboard() {
  setInterval(() => {
    const currentText = clipboard.readText();
    if (currentText !== lastClipboardText) {
      lastClipboardText = currentText;
      mainWindow.webContents.send('clipboard:changed', currentText);
    }
  }, 1000); // Controlla ogni secondo
}

Formati Personalizzati

Per applicazioni che devono scambiare dati strutturati:

// Scrivere dati personalizzati
const data = { type: 'node', id: 123, position: { x: 100, y: 200 } };
clipboard.writeBuffer(
  'application/x-mia-app',
  Buffer.from(JSON.stringify(data))
);

// Leggere dati personalizzati
const buffer = clipboard.readBuffer('application/x-mia-app');
if (buffer.length > 0) {
  const data = JSON.parse(buffer.toString());
  console.log(data); // { type: 'node', id: 123, ... }
}