blockly > Campo

Clase de campo

Clase abstracta para un campo editable.

Signature:

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

Implementaciones: IASTNodeLocationSvg, IASTNodeLocationWithBlock, IKeyboardAccessible, IRegistrable y ISerializable

Constructores

Constructor Modificadores Descripción
(constructor)(valor, validador, configuración) Construye una instancia nueva de la clase Field.

Propiedades

Propiedad Modificadores Tipo Descripción
borderRect_ protected SVGRectElement | nulo El elemento de borde SVG del campo renderizado.
clickTarget_ protected Elemento | nulo El elemento al que está vinculado el controlador de clics.
constants_ protected ConstantProvider | nulo Constantes asociadas con el renderizador del bloque de origen.
CURSOR string Es el estilo del cursor del mouse cuando se encuentra sobre el hotspot que inicia el editor.
DEFAULT_VALUE T | nulo

Para reemplazar el valor predeterminado establecido en **Campo**, actualiza directamente el prototipo.

Ejemplo: FieldImage.prototype.DEFAULT_VALUE = null;

EDITABLE boolean Por lo general, los campos editables muestran algún tipo de IU que indica que se pueden editar. El serializador también las guardará.
enabled_ protected boolean ¿Se puede cambiar el valor del campo con el editor en un bloque editable?
fieldGroup_ protected SVGGElement | nulo El elemento de grupo de SVG del campo renderizado.
isDirty_ protected boolean ¿Es necesario volver a renderizar este bloqueo?
maxDisplayLength número Cantidad máxima de caracteres de texto para mostrar antes de agregar puntos suspensivos.
nombre? string (Opcional) Nombre del campo. Es único en cada bloque. Por lo general, las etiquetas estáticas no tienen nombre.
NBSP

static

readonly

(no declarado) Espacio de no separación.
SERIALIZABLE boolean El serializador guarda los campos serializables, mientras que los no serializables no lo son. Los campos editables también deben ser serializables. Este no es el caso de forma predeterminada, por lo que SERIALIZABLE es retrocompatible.
size_ protected Tamaño
SKIP_SETUP

static

readonly

símbolo único Un valor que se usa para indicar cuándo el constructor de un campo *no* debe establecer el valor del campo ni ejecutar configure_, y debe permitir que una subclase lo haga.
sourceBlock_ protected Bloquear | nulo Bloquear este campo está adjunto. Comienza como nulo y luego se establece en init.
textContent_ protected Texto | nulo El elemento de contenido de texto del campo renderizado.
textElement_ protected SVGTextElement | nulo El elemento de texto SVG del campo renderizado.
validator_ protected FieldValidator&lt;T&gt; | nulo Es la función de validación que se llama cuando el usuario edita un campo editable.
value_ protected T | nulo
visible_ protected boolean ¿El campo es visible o está oculto debido a que se contrajo el bloque?

Métodos

Método Modificadores Descripción
applyColour()

Actualiza el campo para que coincida con el color/estilo del bloque.

Para las subclases no abstractas, se recomienda implementar esto si el color del campo depende del color del bloque. Se llamará automáticamente en momentos relevantes, como cuando cambie el bloque superior o el renderizador.

Consulta la documentación del campo para obtener más información o FieldDropdown para ver un ejemplo.

bindEvents_() protected Vincular los eventos al campo Las subclases pueden anularlas si necesitan realizar un control de entradas personalizado.
configure_(config) protected Procesa el mapa de configuración que se pasa al campo.
createBorderRect_() protected Crea un elemento rectángulo de borde de campo. Las subclases no deben anularlas. En cambio, modifica el resultado de la función dentro de initView o crea una función separada para llamar.
createTextElement_() protected Crea un elemento de texto de campo. Las subclases no deben anularlas. En cambio, modifica el resultado de la función dentro de initView o crea una función separada para llamar.
doClassValidation_(newValue) protected

