Certaines icônes ont un état qui doit être enregistré, tandis que d'autres sont instanciées en fonction de l'état existant. Par exemple, les icônes de commentaire doivent enregistrer leur texte, ce qui n'est pas le cas des icônes d'avertissement, car elles sont instanciées en fonction de la manière dont les blocs sont connectés.
Si votre icône doit enregistrer son état, vous devez implémenter l'interface ISerializable et register votre icône.
L'état renvoyé par votre icône est inclus dans la propriété icons de l'état de votre bloc:
{
'blocks': {
'languageVersion': 0,
'blocks': [
{
'type': 'my_block',
'icons': {
// Your state goes here!
'my_icon': 'some state',
}
}
]
}
}
Enregistrer l'état
Pour enregistrer l'état de votre icône, vous devez implémenter la méthode saveState de l'interface ISerializable. Cette méthode peut renvoyer un fichier JSON arbitraire, qui est transmis à votre méthode loadState.
saveState() {
return this.state; // Some arbirtary JSON-compatible data.
}
Sérialisation complète et sauvegarde des données
saveState reçoit également un paramètre doFullSerialization facultatif. Elle est utilisée par les icônes qui font référence à un état sérialisé par un autre sérialiseur (comme des modèles de données de sauvegarde). Le paramètre indique que l'état référencé ne sera pas disponible lorsque le bloc est désérialisé. L'icône doit donc sérialiser l'ensemble de l'état de sauvegarde. C'est le cas lorsqu'un bloc individuel est sérialisé ou lorsqu'un bloc est copié-collé.
Voici deux cas d'utilisation courants:
- Lorsqu'un bloc individuel est chargé dans un espace de travail où le modèle de données de sauvegarde n'existe pas, l'icône contient suffisamment d'informations dans son propre état pour créer un modèle de données.
- Lorsqu'un bloc est copié-collé, l'icône crée toujours un modèle de données de sauvegarde au lieu de référencer un modèle existant.
État du chargement
Pour enregistrer l'état de votre icône, vous devez implémenter la méthode loadState de l'interface ISerializable. Cette méthode utilise le code JSON renvoyé par votre méthode saveState.
loadState(state) {
this.state = state;
}
Enregistrer des classes d'icônes
Enfin, vous devez enregistrer votre icône afin que le système de sérialisation puisse l'instancier. N'oubliez pas que le IconType utilisé pour enregistrer votre icône doit comporter la même chaîne que celle renvoyée par sa méthode getType.
class myIcon extends Blockly.icons.Icon {
getType() {
return new Blockly.icons.IconType('my_icon');
}
}
Blockly.icons.registry.register(
new Blockly.icons.IconType('my_icon'), myIcon);