Copia e incolla

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

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

Esistono pochissime circostanze in cui potresti voler implementare un elemento personalizzato copiabile o un elemento personalizzato per l'inserimento (ad es. il plug-in di selezione multipla o il plug-in di copia e incolla della tabella a crociera), perché solitamente gli oggetti copiabili vengono visualizzati e non puoi aggiungere nuovi oggetti visualizzati a Blockly. Gli unici oggetti visualizzati che possono esistere in uno spazio di lavoro sono blocchi, bolle e commenti dello spazio di lavoro.

Implementa un modello 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à.

L'elemento deve essere selezionabile perché le scorciatoie da tastiera esaminano l'elemento 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.
  }
}

Copiabile

L'interfaccia ICopyable ha a sua volta un solo metodo, toCopyData, che restituisce una rappresentazione JSON-serializable dello stato dell'oggetto copiabile, che può essere utilizzato per ricreare l'oggetto copiabile.

I dati di copia devono includere anche una proprietà paster, che contiene il nome-stringa registrato associato al collante che deve incollare questi dati di copia. Per maggiori 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,
    };
  }
}

Implementare un adesivo

Per creare un adesivo, devi implementare l'interfaccia IPaster. Ha un solo metodo paste che acquisisce i dati di copia dell'elemento che incolla, lo spazio di lavoro in cui incollarlo e una coordinata facoltativa, ovvero la posizione in cui incollarlo.

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.
  }
}

Registrazione

Dopo aver implementato un incollatore, devi registrarlo per poter trovare l'incollatore associato a dati di copia specifici dalla relativa proprietà paster.

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