blockly > Feld

Feldklasse

Abstrakte Klasse für ein bearbeitbares Feld.

Unterschrift:

export declare abstract class Field<T = any> implements IKeyboardAccessible, IRegistrable, ISerializable, IFocusableNode 

Implementiert: IKeyboardAccessible, IRegistrable, ISerializable, IFocusableNode

Konstruktoren

Konstruktor Modifikatoren Beschreibung
(constructor)(value, validator, config) Erstellt eine neue Instanz der Klasse Field.

Attribute

Attribut Modifikatoren Typ Beschreibung
borderRect_ protected SVGRectElement | null Das SVG-Rahmenelement des gerenderten Felds.
clickTarget_ protected Element | null Das Element, an das der Klick-Handler gebunden ist.
constants_ protected ConstantProvider | null Konstanten, die mit dem Renderer des Quellblocks verknüpft sind.
DEFAULT_VALUE T | null

Wenn Sie den Standardwert in „Feld“ überschreiben möchten, aktualisieren Sie den Prototyp direkt.

Beispiel: FieldImage.prototype.DEFAULT_VALUE = null;

BEARBEITBAR boolean Bearbeitbare Felder sind in der Regel durch eine Benutzeroberfläche gekennzeichnet. Sie werden auch vom Serializer gespeichert.
enabled_ protected boolean Kann der Feldwert in einem bearbeitbaren Block mit dem Editor geändert werden?
fieldGroup_ protected SVGGElement | null Das SVG-Gruppenelement des gerenderten Felds.
isDirty_ protected boolean Muss dieser Block neu gerendert werden?
maxDisplayLength Zahl Die maximale Anzahl von Zeichen, die angezeigt werden, bevor ein Auslassungspunkt hinzugefügt wird.
name? String Optional: Name des Felds. Innerhalb jedes Blocks eindeutig. Statische Labels sind in der Regel namenlos.
NBSP

static

readonly

(nicht deklariert) Geschütztes Leerzeichen.
SERIALIZABLE boolean Serialisierbare Felder werden vom Serializer gespeichert, nicht serialisierbare Felder nicht. Bearbeitbare Felder sollten außerdem serialisierbar sein. Das ist standardmäßig nicht der Fall, damit SERIALIZABLE abwärtskompatibel ist.
size_ protected Größe Ruft die Größe dieses Felds ab. Da getSize() und updateSize() Nebenwirkungen haben, dient dies als Zwischenschicht für Unterklassen, die Feldgrenzen beim Festlegen/Abrufen der Größe anpassen möchten, ohne unerwünschtes Rendering oder andere Nebenwirkungen auszulösen. Hinweis: Subklassen müssen sowohl „get“ als auch „set“ überschreiben, wenn eine der beiden Methoden überschrieben wird. Die Implementierung kann einfach direkt über „super“ aufgerufen werden, muss aber gemäß der JS-Spezifikation vorhanden sein.
SKIP_SETUP

static

readonly

eindeutiges Symbol Ein Wert, der angibt, dass der Konstruktor eines Felds den Wert des Felds *nicht* festlegen oder „configure_“ ausführen, sondern dies stattdessen einer Unterklasse ermöglichen soll.
sourceBlock_ protected Blockieren | null Block, an den dieses Feld angehängt ist. Beginnt als null, wird dann in init festgelegt.
textContent_ protected Text | null Das Textinhaltselement des gerenderten Felds.
textElement_ protected SVGTextElement | null Das SVG-Textelement des gerenderten Felds.
validator_ protected FieldValidator<T> | null Diese Validierungsfunktion wird aufgerufen, wenn ein Nutzer ein bearbeitbares Feld bearbeitet.
value_ protected T | null
visible_ protected boolean Ist das Feld sichtbar oder ausgeblendet, weil der Block minimiert ist?

Methoden

Methode Modifikatoren Beschreibung
applyColour()

Das Feld wird an die Farbe/den Stil des Blocks angepasst.

Nicht abstrakte Unterklassen sollten dies implementieren, wenn die Farbe des Felds von der Farbe des Blocks abhängt. Es wird automatisch zu relevanten Zeitpunkten aufgerufen, z. B. wenn sich der übergeordnete Block oder Renderer ändert.

