Copia e incolla

Il sistema di copia e incolla è costituito da tre elementi: ICopyable oggetti, ICopyData che rappresenta gli oggetti copiati e IPaster oggetti che possono trasformare i dati di copia in oggetti copiabili. Ogni tipo di ICopyable richiede un IPaster associato che possa incollare questi dati.

Questi sistemi vengono mostrati all'utente tramite le opzioni del menu contestuale e le scorciatoie da tastiera.

Ci sono pochissime circostanze in cui potresti voler implementare un'istruzione copiabile personalizzata o un paster personalizzato (ad es. il plug-in Multiselect o il plug-in per la copia e incolla incrociato), dato che di solito viene eseguito il rendering degli oggetti copiabili e non è possibile aggiungere nuovi oggetti sottoposti a rendering a Blockly. Gli unici oggetti visualizzati che possono esistere all'interno di un'area di lavoro sono blocchi, bolle e commenti dell'area di lavoro.

Implementa un'immagine copiabile

Per creare un oggetto copiabile, devi implementare l'interfaccia ICopyable.

Selezionabile

L'interfaccia ICopyable estende l'interfaccia ISelectable, il che significa che devi implementare anche questi metodi e queste proprietà.

È necessario che sia selezionabile perché le scorciatoie da tastiera esaminano l'oggetto selezionato per capire cosa copiare.

class MyCopyable implements ISelectable {
  constructor(workspace) {
    this.id = Blockly.utils.idGenerator.genUid();
    this.workspace = workspace;
  }

  select() {
    // Visually indicate this draggable is selected.
  }

  unselect() {
    // Visually indicate this draggable is not selected.
  }
}

Copiabili

L'interfaccia ICopyable ha un solo metodo, toCopyData, che restituisce una rappresentazione in serie JSON dello stato dell'oggetto copiabile, che può essere utilizzata per ricreare l'oggetto copiabile.

I dati della copia devono includere anche una proprietà paster, contenente il nome stringa registrato associato all'autore del caricamento che deve incollare i dati della copia. Per ulteriori informazioni sui paster, consulta Implementare un paster.

class MyCopyable implements ICopyable {
  constructor(workspace, state) {
    this.workspace = workspace;
    this.myState = state;
  }

  toCopyData() {
    return {
      // This string matches the string used to register the paster.
      paster: 'MY_PASTER',
      state: this.myState,
    };
  }
}

Implementazione di un paster

Per creare un paster, devi implementare l'interfaccia IPaster. Ha un solo metodo, paste, che prende i dati di copia dell'elemento, l'area di lavoro in cui incollare l'elemento e una coordinata facoltativa, ovvero la posizione in cui incollare l'elemento.

class MyPaster implements IPaster {
  paste(copyData, workspace, coordinate) {
    return new MyCopyable(workspace, copyData.state);
    // Optionally position the copyable at the passed coordinate.
    // Optionally select the copyable after it is pasted.
  }
}

Iscrizione

Dopo aver implementato un paster, devi registrarlo in modo da poter trovare il paster associato a una determinata copia dei dati della relativa proprietà paster.

// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());