blockly > WorkspaceSvg

Clase WorkspaceSvg

Es la clase de un espacio de trabajo. Es un área en pantalla con un ícono de papelera, barras de desplazamiento, burbujas y arrastre opcionales.

Signature:

export declare class WorkspaceSvg extends Workspace implements IContextMenu, IFocusableNode, IFocusableTree 

Se extiende a: Workspace

Implementa: IContextMenu, IFocusableNode, IFocusableTree

Constructores

Constructor	Modificadores	Descripción
(constructor)(options)		Construye una instancia nueva de la clase WorkspaceSvg.

Propiedades

Propiedad	Modificadores	Tipo	Descripción
configureContextMenu		((menuOptions: ContextMenuOption[], e: Event) => void) | null	Los desarrolladores pueden definir esta función para agregar opciones de menú personalizadas al menú contextual del espacio de trabajo o editar el conjunto de opciones de menú creado por el espacio de trabajo.
keyboardAccessibilityMode		booleano	Es verdadero si el modo de accesibilidad del teclado está activado; de lo contrario, es falso.
keyboardMoveInProgress		booleano	Es verdadero si hay un movimiento iniciado por el teclado ("arrastrar") en curso.
renderizado		booleano	Es el estado de renderización de un espacio de trabajo SVG. Muestra false para espacios de trabajo sin interfaz gráfica y verdadero para instancias de WorkspaceSvg.
escala		número	Escala actual.
scrollbar		ScrollbarPair | null	Las barras de desplazamiento de este espacio de trabajo, si existen
scrollX		número	Es el desplazamiento horizontal actual del desplazamiento en unidades de píxeles, en relación con el origen del lugar de trabajo. Es útil pensar en una vista y un lienzo que se mueve debajo de ella. A medida que el lienzo se mueve hacia la derecha, este valor se vuelve más positivo y la vista ahora "ve" el lado izquierdo del lienzo. A medida que el lienzo se mueve hacia la izquierda, este valor se vuelve más negativo y la vista ahora “ve” el lado derecho del lienzo. Lo que resulta confuso de este valor es que no incluye el desplazamiento absoluteLeft ni debe hacerlo. Esto se debe a que se usa para calcular el valor de viewLeft. viewLeft es relativo al origen del espacio de trabajo (aunque en unidades de píxeles). El origen del espacio de trabajo es la esquina superior izquierda del espacio de trabajo (al menos cuando está habilitado). Se desplaza desde la parte superior izquierda de blocklyDiv para no estar debajo de la caja de herramientas. Cuando se habilita el espacio de trabajo, el origen de viewLeft y el del espacio de trabajo se encuentran en la misma ubicación X. A medida que el lienzo se desliza hacia la derecha debajo de la vista, este valor (scrollX) se vuelve más positivo y viewLeft se vuelve más negativo en relación con el origen del espacio de trabajo (imagina el origen del espacio de trabajo como un punto en el lienzo que se desliza hacia la derecha a medida que se mueve). Por lo tanto, si scrollX incluyera absoluteLeft, de alguna manera, “no cambiaría” el origen del lugar de trabajo. Esto significa que viewLeft representaría el borde izquierdo de blocklyDiv, en lugar del borde izquierdo del espacio de trabajo.
scrollY		número	Es el desplazamiento vertical actual en unidades de píxeles, en relación con el origen del lugar de trabajo. Es útil pensar en una vista y un lienzo que se mueve debajo de ella. A medida que el lienzo se mueve hacia abajo, este valor se vuelve más positivo y la vista ahora "ve" la parte superior del lienzo. A medida que el lienzo se mueve hacia arriba, este valor se vuelve más negativo y la vista “ve” la parte inferior del lienzo. Lo que genera confusión sobre este valor es que no incluye el desplazamiento de absoluteTop ni debe hacerlo. Esto se debe a que se usa para calcular el valor de viewTop. viewTop es relativo al origen del lugar de trabajo (aunque en unidades de píxeles). El origen del espacio de trabajo es la esquina superior izquierda del espacio de trabajo (al menos cuando está habilitado). Se desplaza desde la parte superior izquierda de blocklyDiv para no estar debajo de la caja de herramientas. Cuando el lugar de trabajo está habilitado, el origen de viewTop y el lugar de trabajo se encuentran en la misma ubicación Y. A medida que el lienzo se desliza hacia la parte inferior, este valor (scrollY) se vuelve más positivo y viewTop se vuelve más negativo en relación con el origen del espacio de trabajo (imagen en el origen del espacio de trabajo como un punto en el lienzo que se desliza hacia abajo a medida que se mueve). Por lo tanto, si scrollY incluyera absoluteTop, de alguna manera, “desplazaría” el origen del lugar de trabajo. Esto significa que viewTop representaría el borde superior de blocklyDiv, en lugar del borde superior del espacio de trabajo.
startScrollX		número	Es el valor de desplazamiento horizontal cuando se inició el desplazamiento en unidades de píxeles.
startScrollY		número	Es el valor de desplazamiento vertical cuando se inició el desplazamiento en unidades de píxeles.
svgBackground_		SVGElement
svgBlockCanvas_		SVGElement
svgBubbleCanvas_		SVGElement
svgGroup_		SVGElement
themeManager_	protected	ThemeManager
basurero		Papelera | nulo	El contenedor de basura del espacio de trabajo (si corresponde)
zoomControls_		ZoomControls | null

