Classe WorkspaceSvg
Classe para um espaço de trabalho. É uma área na tela com lixeira, barras de rolagem, bolhas e arrastar opcionais.
Signature:
export declare class WorkspaceSvg extends Workspace implements IContextMenu, IFocusableNode, IFocusableTree
Extends:Workspace
Implementa:IContextMenu, IFocusableNode, IFocusableTree
Construtores
Construtor | Modificadores | Descrição |
---|---|---|
(constructor)(options) | Cria uma nova instância da classe WorkspaceSvg . |
Propriedades
Propriedade | Modificadores | Tipo | Descrição |
---|---|---|---|
configureContextMenu | ((menuOptions: ContextMenuOption[], e: Event) => void) | null | Os desenvolvedores podem definir essa função para adicionar opções de menu personalizadas ao menu de contexto do espaço de trabalho ou editar o conjunto de opções de menu criado pelo espaço de trabalho. | |
keyboardAccessibilityMode | booleano | True se o modo de acessibilidade do teclado estiver ativado. Caso contrário, será false. | |
keyboardMoveInProgress | booleano | Verdadeiro se uma ação de mover ("arrastar") iniciada pelo teclado estiver em andamento. | |
rendered | booleano | O status de renderização de um espaço de trabalho SVG. Retorna false para espaços de trabalho headless e "true" para instâncias de WorkspaceSvg . |
|
scale | número | Escala atual. | |
scrollbar | ScrollbarPair | null | As barras de rolagem deste espaço de trabalho, se existirem. | |
scrollX | número | Deslocamento horizontal atual da rolagem em unidades de pixel, em relação à origem do espaço de trabalho. É útil pensar em uma visualização e em uma tela se movendo abaixo dela. À medida que a tela se move para a direita, esse valor se torna mais positivo, e a visualização agora "enxerga" o lado esquerdo da tela. À medida que a tela se move para a esquerda, esse valor fica mais negativo, e a visualização agora "enxerga" o lado direito da tela. O confuso sobre esse valor é que ele não inclui e não pode incluir o deslocamento absoluteLeft. Isso acontece porque ele é usado para calcular o valor "viewLeft". O viewLeft é relativo à origem do espaço de trabalho, embora em unidades de pixel. A origem do espaço de trabalho é o canto superior esquerdo dele (pelo menos quando está ativado). Ele é deslocado da parte de cima à esquerda da blocklyDiv para não ficar abaixo da caixa de ferramentas. Quando o espaço de trabalho está ativado, o viewLeft e a origem do espaço de trabalho estão no mesmo local X. À medida que a tela desliza para a direita abaixo da visualização, esse valor (scrollX) se torna mais positivo, e o viewLeft se torna mais negativo em relação à origem do espaço de trabalho. Imagine a origem do espaço de trabalho como um ponto na tela que desliza para a direita à medida que a tela se move. Portanto, se o scrollX incluísse o absoluteLeft, isso de certa forma "deslocaria" a origem do espaço de trabalho. Isso significa que viewLeft representaria a borda esquerda de blocklyDiv, e não a borda esquerda do espaço de trabalho. |
|
scrollY | número | Deslocamento vertical atual da rolagem em unidades de pixel, em relação à origem do espaço de trabalho. É útil pensar em uma visualização e em uma tela se movendo abaixo dela. À medida que a tela rola para baixo, esse valor se torna mais positivo, e a visualização agora "vê" a parte superior da tela. À medida que a tela sobe, esse valor se torna mais negativo, e a visualização "enxerga" a parte inferior da tela. O que confunde nesse valor é que ele não inclui e não pode incluir o deslocamento absoluteTop. Isso acontece porque ele é usado para calcular o valor "viewTop". O viewTop é relativo à origem do espaço de trabalho, embora em unidades de pixel. A origem do espaço de trabalho é o canto superior esquerdo dele (pelo menos quando está ativado). Ele é deslocado da parte de cima à esquerda da blocklyDiv para não ficar abaixo da caixa de ferramentas. Quando o espaço de trabalho está ativado, o viewTop e a origem do espaço de trabalho estão no mesmo local Y. À medida que a tela desliza para baixo, esse valor (scrollY) se torna mais positivo, e o viewTop se torna mais negativo em relação à origem do espaço de trabalho (imagem na origem do espaço de trabalho como um ponto na tela que desliza para baixo à medida que a tela se move). Então, se o scrollY incluísse o absoluteTop, isso de certa forma "deslocaria" a origem do espaço de trabalho. Isso significa que o viewTop representaria a borda superior do blocklyDiv, e não a borda superior do espaço de trabalho. |
|
startScrollX | número | Valor de rolagem horizontal quando a rolagem começou em unidades de pixel. | |
startScrollY | número | Valor de rolagem vertical quando a rolagem foi iniciada em unidades de pixel. | |
svgBackground_ | SVGElement | ||
svgBlockCanvas_ | SVGElement | ||
svgBubbleCanvas_ | SVGElement | ||
svgGroup_ | SVGElement | ||
themeManager_ | protected |
ThemeManager | |
lixeira | Lixeira | null | A lixeira do espaço de trabalho (se houver). | |
zoomControls_ | ZoomControls | null |
Métodos
Método | Modificadores | Descrição |
---|---|---|
addClass(className) | Adiciona uma classe CSS ao espaço de trabalho. | |
addTopBlock(block) | Adiciona um bloco à lista de blocos principais. | |
addTopBoundedElement(element) | Adiciona um elemento limitado à lista dos principais elementos limitados. | |
addTopComment(comment) | Adiciona um comentário à lista dos principais comentários. | |
canBeFocused() | Consulte IFocusableNode.canBeFocused. | |
centerOnBlock(id, blockOnly) | Role o espaço de trabalho para centralizar no bloco especificado. Se o bloco tiver outros blocos empilhados abaixo dele, o espaço de trabalho será centralizado na pilha, a menos que "blockOnly" seja verdadeiro. | |
cleanUp() | Limpe o espaço de trabalho ordenando todos os blocos em uma coluna para que nenhum se sobreponha. | |
clear() | Descarte todos os blocos no espaço de trabalho, com uma otimização para evitar redimensionamentos. | |
copyOptionsForFlyout() | Cria um novo conjunto de opções do espaço de trabalho com apenas os valores relevantes para um submenu flutuante. | |
createDom(opt_backgroundClass, injectionDiv) | Crie os elementos DOM do espaço de trabalho. | |
dispose() | Descarte este espaço de trabalho. Desvincule de todos os elementos DOM para evitar vazamentos de memória. | |
getAbsoluteScale() | Retorna a escala absoluta do espaço de trabalho. O escalonamento do espaço de trabalho é multiplicativo.Se um espaço de trabalho B (por exemplo, um editor de mutadores) com escala Y estiver aninhado em um espaço de trabalho raiz A com escala X, a escala efetiva do espaço de trabalho B será X * Y. Isso porque, como filho de A, ele já é transformado pelo fator de escalonamento de A e depois se transforma ainda mais pelo próprio fator de escalonamento. Normalmente, isso funciona, mas para elementos globais (por exemplo, editores de campo) que estão visualmente associados a um espaço de trabalho específico, mas ficam no nível superior do DOM em vez de serem filhos do espaço de trabalho associado, talvez seja necessário usar a escala absoluta/efetiva para renderizar corretamente. |
|
getAllBlocks(ordered) | Encontra todos os blocos no espaço de trabalho. Os blocos podem ser classificados por posição, de cima para baixo (com um leve viés LTR ou RTL). | |
getAudioManager() | Recebe o gerenciador de áudio para este espaço de trabalho. | |
getBlockById(id) | Encontra o bloco no espaço de trabalho com o ID especificado. | |
getBlocksBoundingBox() | Calcule a caixa delimitadora dos blocos no espaço de trabalho. Sistema de coordenadas: coordenadas do espaço de trabalho. | |
getBubbleCanvas() | Recebe o elemento SVG que forma a superfície do balão. | |
getButtonCallback(key) | Recebe a função de callback associada a uma determinada chave para cliques em botões e rótulos no menu flutuante. | |
getCanvas() | Recebe o elemento SVG que forma a superfície de desenho. | |
getCommentById(id) | Retorna o comentário do espaço de trabalho com o ID especificado, se houver. | |
getComponentManager() | Recebe o gerenciador de componentes para este espaço de trabalho. | |
getCursor() | O cursor deste espaço de trabalho. | |
getDragTarget(e) | Retorna o destino de arrastar sobre o qual o evento de ponteiro está. | |
getFlyout(opt_own) | Getter para o submenu associado a este espaço de trabalho. Esse menu flutuante pode ser de propriedade da caixa de ferramentas ou do espaço de trabalho, dependendo da configuração da caixa de ferramentas. Será nulo se não houver um menu flutuante. | |
getFocusableElement() | Consulte IFocusableNode.getFocusableElement. | |
getFocusableTree() | Consulte IFocusableNode.getFocusableTree. | |
getGrid() | Recebe o objeto de grade para este espaço de trabalho ou nulo se não houver nenhum. | |
getInverseScreenCTM() | Getter para o CTM de tela invertida. | |
getMarkerManager() | Recebe o gerenciador de marcadores para este espaço de trabalho. | |
getMetricsManager() | Recebe o gerenciador de métricas para este espaço de trabalho. | |
getNavigator() | Retorna um objeto responsável por coordenar o movimento do foco entre os itens neste espaço de trabalho em resposta aos comandos de navegação pelo teclado. | |
getNestedTrees() | Consulte IFocusableTree.getNestedTrees. | |
getParentSvg() | Recebe o elemento SVG que contém este espaço de trabalho. Observação: presumimos que isso só será chamado depois que o espaço de trabalho for injetado no DOM. | |
getRenderer() | Recebe o renderizador de blocos anexado a este espaço de trabalho. | |
getRestoredFocusableNode(previousNode) | Consulte IFocusableTree.getRestoredFocusableNode. | |
getRootFocusableNode() | Consulte IFocusableTree.getRootFocusableNode. | |
getRootWorkspace() | ||
getScale() | Recebe o fator de zoom do espaço de trabalho. | |
getSvgGroup() | Retorna o grupo SVG do espaço de trabalho. | |
getTheme() | Recebe o objeto de tema do espaço de trabalho. | |
getToolbox() | Getter para a caixa de ferramentas associada a este espaço de trabalho, se houver. | |
getToolboxCategoryCallback(key) | Recebe a função de callback associada a uma determinada chave para preencher categorias personalizadas da caixa de ferramentas neste espaço de trabalho. | |
getTopBlocks(ordered) | Encontra e retorna os blocos de nível superior. Os blocos podem ser classificados por posição, de cima para baixo (com um leve viés LTR ou RTL). | |
getTopBoundedElements(ordered) | Encontra e retorna os elementos delimitados de nível superior. | |
getTopComments(ordered) | Retorna uma lista de comentários neste espaço de trabalho. | |
getWidth() | Retorna o deslocamento horizontal do espaço de trabalho. Destinado à compatibilidade LTR/RTL em XML. | |
hideChaff(onlyClosePopups) | Fechar dicas, menus de contexto, seleções suspensas etc. | |
hideComponents(onlyClosePopups) | Oculte todos os componentes que podem ser ocultados automaticamente (como menu flutuante, lixeira e componentes registrados pelo usuário). | |
highlightBlock(id, opt_state) | Destaque ou remova o destaque de um bloco no espaço de trabalho. O destaque de blocos é usado com frequência para marcar visualmente os blocos em execução. | |
isDraggable() | Este espaço de trabalho pode ser arrastado? | |
isDragging() | Retorna "true" se o usuário estiver fazendo um gesto de arrastar ou se um movimento iniciado pelo teclado estiver em andamento. Os gestos de arrastar normalmente envolvem mover um bloco ou outro item no espaço de trabalho ou rolar o submenu/espaço de trabalho. Os movimentos iniciados pelo teclado são implementados usando a infraestrutura de arrasto e têm como objetivo emular (um subconjunto de) gestos de arrasto. Portanto, eles geralmente devem ser tratados como se fossem um arrasto baseado em gestos. |
|
isMovable() | Este espaço de trabalho pode ser movido? Isso significa que o usuário pode reposicionar as coordenadas X e Y do espaço de trabalho por entrada. Isso pode ser feito usando barras de rolagem, roda de rolagem, arrastando ou aplicando zoom com a roda de rolagem ou o gesto de pinça (já que o zoom é centralizado na posição do mouse). Isso não inclui o zoom com os controles de zoom, já que as coordenadas X e Y são decididas de forma programática. |
|
isMovableHorizontally() | Este espaço de trabalho pode ser movido horizontalmente? | |
isMovableVertically() | Esse espaço de trabalho pode ser movido verticalmente? | |
isVisible() | Getter para isVisible | |
lookUpFocusableNode(id) | Consulte IFocusableTree.lookUpFocusableNode. | |
markFocused() | Marque este espaço de trabalho como o principal em foco no momento. | |
moveDrag(e) | Rastreia o arrastar de um objeto neste espaço de trabalho. | |
newBlock(prototypeName, opt_id) | Receba um bloco recém-criado. | |
newComment(id) | Receba um comentário recém-criado. | |
onNodeBlur() | Consulte IFocusableNode.onNodeBlur. | |
onNodeFocus() | Consulte IFocusableNode.onNodeFocus. | |
onTreeBlur(nextTree) | Consulte IFocusableTree.onTreeBlur. | |
onTreeFocus(_node, _previousTree) | Consulte IFocusableTree.onTreeFocus. | |
recordDragTargets() | Faça uma lista de todas as áreas de exclusão para esse espaço de trabalho. | |
refreshTheme() | Atualize todos os blocos no espaço de trabalho após uma atualização de tema. | |
registerButtonCallback(key, func) | Registre uma função de callback associada a uma determinada chave para cliques em botões e rótulos no submenu flutuante. Por exemplo, um botão especificado pelo XML precisa ser correspondido por uma chamada para registerButtonCallback("CREATE_VARIABLE", yourCallbackFunction). | |
registerToolboxCategoryCallback(key, func) | Registre uma função de callback associada a uma determinada chave para preencher categorias personalizadas da caixa de ferramentas neste espaço de trabalho. Confira as categorias de variáveis e procedimentos como exemplo. | |
removeButtonCallback(key) | Remove um callback para um clique em um botão no submenu flutuante. | |
removeClass(className) | Remove uma classe CSS do espaço de trabalho. | |
removeToolboxCategoryCallback(key) | Remove uma função de callback para um clique no nome de uma categoria personalizada na caixa de ferramentas. | |
removeTopBlock(block) | Remove um bloco da lista de blocos principais. | |
removeTopBoundedElement(element) | Remove um elemento limitado da lista de elementos limitados principais. | |
removeTopComment(comment) | Remove um comentário da lista dos principais comentários. | |
render() | Renderiza todos os blocos no espaço de trabalho. | |
resize() | Redimensionar e reposicionar todo o cromo do espaço de trabalho (caixa de ferramentas, lixeira, barras de rolagem etc.) Isso deve ser chamado quando algo muda e exige o recálculo das dimensões e posições da lixeira, do zoom, da caixa de ferramentas etc. (por exemplo, redimensionamento da janela). | |
scroll(x, y) | Role o espaço de trabalho até um deslocamento especificado (em pixels), mantendo-o dentro dos limites. Consulte o comentário em workspaceSvg.scrollX para mais detalhes sobre o significado desses valores. | |
scrollCenter() | Centralize o espaço de trabalho. | |
setIsReadOnly(readOnly) | ||
setNavigator(newNavigator) | Define a instância do navegador usada por este espaço de trabalho. | |
setResizeHandlerWrapper(handler) | Salva dados do manipulador de redimensionamento para que possamos excluí-los mais tarde na exclusão. | |
setResizesEnabled(enabled) | Atualiza se o redimensionamento está ativado neste espaço de trabalho. Se ativado, o espaço de trabalho será redimensionado quando necessário. Se desativado, o espaço de trabalho não será redimensionado até ser reativado. Usado para evitar o redimensionamento durante uma operação em lote, para melhorar o desempenho. | |
setScale(newScale) | Define o fator de zoom do espaço de trabalho. | |
setTheme(theme) | Defina o objeto de tema do espaço de trabalho. Se nenhum tema for transmitido, o padrão será o tema Classic . |
|
setVisible(isVisible) | Alterna a visibilidade do espaço de trabalho. No momento, destinado apenas ao espaço de trabalho principal. | |
startDrag(e, xy) | Começa a rastrear a ação de arrastar um objeto neste espaço de trabalho. | |
translate(x, y) | Traduzir este espaço de trabalho para novas coordenadas. | |
updateInverseScreenCTM() | Marque o CTM da tela inversa como sujo. | |
updateToolbox(toolboxDef) | Modifique a árvore de blocos na caixa de ferramentas atual. | |
zoom(x, y, amount) | Aumenta ou diminui o zoom do espaço de trabalho em relação à coordenada (x, y) especificada ou centralizada nela. | |
zoomCenter(type) | Aumentar ou diminuir o zoom dos blocos centralizados no centro da visualização. | |
zoomToFit() | Aumente o zoom nos blocos para que eles caibam no espaço de trabalho, se possível. |