복사 붙여넣기

복사 붙여넣기 시스템은 ICopyable 객체, 복사된 객체를 나타내는 ICopyData, 복사 데이터를 복사 가능한 객체로 다시 전환할 수 있는 IPaster 객체라는 세 가지로 구성됩니다. 모든 유형의 ICopyable에는 해당 데이터를 붙여넣을 수 있는 연결된 IPaster가 필요합니다.

이러한 시스템은 컨텍스트 메뉴 옵션 및 단축키를 통해 사용자에게 표시됩니다.

일반적으로 복사 가능한 객체는 렌더링되며 Blockly에 새 렌더링된 객체를 추가할 수 없으므로 맞춤 복사 가능 객체 또는 맞춤 붙여넣기 도구 (예: 다중 선택 플러그인 또는 교차 탭 복사 붙여넣기 플러그인)를 구현해야 하는 경우는 거의 없습니다. 작업공간 내에 존재할 수 있는 렌더링된 객체는 블록, 풍선, 작업공간 댓글뿐입니다.

복사 가능한 구현

복사 가능한 객체를 만들려면 ICopyable 인터페이스를 구현해야 합니다.

선택 가능

ICopyable 인터페이스는 ISelectable 인터페이스를 확장하므로 이러한 메서드와 속성도 구현해야 합니다.

단축키는 선택한 객체를 보고 무엇을 복사할지 확인하기 때문에 선택 가능해야 합니다.

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

복사 가능

ICopyable 인터페이스 자체에는 복사 가능한 객체 상태의 JSON 직렬화 가능한 표현을 반환하는 toCopyData 메서드만 있습니다. 이 메서드는 복사 가능한 객체를 다시 만드는 데 사용할 수 있습니다.

복사 데이터에는 이 복사 데이터를 붙여넣어야 하는 패스터와 연결된 등록된 문자열 이름을 보유하는 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,
    };
  }
}

패스터 구현

패스터를 만들려면 IPaster 인터페이스를 구현해야 합니다. 붙여넣을 항목의 사본 데이터, 항목을 붙여넣을 워크스페이스, 항목을 붙여넣을 위치인 선택적 좌표를 사용하는 메서드 paste 하나만 있습니다.

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

등록

패스터를 구현한 후에는 paster 속성에서 지정된 사본 데이터와 연결된 패스터를 찾을 수 있도록 패스터를 등록해야 합니다.

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