Valida los cambios en el valor de un campo antes de que se configuren. Consulta **FieldDropdown** para ver un ejemplo de implementación de subclases.

**NOTA:** La validación muestra una opción entre T, null y undefined. La implementación de **Field** nunca mostrará undefined, pero es válido para que una subclase muestre undefined si el valor nuevo es compatible con T.

doClassValidation_(newValue) protected
doValueInvalid_(_invalidValue, _fireChangeEvent) protected Se usa para notificar al campo que se ingresó un valor no válido. Se puede anular con subclases, consulta FieldTextInput. No-ops de forma predeterminada.
doValueUpdate_(newValue) protected Se usa para actualizar el valor de un campo. Las subclases pueden anularlas para realizar almacenamiento personalizado de valores o actualizaciones de elementos externos.
fromJson(_options) static

Las subclases deben volver a implementar este método para construir su subclase Field a partir de un objeto arg de JSON.

Es un error intentar registrar una subclase de campo en FieldRegistry si esa subclase no anula este método.

getAbsoluteXY_() protected Muestra las coordenadas absolutas de la esquina superior izquierda de este campo. El origen (0,0) es la esquina superior izquierda del cuerpo de la página.
getBorderRect() protected Obtiene el elemento rectangular de borde.
getClickTarget_() protected Elemento al que se vinculará el controlador de clics. Si no se configura de forma explícita, el valor predeterminado es la raíz SVG del campo. Cuando se haga clic en este elemento en un campo editable, se abrirá el editor.
getConstants() Obtén el proveedor de constantes del renderizador.
getDisplayText_() protected Obtén el texto de este campo para que se muestre en el bloque. Puede diferir de getText debido a los puntos suspensivos y otros formatos.
getFlipRtl() Muestra si debemos invertir el campo en RTL.
getSize()

Muestra la altura y el ancho del campo.

*En general*, este debería ser el único lugar desde el que se llama a render_.

getSourceBlock() Obtén el bloque al que está adjunto este campo.
getSvgRoot() Obtiene el elemento de grupo para este campo editable. Se usa para medir el tamaño y el posicionamiento.
getText_() protected Un hook de desarrollador para anular el texto que se muestra de este campo. Anula esta opción si la representación de texto del valor de este campo no es solo una conversión de cadena de su valor. Muestra un valor nulo para recurrir a una conversión de cadenas.
getText() Obtén el texto de este campo. Anula getText_ para proporcionar un comportamiento diferente al de convertir simplemente el valor en una string.
getTextContent() protected Obtiene el contenido de texto.
getTextElement() protected Obtiene el elemento de texto.
getTooltip() Muestra el texto de información sobre la herramienta para este campo.
getValidator() Obtiene la función de validación para campos editables o un valor nulo si no está configurado.
getValue() Obtén el valor actual del campo.
initModel() Inicializa el modelo del campo después de que se haya instalado en un bloque. No-ops de forma predeterminada.
initView() protected Crea la IU de bloque para este campo.
isClickable() Comprueba si este campo define la función showEditor_.
isClickableInFlyout(autoClosingFlyout) Comprueba si se debe poder hacer clic en el campo mientras el bloque está en un menú flotante. La configuración predeterminada es que se puede hacer clic en los campos en los menús flotantes siempre abiertos, como la caja de herramientas simple, pero no en los menús flotantes de cierre automático como la caja de herramientas de la categoría. Las subclases pueden anular esta función para cambiar este comportamiento. Ten en cuenta que isClickable también debe mostrar el valor "true" para que esto tenga efecto.
isCurrentlyEditable() Comprueba si el campo se puede editar en este momento. Algunos campos nunca se pueden EDITAR (p.ej., las etiquetas de texto). Es posible que otros campos se puedan EDITAR, pero que existan en bloques no editables o que estén inhabilitados actualmente.
isEnabled() Comprueba si se puede cambiar el valor de este campo con el editor cuando se puede editar el bloque de origen.
isFullBlockField() protected

