blockly > WorkspaceSvg

Classe WorkspaceSvg

Classe pour un espace de travail. Il s'agit d'une zone à l'écran avec, si vous le souhaitez, une corbeille, des barres de défilement, des bulles et des options de déplacement.

Signature :

export declare class WorkspaceSvg extends Workspace implements IASTNodeLocationSvg 

Extension:Espace de travail

Implémentation:IASTNodeLocationSvg

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 pour modifier l'ensemble d'options de menu créé par l'espace de travail.
keyboardAccessibilityMode boolean "True" si le mode d'accessibilité du clavier est activé, "false" dans le cas contraire.
rendu boolean É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.
à grande échelle number Échelle actuelle.
barre de défilement ScrollbarPair | null Barres de défilement de cet espace de travail, le cas échéant
scrollX number

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 l'affichage "voit" maintenant le côté gauche du canevas. Lorsque 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.

Ce qui prête à confusion avec cette valeur, c'est qu'elle n'inclut pas et ne doit pas inclure le décalage absoluteLeft. En effet, elle est utilisée pour calculer la valeur viewLeft.

La valeur viewLeft est relative à l'origine de l'espace de travail (bien qu'en pixels). L'origine de l'espace de travail est l'angle supérieur gauche de celui-ci (du moins lorsqu'elle est activée). Elle est décalée en haut à gauche de blocklyDiv afin de ne pas se trouver sous la boîte à outils.

Lorsque l'espace de travail est activé, viewLeft et de l'origine de l'espace de travail se trouvent au même emplacement X. Lorsque le canevas glisse vers la droite en dessous de 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 glissant vers la droite lorsque le canevas se déplace).

Ainsi, si le ScrollX incluait le absoluteLeft, cela annule le décalage de l'origine de l'espace de travail. Cela signifie que viewLeft représente le bord gauche de blocklyDiv, et non le bord gauche de l'espace de travail.

scrollY number

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 descend, cette valeur devient plus positive, et l'affichage "voit" désormais la partie supérieure du canevas. Plus le canevas se déplace vers le haut, plus la valeur est négative, et la vue "voit" la partie inférieure du canevas.

Cette valeur n'est pas clairement définie et ne doit pas inclure de décalage absolu. En effet, elle est utilisée pour calculer la valeur viewTop.

ViewTop est relatif à l'origine de l'espace de travail (bien qu'en pixels). L'origine de l'espace de travail est l'angle supérieur gauche de celui-ci (du moins lorsqu'elle est activée). Elle est décalée en haut à gauche de blocklyDiv afin de ne pas se trouver sous la boîte à outils.

Lorsque l'espace de travail est activé, viewTop et son origine se trouvent au même emplacement Y. Lorsque 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 (image dans l'origine de l'espace de travail sous la forme d'un point sur le canevas glissant vers le bas à mesure que le canevas se déplace).

Ainsi, si le défilement Y inclut la valeur absoluteTop, cela permet d'annuler le décalage de l'origine de l'espace de travail. Cela signifie que viewTop représentera le bord supérieur de blocklyDiv, et non le bord supérieur de l'espace de travail.

startScrollX number Valeur de défilement horizontal au début du défilement, en pixels.
startScrollY number Valeur du défilement vertical en pixels.
svgBackground_ SVGElement
svgBlockCanvas_ SVGElement
svgBubbleCanvas_ SVGElement
svgGroup_ SVGElement
themeManager_ protected ThemeManager
poubelle Corbeille | null Corbeille de l'espace de travail (le cas échéant)
zoomControls_ ZoomControls | null

Méthodes

Méthode Modificateurs Description
addTopBlock(block) Ajoute un volume à 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 commentaires les plus populaires.
centerOnBlock(id, blockOnly) Faites défiler l'espace de travail pour centrer sur le volume donné. Si d'autres blocs sont empilés en dessous du bloc, l'espace de travail sera centré sur la pile, sauf si la valeur "blockOnly" est définie sur "true".
cleanUp() Nettoyez l’espace de travail en ordonnant tous les blocs dans une colonne.
clear() Supprimez tous les volumes de l'espace de travail en procédant à une optimisation pour éviter les redimensionnements.
createDom(opt_backgroundClass, injectionDiv) Créez les éléments DOM de l'espace de travail.
createVariable(name, opt_type, opt_id) Créez une variable portant le nom donné. Mettez à jour le menu déroulant pour afficher immédiatement la nouvelle variable.
deleteVariableById(id) Supprimez une variable en fonction de l'ID transmis. Mettez à jour le menu déroulant pour indiquer immédiatement que la variable est supprimée.
dispose() Supprimez cet espace de travail. Dissociez-les de tous les éléments DOM pour éviter les fuites de mémoire.
getAllBlocks(ordered) Rechercher tous les volumes dans l'espace de travail Les blocs peuvent être triés par position, de haut en bas (avec un léger biais de gauche à droite ou de droite à gauche).
getAudioManager() Téléchargez le gestionnaire audio pour cet espace de travail.
getBlockById(id). Recherchez le bloc correspondant à l'ID spécifié dans cet espace de travail.
getBlocksBoundingBox() Calculez le cadre de délimitation pour les blocs de 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) Obtenir la fonction de rappel associée à une clé donnée, pour les clics sur les boutons et les libellés dans le menu déroulant
getCanvas() Récupérez l'élément SVG qui constitue la surface de dessin.
getComponentManager() Récupère le gestionnaire de composants de cet espace de travail.
getCursor() Curseur pour cet espace de travail.
getDragTarget(e) Renvoie la cible de déplacement sur laquelle l'événement de pointeur est terminé.
getFlyout(opt_own) Getter du menu déroulant 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 est nulle s'il n'y a pas de menu déroulant.
getGrid() Obtenez l'objet de grille pour cet espace de travail, ou la valeur "null" s'il n'y en a pas.
getInverseScreenCTM(). Getter du CTM à écran inversé.
getMarkerManager() Téléchargez le gestionnaire des repères pour cet espace de travail.
getMetricsManager() Récupère le gestionnaire de métriques de cet espace de travail.
getParentSvg(). Permet d'obtenir l'élément SVG qui contient cet espace de travail. Remarque: Nous partons du principe 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 blocs associé à cet espace de travail.
getRootWorkspace()
getScale() Permet d'obtenir le facteur de zoom de l'espace de travail. Si l'espace de travail a un parent, nous appelons celui-ci pour obtenir l'échelle de l'espace de travail.
getSvgGroup() Renvoie le groupe SVG pour l'espace de travail.
getTheme() Permet d'obtenir l'objet de thème de l'espace de travail.
getToolbox() Getter de la boîte à outils associée à cet espace de travail, le cas échéant.
getToolboxCategoryCallback(key) Permet d'obtenir la fonction de rappel associée à une clé donnée pour remplir les catégories de boîte à outils personnalisées dans cet espace de travail.
getTopBlocks(ordered) Recherche les blocs de premier niveau et les renvoie. Les blocs peuvent être triés par position, de haut en bas (avec un léger biais de gauche à droite ou de droite à gauche).
getTopBoundedElements() Recherche les éléments limités de niveau supérieur et les renvoie.
getWidth() Renvoie le décalage horizontal de l'espace de travail. Destiné à la compatibilité LTR/RTL en XML.
hideChaff(onlyClosePopups) Fermer les info-bulles, les menus contextuels, les sélections déroulantes, etc.
hideComponents(onlyClosePopups) Masquez tous les composants qui peuvent être masqués automatiquement (comme le menu déroulant, la corbeille et tous les composants enregistrés par l'utilisateur).
highlightBlock(id, opt_state) Mettez en surbrillance ou désélectionnez 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() L'utilisateur fait-il glisser un bloc ou fait-il défiler le menu déroulant/l'espace de travail ?
isMovable()

Cet espace de travail peut-il être déplacé ?

Cela signifie que l'utilisateur peut repositionner les coordonnées X Y de l'espace de travail par le biais d'une entrée. Vous pouvez utiliser les barres de défilement, la molette, le déplacement ou le zoom avec la molette ou le pincement (puisque le zoom est centré sur la position de la souris). Cela n'inclut pas le zoom à l'aide des commandes de zoom, car les coordonnées X Y sont définies par programmation.

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
markFocused() Marquez cet espace de travail comme l'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 qui vient d'être créé.
paste(état) Colle le bloc ou le commentaire fourni dans l'espace de travail dans l'espace de travail. Ne vérifie pas si la capacité restante de l'objet est disponible avant d'appeler cette méthode.
recordDragTargets() Dressez la liste de toutes les zones à supprimer de cet espace de travail.
refreshTheme() Actualiser tous les blocs de l'espace de travail après la mise à jour d'un thème.
registerButtonCallback(key, func) Enregistre une fonction de rappel associée à une clé donnée, pour les clics sur les boutons et les étiquettes du menu déroulant. Par exemple, un bouton spécifié par le fichier XML doit être mis en correspondance avec un appel à registerButtonCallback("CREATE_VARIABLE", yourCallbackFunction).
registerToolboxCategoryCallback(key, func) Enregistre une fonction de rappel associée à une clé donnée pour renseigner des catégories de boîte à outils personnalisées dans cet espace de travail. Consultez la variable et les catégories de procédure à titre d'exemple.
removeButtonCallback(key) Supprimer un rappel pour un clic sur un bouton dans le menu déroulant.
removeToolboxCategoryCallback(key) Supprimer un rappel après un clic sur le nom d'une catégorie personnalisée dans la boîte à outils
removeTopBlock(block) Supprime un volume de la liste des volumes supérieurs.
removeTopBoundedElement(element) Supprime un élément limité de la liste des éléments limités supérieurs.
removeTopComment(comment) Supprime un commentaire de la liste des commentaires les plus populaires.
renameVariableById(id, nouveauNom) Pour renommer une variable, mettez à jour son nom dans le mappage des variables. Mettez à jour le menu déroulant pour afficher immédiatement la variable renommée.
render() Affichez tous les blocs dans l'espace de travail.
resize() Redimensionner et repositionner tout le Chrome de l'espace de travail (boîte à outils, corbeille, barres de défilement, etc.) Cette méthode doit être appelée lorsqu'un élément change, ce qui 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).
scrollCenter() Centrez l'espace de travail.
setResizeHandlerWrapper(handler) Enregistrer les données du gestionnaire de redimensionnement afin de pouvoir les supprimer ultérieurement dans "dispose".
setResizesEnabled(enabled) Indiquez si les redimensionnements sont activés pour cet espace de travail. Si cette option est activée, l'espace de travail est redimensionné si nécessaire. Si cette option est désactivée, l'espace de travail ne sera pas redimensionné tant qu'il n'est pas réactivé. À utiliser 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 destiné uniquement à l'espace de travail principal.
startDrag(e, xy) Commencez à suivre le déplacement d'un objet dans cet espace de travail.
translate(x, y). Traduisez cet espace de travail vers de nouvelles coordonnées.
updateInverseScreenCTM() Marquez le CTM de l'écran inverse comme sale.
updateToolbox(toolboxDef) Modifiez l'arborescence de blocs dans la boîte à outils existante.
zoom(x, y, amount) Fait un zoom avant ou arrière sur l'espace de travail par rapport à la coordonnée (x, y) donnée.
zoomCenter(type) Zoomer sur les volumes centrés au centre de la vue en effectuant un zoom avant ou arrière
zoomToFit() Si possible, zoomez sur les volumes pour les adapter à l'espace de travail.