Présentation - Widget Séparateur
Le widget séparateur permet d'organiser les autres widgets dans la météo. Il peut par exemple être utilisé pour définir des sections ou des groupes de widget météo.
Plus d'informations sur les widgets séparateurs dans cette page : Widget Séparateur - Edition - Météo
Description
Pour le widget séparateur, il faut configurer :
- Sa position dans la grille et sa taille.
- Le texte à afficher
Les options du widget séparateur
- Sa partie gauche :
- l'afficher ou la cacher,
- la taille ( en pourcentage ) que prendra la zone affichée dans le widget.
- Sa partie réservée au texte :
- l'alignement du texte,
- la couleur du texte,
- le pourcentage du zoom de la taille de la police.
- Sa partie droite :
- l'afficher ou la cacher,
- la taille ( en pourcentage ) que prendra la zone affichée dans le widget.
Configuration
...
"grid_elements": [
{
"position_x": 0,
"position_y": 3,
"width" : "all",
"height" : 2,
"content" : {
"type" : "separator_widget",
"layout" : {
"information_to_display" : {
"left_area" : {
"displayed" : true,
"width_percent" : 10
},
"title_area" : {
"label" : "DATACENTER France",
"font_zoom_percent" : 100,
"text_color" : "#000000",
"text_align" : "center"
},
"right_area" : {
"displayed" : true,
"width_percent" : 10
}
}
}
}
}
]
... |
Positionnement et dimensionnement
Pour plus d'explication regarder la page Concept et paramétrage des widgets - Edition - Météo
...
"grid_elements": [
{
"position_x": 0,
"position_y": 3,
"width" : "all",
"height" : 2,
...
}
]
... |
| Nom | Type | Défaut | Commentaire | |
|---|---|---|---|---|
| Numéro de cellule | --- | Abscisse du point "le plus en haut à gauche" d'un widget :
| |
| Numéro de cellule | --- | Ordonnée du point "le plus en haut à gauche" d'un widget :
| |
| Nombre de cellules | --- | Correspond à la largeur du widget :
Si le paramètre "width" n'est pas présent dans la configuration du widget, c'est comme s'il valait "default". | |
| Nombre de cellules | --- | Correspond à la hauteur du widget :
Si le paramètre "height" n'est pas présent dans la configuration du widget, c'est comme s'il valait "default". |
Contenu du widget séparateur
...
"grid_elements": [
{
...
"content" : {
"type" : "separator_widget",
"layout" : {
"information_to_display" : {
"left_area" : {
...
},
"title_area" : {
...
},
"right_area" : {
...
}
}
}
}
}
]
... |
| Nom | Type | Défaut | Commentaire | |
|---|---|---|---|---|
| String | - | Type du widget, dans le cas du widget séparateur ce paramètre doit être obligatoirement défini à la valeur : separator_widget. | |
| Clé | - | La clé layout permet de gérer la disposition et l'affichage du widget. Seul la clé information_to_display pour le widget de type separator_widget peut être renseigné. | |
| Clé | - | La clé information_to_display doit être renseigné dans la clé layout. Elle permet de paramétrer l'affichage des différentes zones du widget. En l'occurrence : left_area, title_area et right_area. | |
La zone de gauche ( left_area )
...
"grid_elements": [
{
...
"content" : {
...
"layout" : {
"information_to_display" : {
"left_area" : {
"displayed" : true,
"width_percent" : 10
},
...
}
}
}
}
]
... |
| Nom | Type | Défaut | Commentaire | |
|---|---|---|---|---|
| Booléen | true | Affichage ou non de la zone de gauche.
| |
| Integer | 10 | Pourcentage du widget occupé par la zone de gauche. Doit être compris entre 0 et 100
|
La zone de titre ( title_area )
...
"grid_elements": [
{
...
"content" : {
...
"layout" : {
"information_to_display" : {
...
"title_area" : {
"label" : "DATACENTER FRANCE",
"font_zoom_percent" : 100,
"text_color" : "000000",
"text_align" : "center"
},
...
}
}
}
}
]
... |
| Nom | Type | Défaut | Commentaire | |
|---|---|---|---|---|
| String | - | Texte affiché dans le widget. Doit obligatoirement être défini. | |
| Integer | 100 | Zoom en pourcentage de la taille de la police. Doit être supérieur à 0 Une valeur de 200 affiche un texte deux fois plus gros Une valeur de 50 affiche un texte deux fois plus petit
| |
| Couleur Web | #000000 | Couleur d'affichage du texte.
| |
| String | center | Alignement du texte
|
La zone de droite ( right_area )
...
"grid_elements": [
{
...
"content" : {
...
"layout" : {
"information_to_display" : {
...
"right_area" : {
"displayed" : true,
"width_percent" : 10
}
}
}
}
}
]
... |
| Nom | Type | Défaut | Commentaire | |
|---|---|---|---|---|
| Booléen | true | Affichage ou non de la zone de droite.
| |
| Integer | 10 | Pourcentage du widget occupé par la zone de droite. Doit être compris entre 0 et 100
|
Exemple
...
"grid_elements": [
{
"position_x" : 0,
"position_y" : 2,
"width" : "all",
"height" : 2,
"content" : {
"type" : "separator_widget",
"layout" : {
"information_to_display" : {
"left_area" : {
"displayed" : true,
"width_percent" : 10
},
"title_area" : {
"label" : "DATACENTER FRANCE",
"font_zoom_percent" : 100,
"text_color" : "#030303",
"text_align" : "center"
},
"right_area" : {
"displayed" : true,
"width_percent" : 10
}
}
}
}
}
]
... |
Définir les valeurs par défaut du widget "séparateur" dans une météo
Dans le chapitre "layouts" de la grille, il suffit de définir / compléter le chapitre "separator_widget_layout" :
- il faut seulement définir les valeurs pour lesquels on souhaite mettre un paramètre par défaut;
- certains paramètres ne peuvent pas avoir de valeur par défaut :
- position_x,
- position_y,
- type,
- label.
- Si vous utilisez la valeur "default" pour un paramètre qui l'accepte, la valeur sera alors celle présente dans le fichier de configuration du module "
webui-module-service-weather".- Vous trouverez la définition de ces paramètres dans la page Configuration de la disposition par défaut des widgets.
...
"grid_elements": [
...
],
"layouts" : {
...
"separator_widget_layout" : {
"width" : "default",
"height" : "default",
"content" : {
"layout" : {
"information_to_display" : {
"left_area" : {
"displayed" : true,
"width_percent" : 10
},
"title_area" : {
"font_zoom_percent" : 100,
"text_color" : "#000000",
"text_align" : "center"
},
"right_area" : {
"displayed" : true,
"width_percent" : 10
}
}
}
}
},
...
}
... |