Define si este campo debe ocupar todo el bloque o no.

Ten cuidado cuando anules esta función. Es posible que no funcione como esperas o pretendes porque el comportamiento fue hackeado. Si estás pensando en anular esta función, publica en el foro con el comportamiento deseado para ver si hay otro enfoque.

isSerializable() Verifica si el procesador de XML debe serializar este campo. Controla la lógica para la retrocompatibilidad y los estados incongruentes.
isTabNavigable() Muestra si el campo es navegable por tabulación o no.
isVisible() Obtiene si este campo editable es visible o no.
loadLegacyState(callingClass, state) Carga el estado determinado con los hooks XML anteriores, si es que deben usarse. Muestra true para indicar que se manejó la carga; de lo contrario, muestra false.
onLocationChange(_) Notifica al campo que cambió de ubicación.
onMouseDown_(e) protected Controla un evento Pointdown en un campo.
onShortcut(_shortcut) Controla la combinación de teclas especificada.
positionBorderRect_() protected Posiciona el rectángulo del borde de un campo después de un cambio de tamaño.
positionTextElement_(xOffset, contentWidth) protected Posiciona el elemento de texto de un campo después de un cambio de tamaño. De esta manera, se controla el posicionamiento de izquierda a derecha y de derecha a izquierda.
render_() protected

getSize() lo usa para mover o cambiar el tamaño de cualquier elemento del DOM, y obtener el nuevo tamaño.

Toda la renderización que tenga un efecto en el tamaño o la forma del bloque debe realizarse aquí y debe activarse mediante getSize().

repositionForWindowResize()

Un hook de desarrollador para cambiar la posición de WidgetDiv durante el cambio de tamaño de una ventana Debes definir este hook si tu campo tiene un WidgetDiv que debe cambiar de posición cuando se modifica el tamaño de la ventana. Por ejemplo, los campos de entrada de texto definen este hook para que el WidgetDiv de entrada pueda reubicarse en un evento de cambio de tamaño de la ventana. Esto es muy importante cuando se inhabilitan las entradas modales, ya que los dispositivos Android activan un evento de cambio de tamaño de la ventana cuando se abre el teclado en pantalla.

Si quieres que WidgetDiv se oculte en lugar de cambiar su posición, muestra el valor "false". Este es el comportamiento predeterminado.

DropdownDivs ya controla su propia lógica de posicionamiento, por lo que no necesitas anular esta función si tu campo solo tiene un DropdownDiv.

saveLegacyState(callingClass) protected Si se debe usar, muestra una versión en cadena del estado XML. De lo contrario, muestra un valor nulo para indicar que el campo debe usar su propia serialización.
setEnabled(enabled) Establece si el valor de este campo se puede cambiar con el editor cuando se puede editar el bloque de origen.
setSourceBlock(block) Adjunta este campo a un bloque.
setTooltip(newTip) Establece la información sobre la herramienta para este campo.
setValidator(handler)

Establece una nueva función de validación para campos editables o borra un validador establecido anteriormente.

La función de validador toma el valor nuevo del campo y muestra el valor validado. El valor validado puede ser el valor de entrada, una versión modificada del valor de entrada o un valor nulo para anular el cambio.

Si la función no muestra nada (o muestra un valor indefinido), el valor nuevo se acepta como válido. Esto permite los campos que usan la función validada como una notificación de evento de cambio a nivel de campo.

setValue(newValue, fireChangeEvent) Se usa para cambiar el valor del campo. Controla las validaciones y los eventos. Las subclases deben anular doClassValidation_ y doValueUpdate_ en lugar de este método.
showEditor_(_e) protected Un hook de desarrollador para crear un editor para el campo. Es no-op de forma predeterminada y debe anularse para crear un editor.
updateEditable() Agrega o quita la IU para indicar si el campo se puede editar o no.
updateSize_(margin) protected Actualiza el tamaño del campo en función del texto.