blockly > Caja de herramientas

Clase Toolbox

Clase para una caja de herramientas. Crea el DOM de la caja de herramientas.

Signature:

export declare class Toolbox extends DeleteArea implements IAutoHideable, IKeyboardAccessible, IStyleable, IToolbox, IFocusableNode 

Extends: DeleteArea

Implementa: IAutoHideable, IKeyboardAccessible, IStyleable, IToolbox, IFocusableNode

Constructores

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

Propiedades

Propiedad	Modificadores	Tipo	Descripción
boundEvents_	protected	browserEvents.Data[]	Es un array que contiene la información necesaria para desvincular los controladores de eventos. Se usa para desechar. Ej.: [[nodo, nombre, función], [nodo, nombre, función]].
contents	protected	Map<string, IToolboxItem>	Mapa del ID al elemento de la caja de herramientas correspondiente.
contentsDiv_	protected	HTMLDivElement | null	Es el contenedor HTML para el contenido de una caja de herramientas.
height_	protected	número	Es la altura de la caja de herramientas.
HtmlDiv		HTMLDivElement | null	Es el contenedor HTML de la caja de herramientas.
id		string	Es el ID único de este componente que se usa para registrarse en ComponentManager.
isVisible_	protected	booleano	Indica si la caja de herramientas está visible.
previouslySelectedItem_	protected	ISelectableToolboxItem | null	Es el elemento seleccionado anteriormente.
RTL		booleano
selectedItem_	protected	ISelectableToolboxItem | null	Es el elemento seleccionado actualmente.
toolboxDef_	protected	toolbox.ToolboxInfo
toolboxPosition		toolbox.Position
width_	protected	número	Es el ancho de la caja de herramientas.
workspace_	protected readonly	WorkspaceSvg	Es el espacio de trabajo en el que se encuentra esta caja de herramientas.

Métodos

Método	Modificadores	Descripción
addToolboxItem_(toolboxItem)	protected	Agrega un elemento a la caja de herramientas.
attachEvents_(container, contentsContainer)	protected	Agrega objetos de escucha de eventos al div del contenedor de la caja de herramientas.
autoHide(onlyClosePopups)		Oculta el componente. Se llama en WorkspaceSvg.hideChaff.
canBeFocused()		Consulta IFocusableNode.canBeFocused.
clearSelection()		Quita el resaltado de cualquier elemento seleccionado anteriormente.
createContainer_()	protected	Crea el div del contenedor para la caja de herramientas.
createContentsContainer_()	protected	Crea el contenedor para todo el contenido de la caja de herramientas.
createDom_(workspace)	protected	Crea el DOM para la caja de herramientas.
createFlyout_()	protected	Crea el menú desplegable en función del diseño de la caja de herramientas.
deselectItem_(item)	protected	Anula la selección del elemento determinado, lo marca como no seleccionado y actualiza el estado de aria.
dispose()		Descarta esta caja de herramientas.
getClientRect()		Devuelve el rectángulo delimitador del área de destino de arrastre en unidades de píxeles relativas a la ventana gráfica.
getFlyout()		Obtiene el menú desplegable de la caja de herramientas.
getFocusableElement()		Consulta IFocusableNode.getFocusableElement.
getFocusableTree()		Consulta IFocusableNode.getFocusableTree.
getHeight()		Obtiene la altura de la caja de herramientas.
getNestedTrees()		Consulta IFocusableTree.getNestedTrees.
getPreviouslySelectedItem()		Obtiene el elemento seleccionado anteriormente.
getRestoredFocusableNode(previousNode)		Consulta IFocusableTree.getRestoredFocusableNode.
getRootFocusableNode()		Consulta IFocusableTree.getRootFocusableNode.
getSelectedItem()		Obtiene el elemento seleccionado.
getToolboxItemById(id)		Obtiene el elemento de la caja de herramientas con el ID determinado.
getToolboxItems()		Obtiene los elementos de la caja de herramientas.
getWidth()		Obtiene el ancho de la caja de herramientas.
getWorkspace()		Obtiene el espacio de trabajo de la caja de herramientas.
init()		Inicializa la caja de herramientas.
isHorizontal()		Obtiene si la caja de herramientas es horizontal o no.
lookUpFocusableNode(id)		Consulta IFocusableTree.lookUpFocusableNode.
onClick_(e)	protected	Controla los eventos de clic cuando se hace clic en la caja de herramientas o en sus elementos.
onDragEnter(_dragElement)		Controla cuando un cursor con un bloque o una burbuja ingresa en este destino de arrastre.
onDragExit(_dragElement)		Controla cuando un cursor con un bloque o una burbuja sale de este destino de arrastre.
onDrop(_dragElement)		Controla cuando se suelta un bloque o una burbuja en este componente. No debe controlar la eliminación aquí.
onKeyDown_(e)	protected	Controla los eventos de tecla presionada para la caja de herramientas.
onNodeBlur()		Consulta IFocusableNode.onNodeBlur.
onNodeFocus()		Consulta IFocusableNode.onNodeFocus.
onShortcut(_shortcut)		Controla la combinación de teclas determinada.
onTreeBlur(nextTree)		Consulta IFocusableTree.onTreeBlur.
onTreeFocus(node, _previousTree)		Consulta IFocusableTree.onTreeFocus.
position()		Coloca la caja de herramientas según si es horizontal y si el espacio de trabajo está en RTL.
refreshSelection()		Actualiza el contenido del menú desplegable sin cerrarlo. Se debe usar en respuesta a un cambio en una de las categorías dinámicas, como variables o procedimientos.
renderContents_(toolboxDef)	protected	Agrega todos los elementos a la caja de herramientas.
selectItem_(oldItem, newItem)	protected	Selecciona el elemento determinado, lo marca como seleccionado y actualiza el estado de aria.
selectItemByPosition(position)		Selecciona el elemento de la caja de herramientas por su posición en la lista de elementos de la caja de herramientas.
setSelectedItem(newItem)		Establece el elemento determinado como seleccionado. No funcionará si el elemento no se puede seleccionar.
setVisible(isVisible)		Muestra u oculta la caja de herramientas.
shouldDeselectItem_(oldItem, newItem)	protected	Decide si se debe anular la selección del elemento anterior.
shouldSelectItem_(oldItem, newItem)	protected	Decide si se debe seleccionar el elemento nuevo.
updateCursorDeleteStyle_(addStyle)	protected	Agrega o quita el estilo CSS del cursor sobre la caja de herramientas según si se espera que se borre el bloque o la burbuja que se encuentra sobre él si se suelta (con la propiedad interna this.wouldDelete_).
updateFlyout_(oldItem, newItem)	protected	Decide si se debe ocultar o mostrar el menú desplegable según el elemento seleccionado.
updateWouldDelete_(wouldDelete)	protected	Actualiza el estado interno wouldDelete_.
wouldDelete(element)		Devuelve si el bloque o la burbuja proporcionados se borrarían si se soltaran en esta área. Este método debe verificar si el elemento se puede borrar y siempre se llama antes de onDragEnter/onDragOver/onDragExit.