Weitere Informationen finden Sie in der Dokumentation zum Feld oder unter „Dropdown-Feld“ als Beispiel.

bindEvents_() protected Ereignisse an das Feld binden Kann von untergeordneten Klassen überschrieben werden, wenn eine benutzerdefinierte Eingabebehandlung erforderlich ist.
canBeFocused() Siehe IFocusableNode.canBeFocused.
configure_(config) protected Die an das Feld übergebene Konfigurationszuordnung verarbeiten.
createBorderRect_() protected Erstellen Sie ein Rechteckelement für den Feldrahmen. Darf nicht von untergeordneten Klassen überschrieben werden. Ändern Sie stattdessen das Ergebnis der Funktion in initView oder erstellen Sie eine separate Funktion, die aufgerufen werden soll.
createTextElement_() protected Erstellen Sie ein Feldtextelement. Darf nicht von untergeordneten Klassen überschrieben werden. Ändern Sie stattdessen das Ergebnis der Funktion in initView oder erstellen Sie eine separate Funktion, die aufgerufen werden soll.
dispose() Entfernen Sie alle DOM-Objekte und -Ereignisse, die zu diesem bearbeitbaren Feld gehören.
doClassValidation_(newValue) protected

Validieren Sie die Änderungen am Wert eines Felds, bevor sie festgelegt werden. Ein Beispiel für die Implementierung einer Unterklasse finden Sie unter **FieldDropdown**.

**HINWEIS:** Bei der Validierung wird eine Option zwischen T, null und undefined zurückgegeben. Die Implementierung von **Field** gibt niemals undefined zurück. Es ist jedoch zulässig, dass eine Unterklasse undefined zurückgibt, wenn der neue Wert mit T kompatibel ist.

doClassValidation_(newValue) protected
doValueInvalid_(_invalidValue, _fireChangeEvent) protected Wird verwendet, um das Feld darüber zu informieren, dass ein ungültiger Wert eingegeben wurde. Kann von untergeordneten Klassen überschrieben werden, siehe FieldTextInput. Standardmäßig keine Aktion.
doValueUpdate_(newValue) protected Wird verwendet, um den Wert eines Felds zu aktualisieren. Kann von Unterklassen überschrieben werden, um benutzerdefiniertes Speichern von Werten oder Aktualisieren externer Elemente vorzunehmen.
forceRerender() Erzwingt ein erneutes Rendern des Blocks, in dem dieses Feld installiert ist. Dadurch wird das Feld neu gerendert und an alle Größenänderungen angepasst. Andere Felder im selben Block werden nicht neu gerendert, da ihre Größe bereits erfasst wurde.
fromJson(_options) static

Unterklassen sollten diese Methode neu implementieren, um ihre Feldunterklasse aus einem JSON-Arg-Objekt zu erstellen.

Es ist ein Fehler, zu versuchen, eine Feldunterklasse in der FieldRegistry zu registrieren, wenn diese Unterklasse diese Methode nicht überschrieben hat.

fromXml(fieldElement) Legt den Wert des Felds basierend auf dem angegebenen XML-Element fest. Sollte nur von Blockly.Xml aufgerufen werden.
getAbsoluteXY_() protected Die absoluten Koordinaten der linken oberen Ecke dieses Felds. Der Ursprung (0,0) ist die linke obere Ecke des Seitenkörpers.
getBorderRect() protected Ruft das Rechteckelement für den Rahmen ab.
getClickTarget_() protected Das Element, an das der Klick-Handler gebunden werden soll. Wenn nicht explizit festgelegt, wird standardmäßig der SVG-Stamm des Felds verwendet. Wenn auf dieses Element in einem bearbeitbaren Feld geklickt wird, wird der Editor geöffnet.
getConstants() Rufe den Anbieter der Konstanten des Renderers ab.
getDisplayText_() protected Hier wird der Text aus diesem Feld abgerufen, der im Block angezeigt werden soll. Kann aufgrund von Auslassungspunkten und anderer Formatierung von getText abweichen.
getFlipRtl() Gibt an, ob das Feld in RTL gespiegelt werden soll.
getFocusableElement() Siehe IFocusableNode.getFocusableElement.
getFocusableTree() Weitere Informationen finden Sie unter IFocusableNode.getFocusableTree.
getSize()

