Para extender un campo existente, debes subclasificar un campo integrado (p. ej.,
FieldTextInput
, FieldColour
) y, luego, modifica parte de esta para que se adapte a tus necesidades.
Estas son algunas de las partes de un campo que puedes modificar:
- Es editor.
- Es pantalla en bloque.
- El texto que muestra.
Si quieres crear un
campo personalizado
que no necesite un comportamiento de ningún campo integrado, deberías subclasificar Field
.
Extensiones comunes
La mayoría de los campos personalizados extienden uno de estos tres tipos:
- Entrada de texto: Si deseas que los usuarios escriban en el campo, debes extender
FieldTextInput
- Número: Si deseas almacenar un número, debes extender
FieldNumber
. - Menú desplegable: Si quieres crear un menú desplegable, pero quieres que almacene un modelo diferente.
que la cadena o el modelo de imagen predeterminados, debes extender
FieldDropdown
.- Precaución: Antes de extender
FieldDropdown
, comprueba que el campo de menú desplegable las opciones de personalización no pueden satisfacer tus necesidades.
- Precaución: Antes de extender
En ciertas circunstancias, es posible que desees extender un tipo de campo diferente. Para
el ejemplo FieldLabelSerializable
extiende FieldLabel
.
Subclase
import * as Blockly from 'blockly';
export class MyCustomTextField extends Blockly.FieldTextInput {
constructor(value, validator, config) {
super(value, validator, config);
}
}
El constructor de la subclase de un campo es muy similar al constructor para un campo personalizado. La firma del subconstructor debe suelen coincidir con la firma del superconstructor.
JSON y registro
También debes registrar el campo una vez:
Blockly.fieldRegistry.register('my_custom_text_field', MyCustomTextField);
y proporcionarás una implementación de fromJson
en la clase de modo que funcione con
el formato JSON:
static fromJson(options) {
const value = Blockly.utils.parsing.replaceMessageReferences(options.value);
return new MySubclassName(value);
}
Para obtener más información sobre cómo registrar un campo, consulta el archivo JSON y registro. en Creación de un campo personalizado.