O sistema de copiar e colar é criado com base em três elementos: objetos ICopyable
,
objetos ICopyData
, que representam objetos copiados, e
IPaster
, que podem transformar os dados de cópia novamente em objetos
copiáveis. Cada tipo de ICopyable
precisa de uma IPaster
associada que possa colar
esses dados.
Esses sistemas são apresentados para o usuário usando opções do menu de contexto e atalhos de teclado.
Há pouquíssimas circunstâncias em que você quer implementar um paster personalizado ou que pode ser copiado em vários casos (por exemplo, o plug-in de seleção múltipla ou o plug-in de copiar e colar entre guias), porque geralmente objetos copiáveis são renderizados, e não é possível adicionar novos objetos renderizados ao Blockly. Os únicos objetos renderizados que podem existir em um espaço de trabalho são blocos, balões e comentários do espaço de trabalho.
Implementar uma cópia
Para criar um objeto copiável, você precisa implementar a interface ICopyable
.
Selecionável
A interface ICopyable
estende a interface ISelectable
,
o que significa que também é necessário implementar esses métodos e propriedades.
É necessário ser selecionável porque os atalhos do teclado analisam o objeto selecionado para descobrir o que copiar.
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.
}
}
Copiar
A interface ICopyable
tem apenas um método, toCopyData
, que
retorna uma representação JSON serializável do estado do objeto copiável, que pode ser usada para recriar o objeto copiável.
Os dados de cópia também precisam incluir uma propriedade paster
, que contém o nome da string
registrado associado ao paster que vai colar esses dados da cópia. Para mais informações sobre pasters, consulte Implementar um 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,
};
}
}
Implementar um paster
Para criar um paster, implemente a interface IPaster
. Ele só tem
um método paste
, que recebe os dados de cópia daquilo que ele cola, o
espaço de trabalho para colar a coisa e uma coordenada opcional, que é o
local em que a coisa é colada.
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.
}
}
Inscrição
Depois de implementar um paster, é necessário registrá-lo para
encontrar o paster associado a determinados dados de cópia da propriedade paster
.
// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());