Gibt die Höhe und Breite des Felds zurück.

Dies sollte *im Allgemeinen* der einzige Ort sein, an dem render_ aufgerufen wird.

getSourceBlock() Ruft den Block ab, mit dem dieses Feld verknüpft ist.
getSvgRoot() Ruft das Gruppenelement für dieses bearbeitbare Feld ab. Wird zum Messen der Größe und zur Positionierung verwendet.
getText_() protected Ein Entwickler-Hook, um den zurückgegebenen Text dieses Felds zu überschreiben. Überschreiben Sie diesen Wert, wenn die Textdarstellung des Werts dieses Felds nicht nur ein String-Cast des Werts ist. Geben Sie „null“ zurück, um einen String-Cast zu verwenden.
getText() Text aus diesem Feld abrufen Überschreiben Sie getText_, um ein anderes Verhalten als das einfache Umwandeln des Werts in einen String zu erzielen.
getTextContent() protected Ruft den Textinhalt ab.
getTextElement() protected Ruft das Textelement ab.
getTooltip() Gibt den Text der Kurzinfo für dieses Feld zurück.
getValidator() Ruft die Validierungsfunktion für bearbeitbare Felder ab. Wenn sie nicht festgelegt ist, wird „null“ zurückgegeben.
getValue() Ruft den aktuellen Wert des Felds ab.
initModel() Initialisiert das Modell des Felds, nachdem es in einem Block installiert wurde. Standardmäßig keine Aktion.
initView() protected Erstellen Sie die Block-Benutzeroberfläche für dieses Feld.
isClickable() Prüfen Sie, ob in diesem Feld die Funktion „showEditor_“ definiert ist.
isClickableInFlyout(autoClosingFlyout) Prüfen Sie, ob das Feld angeklickt werden kann, während sich der Block in einem Flyout befindet. Standardmäßig sind Felder in immer geöffneten Flyouts wie der einfachen Toolbox anklickbar, aber nicht in automatisch schließenden Flyouts wie der Kategorie-Toolbox. Abgeleitete Klassen können diese Funktion überschreiben, um dieses Verhalten zu ändern. Hinweis: isClickable muss auch „wahr“ zurückgeben, damit dies eine Auswirkung hat.
isCurrentlyEditable() Prüfen Sie, ob dieses Feld derzeit bearbeitet werden kann. Einige Felder sind NIE BEARBEITBAR (z.B. Textlabels). Andere Felder können BEARBEITBAR sein, aber in nicht bearbeitbaren Blöcken vorhanden sein oder derzeit deaktiviert sein.
isEnabled() Prüfen Sie, ob der Wert dieses Felds mit dem Editor geändert werden kann, wenn der Quellblock bearbeitbar ist.
isSerializable() Hier können Sie angeben, ob dieses Feld vom XML-Renderer serialisiert werden soll. Hier wird die Logik für die Abwärtskompatibilität und inkonsistente Status verarbeitet.
isVisible() Gibt an, ob dieses bearbeitbare Feld sichtbar ist oder nicht.
loadLegacyState(callingClass, state) Lädt den angegebenen Status entweder mit den alten XML-Hooks, falls diese verwendet werden sollen. Gibt „true“ zurück, um anzugeben, dass das Laden verarbeitet wurde. Andernfalls „false“.
loadState(state) Legt den Status des Felds basierend auf dem angegebenen Statuswert fest. Sollte nur vom Serialization-System aufgerufen werden.
onLocationChange(_) Das Feld wird darüber informiert, dass sich sein Speicherort geändert hat.
onMouseDown_(e) protected Ein Ereignis vom Typ „Pointerdown“ in einem Feld verarbeiten
onNodeBlur() Siehe IFocusableNode.onNodeBlur.
onNodeFocus() Siehe IFocusableNode.onNodeFocus.
onShortcut(_shortcut) Verarbeitet die angegebene Tastenkombination.
positionBorderRect_() protected Positionieren Sie den Rahmen eines Felds nach einer Größenänderung.
positionTextElement_(xOffset, contentWidth) protected Positionieren Sie das Textelement eines Felds nach einer Größenänderung. Dies funktioniert sowohl für LTR- als auch für RTL-Positionierung.
referencesVariables() Gibt an, ob dieses Feld auf Blockly-Variablen verweist. Wenn dies der Fall ist, muss es bei der Serialisierung und Deserialisierung möglicherweise anders behandelt werden. Abgeleitete Klassen können dies überschreiben.
refreshVariableName() Aktualisieren Sie den Variablennamen, auf den dieses Feld verweist, falls es sich um ein solches Feld handelt.
render_() protected

