blockly > WorkspaceSvg

Classe WorkspaceSvg

Cours pour un espace de travail. Il s'agit d'une zone à l'écran avec une corbeille, des barres de défilement, des bulles et une fonctionnalité de glisser-déposer (tous facultatifs).

Signature :

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

Étendre : Workspace

Implémente : IContextMenu, IFocusableNode, IFocusableTree

Constructeurs

Constructeur	Modificateurs	Description
(constructeur)(options)		Construit une instance de la classe WorkspaceSvg.

Propriétés

Propriété	Modificateurs	Type	Description
configureContextMenu		((menuOptions: ContextMenuOption[], e: Event) => void) | null	Les développeurs peuvent définir cette fonction pour ajouter des options de menu personnalisées au menu contextuel de l'espace de travail ou modifier l'ensemble d'options de menu créé par l'espace de travail.
keyboardAccessibilityMode		booléen	"True" si le mode d'accessibilité au clavier est activé, "false" dans le cas contraire.
keyboardMoveInProgress		booléen	Vrai si un déplacement ("glisser") initié au clavier est en cours.
rendered		booléen	État du rendu d'un espace de travail SVG. Renvoie false pour les espaces de travail sans interface graphique et "true" pour les instances de WorkspaceSvg.
échelle		Total	Échelle actuelle.
scrollbar		ScrollbarPair | null	Barres de défilement de cet espace de travail, le cas échéant.
scrollX		Total	Décalage de défilement horizontal actuel en pixels, par rapport à l'origine de l'espace de travail. Il est utile de penser à une vue et à un canevas qui se déplace sous cette vue. À mesure que le canevas se déplace vers la droite, cette valeur devient plus positive et la vue "voit" désormais le côté gauche du canevas. À mesure que le canevas se déplace vers la gauche, cette valeur devient plus négative et la vue "voit" désormais le côté droit du canevas. La valeur de cette propriété est déroutante, car elle n'inclut pas le décalage absoluteLeft et ne doit pas l'inclure. En effet, elle permet de calculer la valeur viewLeft. La valeur viewLeft est relative à l'origine de l'espace de travail (bien qu'elle soit exprimée en pixels). L'origine de l'espace de travail correspond à l'angle supérieur gauche de l'espace de travail (au moins lorsqu'il est activé). Il est décalé par rapport au coin supérieur gauche de blocklyDiv pour ne pas se trouver sous la boîte à outils. Lorsque l'espace de travail est activé, l'origine viewLeft et l'origine de l'espace de travail se trouvent au même emplacement X. À mesure que le canevas glisse vers la droite sous la vue, cette valeur (scrollX) devient plus positive et viewLeft devient plus négative par rapport à l'origine de l'espace de travail (imaginez l'origine de l'espace de travail comme un point sur le canevas qui glisse vers la droite à mesure que le canevas se déplace). Ainsi, si scrollX devait inclure absoluteLeft, cela "décalerait" en quelque sorte l'origine de l'espace de travail. Cela signifie que viewLeft représenterait le bord gauche de blocklyDiv, et non celui de l'espace de travail.
scrollY		Total	Décalage de défilement vertical actuel en pixels, par rapport à l'origine de l'espace de travail. Il est utile de penser à une vue et à un canevas qui se déplace sous cette vue. À mesure que le canevas se déplace vers le bas, cette valeur devient plus positive et la vue "voit" désormais la partie supérieure du canevas. À mesure que le canevas se déplace vers le haut, cette valeur devient plus négative et la vue "voit" la partie inférieure du canevas. La valeur de "absoluteTop" est déroutante, car elle n'inclut pas le décalage "absoluteTop" et ne doit pas l'inclure. En effet, elle est utilisée pour calculer la valeur viewTop. La valeur viewTop est relative à l'origine de l'espace de travail (bien qu'elle soit exprimée en pixels). L'origine de l'espace de travail correspond à l'angle supérieur gauche de l'espace de travail (au moins lorsqu'il est activé). Il est décalé par rapport au coin supérieur gauche de blocklyDiv pour ne pas se trouver sous la boîte à outils. Lorsque l'espace de travail est activé, l'origine viewTop et l'origine de l'espace de travail se trouvent à la même position Y. À mesure que le canevas glisse vers le bas, cette valeur (scrollY) devient plus positive et viewTop devient plus négative par rapport à l'origine de l'espace de travail (l'image dans l'origine de l'espace de travail est un point sur le canevas qui glisse vers le bas à mesure que le canevas se déplace). Ainsi, si scrollY devait inclure absoluteTop, cela "décalerait" en quelque sorte l'origine de l'espace de travail. Cela signifie que viewTop représenterait le bord supérieur de blocklyDiv, et non celui de l'espace de travail.
startScrollX		Total	Valeur de défilement horizontal au début du défilement, en pixels.
startScrollY		Total	Valeur de défilement vertical au début du défilement, en pixels.
svgBackground_		SVGElement
svgBlockCanvas_		SVGElement
svgBubbleCanvas_		SVGElement
svgGroup_		SVGElement
themeManager_	protected	ThemeManager
poubelle		Trashcan | null	Corbeille de l'espace de travail (le cas échéant).
zoomControls_		ZoomControls | null

Méthodes

Méthode	Modificateurs	Description
addClass(className)		Ajoute une classe CSS à l'espace de travail.
addTopBlock(block)		Ajoute un bloc à la liste des blocs principaux.
addTopBoundedElement(element)		Ajoute un élément limité à la liste des éléments limités les plus élevés.
addTopComment(comment)		Ajoute un commentaire à la liste des meilleurs commentaires.
canBeFocused()		Consultez IFocusableNode.canBeFocused.
centerOnBlock(id, blockOnly)		Faites défiler l'espace de travail pour centrer le bloc donné. Si le bloc comporte d'autres blocs empilés en dessous, l'espace de travail sera centré sur la pile, sauf si blockOnly est défini sur "true".
cleanUp()		Nettoyez l'espace de travail en ordonnant tous les blocs d'une colonne de sorte qu'aucun ne se chevauche.
clear()		Supprime tous les blocs de l'espace de travail, avec une optimisation pour éviter les redimensionnements.
copyOptionsForFlyout()		Crée un ensemble d'options à partir des options de cet espace de travail, avec uniquement les valeurs pertinentes pour un menu déroulant.
createDom(opt_backgroundClass, injectionDiv)		Créez les éléments DOM de l'espace de travail.
dispose()		Supprimez cet espace de travail. Dissociez-le de tous les éléments DOM pour éviter les fuites de mémoire.
getAbsoluteScale()		Renvoie l'échelle absolue de l'espace de travail. La mise à l'échelle de l'espace de travail est multiplicative.Si un espace de travail B (par exemple, un éditeur de mutateur) avec une échelle Y est imbriqué dans un espace de travail racine A avec une échelle X, l'échelle effective de l'espace de travail B est X * Y. En effet, en tant qu'enfant de A, il est déjà transformé par le facteur de mise à l'échelle de A, puis se transforme lui-même par son propre facteur de mise à l'échelle. Normalement, cela fonctionne, mais pour les éléments globaux (par exemple, les éditeurs de champs) qui sont visuellement associés à un espace de travail particulier, mais qui se trouvent au niveau supérieur du DOM plutôt que d'être un enfant de leur espace de travail associé, l'échelle absolue/effective peut être nécessaire pour un rendu approprié.
getAllBlocks(ordered)		Rechercher tous les blocs dans l'espace de travail. Les blocs sont éventuellement triés par position, de haut en bas (avec un léger biais LTR ou RTL).
getAudioManager()		Obtenez le gestionnaire audio pour cet espace de travail.
getBlockById(id)		Recherchez le bloc dans cet espace de travail avec l'ID spécifié.
getBlocksBoundingBox()		Calculez le cadre de délimitation des blocs dans l'espace de travail. Système de coordonnées : coordonnées de l'espace de travail.
getBubbleCanvas()		Récupérez l'élément SVG qui forme la surface de la bulle.
getButtonCallback(key)		Obtenez la fonction de rappel associée à une clé donnée pour les clics sur les boutons et les libellés du menu déroulant.
getCanvas()		Obtenez l'élément SVG qui forme la surface de dessin.
getCommentById(id)		Renvoie le commentaire de l'espace de travail avec l'ID donné, le cas échéant.
getComponentManager()		Récupère le gestionnaire de composants pour cet espace de travail.
getCursor()		Curseur pour cet espace de travail.
getDragTarget(e)		Renvoie la cible de déplacement sur laquelle se trouve l'événement de pointeur.
getFlyout(opt_own)		Getter pour le flyout associé à cet espace de travail. Ce menu déroulant peut appartenir à la boîte à outils ou à l'espace de travail, selon la configuration de la boîte à outils. Elle sera nulle si aucun menu volant n'est disponible.
getFocusableElement()		Consultez IFocusableNode.getFocusableElement.
getFocusableTree()		Consultez IFocusableNode.getFocusableTree.
getGrid()		Récupère l'objet grille pour cet espace de travail, ou la valeur null s'il n'y en a pas.
getInverseScreenCTM()		Getter pour la CTM de l'écran inversé.
getMarkerManager()		Obtenez le gestionnaire de repères pour cet espace de travail.
getMetricsManager()		Obtient le gestionnaire de métriques pour cet espace de travail.
getNavigator()		Renvoie un objet chargé de coordonner le déplacement de la sélection entre les éléments de cet espace de travail en réponse aux commandes de navigation au clavier.
getNestedTrees()		Consultez IFocusableTree.getNestedTrees.
getParentSvg()		Obtenez l'élément SVG qui contient cet espace de travail. Remarque : Nous supposons que cette méthode n'est appelée qu'une fois l'espace de travail injecté dans le DOM.
getRenderer()		Obtenez le moteur de rendu de bloc associé à cet espace de travail.
getRestoredFocusableNode(previousNode)		Voir IFocusableTree.getRestoredFocusableNode.
getRootFocusableNode()		Consultez IFocusableTree.getRootFocusableNode.
getRootWorkspace()
getScale()		Obtenez le facteur de zoom de l'espace de travail.
getSvgGroup()		Renvoie le groupe SVG pour l'espace de travail.
getTheme()		Obtenez l'objet de thème de l'espace de travail.
getToolbox()		Getter pour la boîte à outils associée à cet espace de travail, le cas échéant.
getToolboxCategoryCallback(key)		Obtenez la fonction de rappel associée à une clé donnée, pour remplir les catégories de la boîte à outils personnalisée dans cet espace de travail.
getTopBlocks(ordered)		Trouve les blocs de premier niveau et les renvoie. Les blocs sont éventuellement triés par position, de haut en bas (avec un léger biais LTR ou RTL).
getTopBoundedElements(ordered)		Recherche les éléments limités de premier niveau et les renvoie.
getTopComments(ordered)		Renvoie la liste des commentaires de cet espace de travail.
getWidth()		Renvoie le décalage horizontal de l'espace de travail. Destiné à la compatibilité LTR/RTL dans XML.
hideChaff(onlyClosePopups)		Fermer les info-bulles, les menus contextuels, les sélections de menus déroulants, etc.
hideComponents(onlyClosePopups)		Masquez tous les composants masquables automatiquement (comme les menus déroulants, la corbeille et tous les composants enregistrés par l'utilisateur).
highlightBlock(id, opt_state)		Mettez en surbrillance ou supprimez la mise en surbrillance d'un bloc dans l'espace de travail. La mise en surbrillance des blocs est souvent utilisée pour marquer visuellement les blocs en cours d'exécution.
isDraggable()		Cet espace de travail est-il déplaçable ?
isDragging()		Renvoie la valeur "true" si l'utilisateur est actuellement en train d'effectuer un geste de déplacement ou si un déplacement initié au clavier est en cours. Les gestes de déplacement impliquent normalement de déplacer un bloc ou un autre élément dans l'espace de travail, ou de faire défiler le menu déroulant/l'espace de travail. Les mouvements initiés au clavier sont implémentés à l'aide de l'infrastructure de déplacement et sont destinés à émuler (un sous-ensemble de) gestes de déplacement. Ils doivent donc généralement être traités comme s'il s'agissait d'un déplacement basé sur un geste.
isMovable()		Cet espace de travail est-il déplaçable ? Cela signifie que l'utilisateur peut repositionner les coordonnées X et Y de l'espace de travail à l'aide d'une entrée. Il peut s'agir de barres de défilement, de la molette de la souris, du glissement ou du zoom avec la molette de la souris ou le pincement (puisque le zoom est centré sur la position de la souris). Cela n'inclut pas le zoom avec les commandes de zoom, car les coordonnées X et Y sont décidées de manière programmatique.
isMovableHorizontally()		Cet espace de travail peut-il être déplacé horizontalement ?
isMovableVertically()		Cet espace de travail peut-il être déplacé verticalement ?
isVisible()		Getter pour isVisible
lookUpFocusableNode(id)		Consultez IFocusableTree.lookUpFocusableNode.
markFocused()		Marquez cet espace de travail comme espace de travail principal actuellement sélectionné.
moveDrag(e)		Suivez le déplacement d'un objet dans cet espace de travail.
newBlock(prototypeName, opt_id)		Obtenez un bloc nouvellement créé.
newComment(id)		Obtenez un commentaire nouvellement créé.
onNodeBlur()		Consultez IFocusableNode.onNodeBlur.
onNodeFocus()		Consultez IFocusableNode.onNodeFocus.
onTreeBlur(nextTree)		Consultez IFocusableTree.onTreeBlur.
onTreeFocus(_node, _previousTree)		Consultez IFocusableTree.onTreeFocus.
recordDragTargets()		Dresse la liste de toutes les zones de suppression pour cet espace de travail.
refreshTheme()		Actualisez tous les blocs de l'espace de travail après la mise à jour d'un thème.
registerButtonCallback(key, func)		Enregistrez une fonction de rappel associée à une clé donnée pour les clics sur les boutons et les libellés du menu déroulant. Par exemple, un bouton spécifié par le code XML doit correspondre à un appel à registerButtonCallback("CREATE_VARIABLE", yourCallbackFunction).
registerToolboxCategoryCallback(key, func)		Enregistrez une fonction de rappel associée à une clé donnée pour remplir les catégories de la boîte à outils personnalisée dans cet espace de travail. Consultez les catégories de variables et de procédures pour obtenir un exemple.
removeButtonCallback(key)		Supprime un rappel pour un clic sur un bouton du menu volant.
removeClass(className)		Supprime une classe CSS de l'espace de travail.
removeToolboxCategoryCallback(key)		Supprime un rappel pour un clic sur le nom d'une catégorie personnalisée dans la boîte à outils.
removeTopBlock(block)		Supprime un bloc de la liste des blocs les plus utilisés.
removeTopBoundedElement(element)		Supprime un élément limité de la liste des éléments les plus limités.
removeTopComment(comment)		Supprime un commentaire de la liste des meilleurs commentaires.
render()		Affichez tous les blocs de l'espace de travail.
resize()		Redimensionner et repositionner l'ensemble du chrome de l'espace de travail (barre d'outils, corbeille, barres de défilement, etc.) Cette méthode doit être appelée lorsqu'un élément change et nécessite de recalculer les dimensions et les positions de la corbeille, du zoom, de la boîte à outils, etc. (par exemple, le redimensionnement de la fenêtre).
scroll(x, y)		Faites défiler l'espace de travail jusqu'à un décalage spécifié (en pixels), en restant dans les limites de l'espace de travail. Pour en savoir plus sur la signification de ces valeurs, consultez le commentaire sur workspaceSvg.scrollX.
scrollCenter()		Centrez l'espace de travail.
setIsReadOnly(readOnly)
setNavigator(newNavigator)		Définit l'instance Navigator utilisée par cet espace de travail.
setResizeHandlerWrapper(handler)		Enregistrez les données du gestionnaire de redimensionnement afin de pouvoir les supprimer ultérieurement dans "dispose".
setResizesEnabled(enabled)		Indique si le redimensionnement est activé ou non pour cet espace de travail. Si cette option est activée, l'espace de travail sera redimensionné le cas échéant. Si cette option est désactivée, l'espace de travail ne sera pas redimensionné tant qu'elle ne sera pas réactivée. Utilisez cette option pour éviter le redimensionnement lors d'une opération par lot, afin d'améliorer les performances.
setScale(newScale)		Définissez le facteur de zoom de l'espace de travail.
setTheme(theme)		Définissez l'objet de thème de l'espace de travail. Si aucun thème n'est transmis, le thème Classic est utilisé par défaut.
setVisible(isVisible)		Active/Désactive la visibilité de l'espace de travail. Actuellement réservé à l'espace de travail principal.
startDrag(e, xy)		Commencez à suivre le déplacement d'un objet dans cet espace de travail.
translate(x, y)		Translate this workspace to new coordinates.
updateInverseScreenCTM()		Marquez la CTM d'écran inverse comme "sale".
updateToolbox(toolboxDef)		Modifiez l'arborescence des blocs dans la boîte à outils existante.
zoom(x, y, amount)		Effectue un zoom avant ou arrière sur l'espace de travail par rapport à la coordonnée (x, y) donnée ou centrée sur celle-ci.
zoomCenter(type)		Zoom avant ou arrière sur les blocs centrés dans le champ de vision.
zoomToFit()		Si possible, faites un zoom arrière pour que les blocs tiennent dans l'espace de travail.