Métodos

Método	Modificadores	Descripción
addClass(className)		Agrega una clase CSS al espacio de trabajo.
addTopBlock(block)		Agrega un bloque a la lista de bloques superiores.
addTopBoundedElement(element)		Agrega un elemento limitado a la lista de elementos limitados superiores.
addTopComment(comment)		Agrega un comentario a la lista de comentarios principales.
canBeFocused()		Consulta IFocusableNode.canBeFocused.
centerOnBlock(id, blockOnly)		Desplázate por el lugar de trabajo para centrarte en el bloque determinado. Si el bloque tiene otros bloques apilados debajo, el espacio de trabajo se centrará en la pila, a menos que blockOnly sea verdadero.
cleanUp()		Ordena todos los bloques en una columna para que no se superpongan y ordena el espacio de trabajo.
clear()		Elimina todos los bloques del lugar de trabajo, con una optimización para evitar cambios de tamaño.
copyOptionsForFlyout()		Crea un nuevo conjunto de opciones a partir de las opciones de este lugar de trabajo con solo los valores relevantes para un menú flotante.
createDom(opt_backgroundClass, injectionDiv)		Crea los elementos DOM del lugar de trabajo.
dispose()		Eliminar este lugar de trabajo Desvincula todos los elementos DOM para evitar fugas de memoria.
getAbsoluteScale()		Muestra la escala absoluta del espacio de trabajo. El escalamiento de Workspace es multiplicativo. Si un lugar de trabajo B (p. ej., un editor de mutador) con escala Y está anidado en un lugar de trabajo raíz A con escala X, la escala efectiva del lugar de trabajo B es X * Y, ya que, como elemento secundario de A, ya está transformado por el factor de escalamiento de A y, luego, se transforma aún más por su propio factor de escalamiento. Por lo general, esto funciona, pero para los elementos globales (p.ej., editores de campo) que están asociados visualmente con un espacio de trabajo en particular, pero se encuentran en el nivel superior del DOM en lugar de ser elementos secundarios de su espacio de trabajo asociado, es posible que se necesite la escala absoluta o efectiva para renderizarlos de forma adecuada.
getAllBlocks(ordered)		Busca todos los bloques en el lugar de trabajo. De manera opcional, los bloques se ordenan por posición, de arriba abajo (con una ligera preferencia por LTR o RTL).
getAudioManager()		Obtén el administrador de audio para este lugar de trabajo.
getBlockById(id)		Busca el bloque en este lugar de trabajo con el ID especificado.
getBlocksBoundingBox()		Calcula el cuadro de límite de los bloques en el espacio de trabajo. Sistema de coordenadas: Coordenadas del lugar de trabajo.
getBubbleCanvas()		Obtén el elemento SVG que forma la superficie de la burbuja.
getButtonCallback(key)		Obtén la función de devolución de llamada asociada con una clave determinada para los clics en los botones y las etiquetas del menú flotante.
getCanvas()		Obtén el elemento SVG que forma la superficie de dibujo.
getComponentManager()		Obtiene el administrador de componentes de este lugar de trabajo.
getCursor()		El cursor de este lugar de trabajo.
getDragTarget(e)		Devuelve el destino de arrastre sobre el que se encuentra el evento del puntero.
getFlyout(opt_own)		Es un método get para el menú flotante asociado con este espacio de trabajo. Este menú flotante puede ser propiedad de la caja de herramientas o del espacio de trabajo, según la configuración de la caja de herramientas. Será nulo si no hay un menú flotante.
getFocusableElement()		Consulta IFocusableNode.getFocusableElement.
getFocusableTree()		Consulta IFocusableNode.getFocusableTree.
getGrid()		Obtén el objeto de cuadrícula para este lugar de trabajo o nulo si no hay ninguno.
getInverseScreenCTM()		Es el método get para el CTM de la pantalla invertida.
getMarkerManager()		Obtén el administrador de marcadores de este lugar de trabajo.
getMetricsManager()		Obtiene el administrador de métricas de este lugar de trabajo.
getNavigator()		Muestra un objeto responsable de coordinar el movimiento del enfoque entre los elementos de este espacio de trabajo en respuesta a los comandos de navegación del teclado.
getNestedTrees()		Consulta IFocusableTree.getNestedTrees.
getParentSvg()		Obtén el elemento SVG que contiene este lugar de trabajo. Nota: Suponemos que solo se llama a esta función después de que el espacio de trabajo se haya insertado en el DOM.
getRenderer()		Obtén el renderizador de bloques adjunto a este lugar de trabajo.
getRestoredFocusableNode(previousNode)		Consulta IFocusableTree.getRestoredFocusableNode.
getRootFocusableNode()		Consulta IFocusableTree.getRootFocusableNode.
getRootWorkspace()
getScale()		Obtén el factor de zoom del espacio de trabajo.
getSvgGroup()		Devuelve el grupo SVG del espacio de trabajo.
getTheme()		Obtén el objeto del tema del lugar de trabajo.
getToolbox()		Obtiene la caja de herramientas asociada con este espacio de trabajo, si existe una.
getToolboxCategoryCallback(key)		Obtén la función de devolución de llamada asociada con una clave determinada para propagar categorías de toolbox personalizadas en este lugar de trabajo.
getTopBlocks(ordered)		Busca los bloques de nivel superior y los muestra. De manera opcional, los bloques se ordenan por posición, de arriba abajo (con una ligera preferencia por LTR o RTL).
getTopBoundedElements()		Busca los elementos delimitados de nivel superior y los muestra.
getWidth()		Muestra el desplazamiento horizontal del lugar de trabajo. Se diseñó para la compatibilidad con LTR/RTL en XML.
hideChaff(onlyClosePopups)		Cerrar las herramientas de ayuda, los menús contextuales, las selecciones de menús desplegables, etcétera
hideComponents(onlyClosePopups)		Oculta los componentes que se pueden ocultar automáticamente (como el menú flotante, el ícono de papelera y cualquier componente registrado por el usuario).
highlightBlock(id, opt_state)		Destacar o desmarcar un bloque en el espacio de trabajo El resaltado de bloques suele usarse para marcar visualmente los bloques que se están ejecutando.
isDraggable()		¿Se puede arrastrar este lugar de trabajo?
isDragging()		Muestra verdadero si el usuario está realizando un gesto de arrastre o si hay un movimiento iniciado por el teclado en curso. Los gestos de arrastre suelen implicar mover un bloque o algún otro elemento del lugar de trabajo, o bien desplazar el menú flotante o el lugar de trabajo. Los movimientos iniciados por el teclado se implementan con la infraestructura de arrastre y están diseñados para emular (un subconjunto de) gestos de arrastre, por lo que, por lo general, se deben tratar como si fueran un arrastre basado en gestos.
isMovable()		¿Se puede mover este lugar de trabajo? Esto significa que el usuario puede cambiar la posición de las coordenadas X Y del espacio de trabajo a través de la entrada. Esto se puede hacer con las barras de desplazamiento, la rueda del mouse, el arrastre o el zoom con la rueda del mouse o el pellizco (ya que el zoom se centra en la posición del mouse). Esto no incluye el zoom con los controles de zoom, ya que las coordenadas X Y se deciden de forma programática.
isMovableHorizontally()		¿Se puede mover horizontalmente este lugar de trabajo?
isMovableVertically()		¿Se puede mover verticalmente este lugar de trabajo?
isVisible()		Método get para isVisible
lookUpFocusableNode(id)		Consulta IFocusableTree.lookUpFocusableNode.
markFocused()		Marca este espacio de trabajo como el espacio de trabajo principal enfocado actualmente.
moveDrag(e)		Hacer un seguimiento del arrastre de un objeto en este espacio de trabajo
newBlock(prototypeName, opt_id)		Obtén un bloque recién creado.
newComment(id)		Obtén un comentario recién creado.
onNodeBlur()		Consulta IFocusableNode.onNodeBlur.
onNodeFocus()		Consulta IFocusableNode.onNodeFocus.
onTreeBlur(nextTree)		Consulta IFocusableTree.onTreeBlur.
onTreeFocus(_node, _previousTree)		Consulta IFocusableTree.onTreeFocus.
recordDragTargets()		Haz una lista de todas las áreas de eliminación de este lugar de trabajo.
refreshTheme()		Actualiza todos los bloques del lugar de trabajo después de actualizar un tema.
registerButtonCallback(key, func)		Registra una función de devolución de llamada asociada con una clave determinada para los clics en los botones y las etiquetas del menú flotante. Por ejemplo, un botón especificado por el XML debe coincidir con una llamada a registerButtonCallback("CREATE_VARIABLE", yourCallbackFunction).
registerToolboxCategoryCallback(key, func)		Registra una función de devolución de llamada asociada con una clave determinada para propagar categorías de toolbox personalizadas en este lugar de trabajo. Consulta las categorías de variables y procedimientos como ejemplo.
removeButtonCallback(key)		Quita una devolución de llamada para un clic en un botón del menú flotante.
removeClass(className)		Quita una clase CSS del espacio de trabajo.
removeToolboxCategoryCallback(key)		Se quitó una devolución de llamada para un clic en el nombre de una categoría personalizada en la caja de herramientas.
removeTopBlock(block)		Quita un bloque de la lista de bloques principales.
removeTopBoundedElement(element)		Quita un elemento limitado de la lista de elementos limitados superiores.
removeTopComment(comment)		Quita un comentario de la lista de comentarios principales.
render()		Renderiza todos los bloques en el espacio de trabajo.
resize()		Cambiar el tamaño y la posición de todo el espacio de trabajo de Chrome (caja de herramientas, papelera, barras de desplazamiento, etc.) Se debe llamar a esta función cuando se produce un cambio que requiere volver a calcular las dimensiones y posiciones de la papelera, el zoom, la caja de herramientas, etc. (p.ej., el cambio de tamaño de la ventana).
scroll(x, y)		Desplázate por el lugar de trabajo hasta un desplazamiento especificado (en píxeles) y mantén los límites del lugar de trabajo. Consulta el comentario sobre workspaceSvg.scrollX para obtener más detalles sobre el significado de estos valores.
scrollCenter()		Centra el lugar de trabajo.
setIsReadOnly(readOnly)
setNavigator(newNavigator)		Establece la instancia de Navigator que usa este espacio de trabajo.
setResizeHandlerWrapper(handler)		Guarda los datos del controlador de cambio de tamaño para que podamos borrarlos más adelante en la eliminación.
setResizesEnabled(enabled)		Actualiza si este espacio de trabajo tiene habilitado el cambio de tamaño. Si está habilitado, el espacio de trabajo cambiará de tamaño cuando corresponda. Si se inhabilita, el espacio de trabajo no cambiará de tamaño hasta que se vuelva a habilitar. Se usa para evitar el cambio de tamaño durante una operación por lotes, para mejorar el rendimiento.
setScale(newScale)		Establece el factor de zoom del espacio de trabajo.
setTheme(theme)		Establece el objeto del tema del espacio de trabajo. Si no se pasa ningún tema, se usará el tema Classic de forma predeterminada.
setVisible(isVisible)		Activa o desactiva la visibilidad del lugar de trabajo. Actualmente, solo está disponible para el espacio de trabajo principal.
startDrag(e, xy)		Comienza a hacer un seguimiento del arrastre de un objeto en este lugar de trabajo.
translate(x, y)		Traduce este espacio de trabajo a coordenadas nuevas.
updateInverseScreenCTM()		Marca la CTM de la pantalla inversa como sucia.
updateToolbox(toolboxDef)		Modifica el árbol de bloques de la caja de herramientas existente.
zoom(x, y, cantidad)		Acerca o aleja el espacio de trabajo en relación con la coordenada (x, y) dada o centrada en ella.
zoomCenter(type)		Acerca o aleja los bloques centrados en el centro de la vista.
zoomToFit()		Acerca los bloques para que se ajusten al espacio de trabajo si es posible.