Tailles et scaling
Scaling du dashboard
La largeur d’un dashboard permet de positionner les tuiles avec des tailles différentes sur un même espace. Elle définit le nombre de cases unitaires qui constituent la largeur complête. La largeur totale en pixels dépend de la taille de la fenêtre sur l’écran de l’utilisateur. Dans l’exemple suivant, les mêmes tuiles ont été disposées sur une largeur de 27 puis sur une largeur de 24. La partie grise représente la zone où va apparaitre le fond d’écran de l’utilisateur.
Dashboard avec width="27"
Dashboard avec width="24"
Le comportement en terme de taille ne dépend ensuite que de la taille de l’écran de l’utilisateur. La spécification définit que le système alloue deux unités supplémentaires comme marge de chaque coté du dashboard. Cette allocation peut être réduite en fonction de la taille de l’écran, au choix au niveau de l’implémentation de ces spécifications.
Voici des exemples de calculs donnant la taille unitaire d’une tuile et le calcul de la taille des marges
| Taille de l’écran | Width | Taille unité | Taille tuile | Taille marge |
|---|---|---|---|---|
| 1300px de large | 24 | 1300/(24+2) = 50 | Un carré 1x1 fait 50x50 | (1300 - (50 * 24)) = 50 + 50 |
| 700px de large | 24 | 700/(24+2) = 26.92 | Un carré 1x1 fait 27x27 | (700 - (27 * 24)) = 26 + 26 |
| 701ox de large | 24 | 701/(24+2) = 26.96 | Un carré 1x1 fait 50x50 | (701 - (27 * 24)) = 26 + 27 |
| 1300px de large | 27 | 1300/(27+2) = 44.82 | Un carré 1x1 fait 45x45 | (1300 - (45 * 27)) = 43 + 42 |
| 700px de large | 27 | 700/(27+2) = 24.13 | Un carré 1x1 fait 25x25 | (700 - (25 * 27)) = 13 + 12 |
| 701ox de large | 27 | 701/(27+2) = 24.17 | Un carré 1x1 fait 25x25 | (701 - (25 * 27)) = 13 + 13 |
Scaling des titres
le scaling des textes des tuiles du dashboard suivent des règles bien définies. Il existe deux types de scaling :
- Le scaling Horizontal qui définit ce qui se passe lorsque le titre dépasse en largeur de la tuile.
- Le scaling Vertical qui se base sur la place disponible en hauteur dans une tuile.
Le scaling Horizontal est strict. Il se base sur la capacité d’un label dans sa taille donnée de rentrer dans la tuile.
Si le texte est trop large, le système doit remplacer le texte par le texte plus petit fourni par la configuration. Il existe
trois définitions de textes dans une tuile :
- label
- shortLabel
- veryshortLabel
Si le texte ne rentre pas avec le label, le système utilise le shortLabel, et ainsi de suite.
Si le veryShortLabel ne rentre pas, il est tronqué
Le choix de la font du titre dans le cas du scaling vertical est plus souple. En effet, si le système est capable d’avoir une taille
de font dynamique, la taille est alors définie en fonction de la taille de la tuile et de la présentation de la tuile (ex : tuile de type Title).
Si le système n’est pas capable de redimensionner dynamiquement des fonts, il devra utiliser une font de taille fixe disponible la plus proche
de la taille demandée