Un champ d’angle stocke un nombre en tant que valeur et une chaîne en tant que texte. Sa valeur est un nombre compris entre 0 et 360 (cette plage peut être modifiée), tandis que son texte peut correspondre à n'importe quelle chaîne saisie dans son éditeur.
Champ d'angle
Champ d'angle avec l'éditeur
Champ d'angle réduit
Création
JSON
{
"type": "example_angle",
"message0": "angle: %1",
"args0": [
{
"type": "field_angle",
"name": "FIELDNAME",
"angle": 90
}
]
}
JavaScript
Blockly.Blocks['example_angle'] = {
init: function() {
this.appendDummyInput()
.appendField('angle:')
.appendField(new Blockly.FieldAngle(90), 'FIELDNAME');
}
};
Le constructeur d'angle accepte une valeur et un validator facultatifs. La valeur zéro est utilisée comme valeur par défaut si aucune valeur n'est indiquée ou si la valeur donnée n'est pas convertie en nombre.
sérialisation
JSON
Le code JSON d'un champ d'angle se présente comme suit:
{
"fields": {
"FIELDNAME": 0
}
}
Où FIELDNAME
est une chaîne faisant référence à un champ d'angle, et la valeur est la valeur à appliquer au champ. La valeur suit les mêmes règles que la valeur du constructeur.
XML
Le code XML d'un champ d'angle se présente comme suit:
<field name="FIELDNAME">0</field>
Où l'attribut name
contient une chaîne faisant référence à un champ d'angle, et le texte intérieur est la valeur à appliquer au champ. La valeur de texte interne suit les mêmes règles que la valeur du constructeur.
Fonctionnalités
Ancrage
La propriété Blockly.FieldAngle.ROUND
modifie la valeur à appliquer au sélecteur d'angle lorsqu'il utilise la souris.
Voici un exemple avec une valeur ROUND
de 70:
La propriété ROUND
est définie par défaut sur 15. Définissez-la sur 0 si vous souhaitez désactiver l'ancrage.
Comme il s'agit d'une propriété globale, tous les champs d'angle seront modifiés lorsqu'ils seront définis.
Sens de circulation
La propriété Blockly.FieldAngle.CLOCKWISE
change la direction dans laquelle la valeur de l'angle augmente. Définir cette valeur sur true
augmente l'angle à mesure que le sélecteur est déplacé dans le sens des aiguilles d'une montre, tandis que le définir sur false
augmente l'angle à mesure qu'il est déplacé dans le sens inverse des aiguilles d'une montre.
Dans le sens des aiguilles d'une montre défini sur "true"
Dans le sens des aiguilles d'une montre défini sur "false"
La propriété CLOCKWISE
est définie par défaut sur false
, ce qui signifie qu'un mouvement dans le sens inverse des aiguilles d'une montre augmentera l'angle.
Comme il s'agit d'une propriété globale, tous les champs d'angle seront modifiés lorsqu'ils seront définis.
Position zéro
La propriété Blockly.FieldAngle.OFFSET
définit l'emplacement de 0 degré. Par défaut, la valeur zéro degré est alignée sur l'axe X positif (vers la droite). Cette propriété décale ensuite cette position d'un certain nombre de degrés.
La propriété OFFSET
est définie par défaut sur 0, ce qui signifie que zéro degré est aligné sur l'axe des abscisses positif.
Comme il s'agit d'une propriété globale, tous les champs d'angle seront modifiés lorsqu'ils seront définis.
Plage
La propriété Blockly.FieldAngle.WRAP
définit la plage de valeurs.
La plage de valeurs est égale à (-360 + WRAP, WRAP)
. Cela signifie qu'une valeur WRAP
de 360 donne une plage de (0, 359.9)
, et qu'une valeur de WRAP
de 180 donne une plage de (-179.9, 180)
.
La propriété WRAP
est définie par défaut sur 360, ce qui signifie que la plage du champ est (0,
359.9)
.
Comme il s'agit d'une propriété globale, tous les champs d'angle seront modifiés lorsqu'ils seront définis.
Taille du sélecteur d'angle
La propriété Blockly.FieldAngle.HALF
modifie la taille du sélecteur d'angle. Cette valeur définit le rayon du cercle extérieur en pixels.
La propriété HALF
est définie par défaut sur 50.
Comme il s'agit d'une propriété globale, tous les champs d'angle seront modifiés lorsqu'ils seront définis.
Modes courants
Vous pouvez utiliser la direction et la position zéro pour créer des combinaisons amusantes. Voici deux problèmes courants:
Rapporteur
0 degré à droite, 90 degrés en haut.
Blockly.FieldAngle.CLOCKWISE = false;
Blockly.FieldAngle.OFFSET = 0;
Boussole
0 degré est en hausse, 90 degrés est à droite.
Blockly.FieldAngle.CLOCKWISE = true;
Blockly.FieldAngle.OFFSET = 90;
Créer un validateur d'angle
La valeur d'un champ d'angle est un nombre. Tous les validateurs doivent donc l'accepter et renvoyer un nombre, null
ou undefined
.
Voici un exemple de programme de validation qui force la valeur à être un multiple de 30:
function(newValue) {
return Math.round(newValue / 30) * 30;
}
Notez que la propriété [ROUND](#snapping)
du champ d'angle est toujours définie sur 15, de sorte que les éléments graphiques du champ affichent des multiples de 15 au lieu de 30.