Wird von getSize() verwendet, um DOM-Elemente zu verschieben/in der Größe zu ändern und die neue Größe abzurufen.

Das gesamte Rendering, das sich auf die Größe/Form des Blocks auswirkt, sollte hier erfolgen und durch getSize() ausgelöst werden.

repositionForWindowResize()

Ein Entwickler-Hook, mit dem das WidgetDiv bei einer Fenstergrößenänderung neu positioniert werden kann. Sie müssen diesen Hook definieren, wenn Ihr Feld ein WidgetDiv hat, das sich neu positionieren muss, wenn die Fenstergröße geändert wird. Beispielsweise wird dieser Hook für Texteingabefelder definiert, damit sich das Eingabe-WidgetDiv bei einem Fenstergrößenänderungsereignis neu positionieren kann. Dies ist besonders wichtig, wenn modale Eingaben deaktiviert wurden, da auf Android-Geräten ein Fenstergrößenänderungsereignis ausgelöst wird, wenn die Soft-Tastatur geöffnet wird.

Wenn das WidgetDiv ausgeblendet werden soll, anstatt neu positioniert zu werden, gib „false“ zurück. Das ist das Standardverhalten.

DropdownDivs haben bereits eine eigene Positionierungslogik. Sie müssen diese Funktion also nicht überschreiben, wenn Ihr Feld nur ein DropdownDiv hat.

saveLegacyState(callingClass) protected Gibt eine stringisierte Version des XML-Status zurück, falls er verwendet werden soll. Andernfalls wird „null“ zurückgegeben, um anzuzeigen, dass für das Feld eine eigene Serialization verwendet werden soll.
saveState(_doFullSerialization) Speichert den Wert dieses Felds als etwas, das in JSON serialisiert werden kann. Sollte nur vom Serialization-System aufgerufen werden.
setEnabled(enabled) Legen Sie fest, ob der Wert dieses Felds mit dem Editor geändert werden kann, wenn der Quellblock bearbeitbar ist.
setSourceBlock(block) Fügen Sie dieses Feld einem Block hinzu.
setTooltip(newTip) Hier legen Sie die Kurzinfo für dieses Feld fest.
setValidator(handler)

Hiermit wird eine neue Validierungsfunktion für bearbeitbare Felder festgelegt oder ein zuvor festgelegter Validator gelöscht.

Die Validierungsfunktion nimmt den neuen Feldwert an und gibt den validierten Wert zurück. Der validierte Wert kann der Eingabewert, eine geänderte Version des Eingabewerts oder „null“ sein, um die Änderung abzubrechen.

Wenn die Funktion nichts zurückgibt (oder „undefiniert“ zurückgibt), wird der neue Wert als gültig akzeptiert. So können Felder, für die die Funktion „validated“ als Benachrichtigung für Änderungsereignisse auf Feldebene verwendet wird, berücksichtigt werden.

setValue(newValue, fireChangeEvent) Damit wird der Wert des Felds geändert. Verwaltet Validierung und Ereignisse. Abgeleitete Klassen sollten doClassValidation_ und doValueUpdate_ anstelle dieser Methode überschreiben.
showEditor_(_e) protected Ein Entwickler-Hook zum Erstellen eines Editors für das Feld. Diese Option ist standardmäßig deaktiviert und muss überschrieben werden, um einen Bearbeiter zu erstellen.
toXml(fieldElement) Der Wert dieses Felds wird in XML serialisiert. Sollte nur von Blockly.Xml aufgerufen werden.
updateEditable() Fügen Sie die Benutzeroberfläche hinzu oder entfernen Sie sie, um anzugeben, ob dieses Feld bearbeitbar ist oder nicht.
updateSize_(margin) protected Die Größe des Felds wird anhand des Texts aktualisiert.