Kopiuj i wklej

System kopiowania i wklejania składa się z 3 elementów: obiektów ICopyable, ICopyData reprezentujących skopiowane obiekty oraz obiektów IPaster, które mogą przekształcić skopiowane dane z powrotem w kopiowalne obiekty. Każdy typ ICopyable wymaga powiązania z elementem IPaster, który może wstawić te dane.

Systemy te są wyświetlane użytkownikowi przez opcje menu kontekstowego i skróty klawiszowe.

W nielicznych przypadkach warto zastosować niestandardowe funkcje kopiowania lub wklejania (np. wtyczkę multiselect lub wtyczkę kopiowania i wklejania między kartami), ponieważ zwykle obiekty kopiowane są renderowane i nie można dodawać nowych renderowanych obiektów do Blockly. W obszarze roboczym mogą istnieć tylko renderowane obiekty, takie jak bloki, bąbelki i komentarze.

Wdrożenie kopiowania

Aby utworzyć możliwy do skopiowania obiekt, musisz wdrożyć interfejs ICopyable.

Do wyboru

Interfejs ICopyable rozszerza interfejs ISelectable, co oznacza, że musisz zaimplementować te metody i właściwości.

Wybieranie jest wymagane, ponieważ skróty klawiszowe sprawdzają wybrany obiekt, aby ustalić, co skopiować.

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

Można skopiować

Interfejs ICopyable ma tylko 1 metodę toCopyData, która zwraca możliwą do serializowania reprezentację stanu możliwego do skopiowania obiektu w formacie JSON, której można użyć do odtworzenia kopiowanego obiektu.

Dane kopii muszą też zawierać właściwość paster, która przechowuje zarejestrowaną nazwę ciągu znaków powiązaną z elementem do wklejania, który ma wstawić te dane kopii. Więcej informacji o naklejkach znajdziesz w artykule Implementowanie naklejek.

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,
    };
  }
}

Wdrożenie pastera

Aby utworzyć narzędzie wklejające, musisz wdrożyć interfejs IPaster. Ma tylko jedną metodę paste, która pobiera dane skopiowane podczas wklejania, obszar roboczy, do którego wkleja element, oraz opcjonalną współrzędną, czyli lokalizację, w której wklejony element.

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

Rejestracja

Po zaimplementowaniu wklejania musisz je zarejestrować, aby móc znaleźć wklejanie powiązane z danymi kopii z usługi paster.

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