|
|
|
|
|
- Présentation
- Mise en place
- Comment le faire ?
- Remarques
Fournir une image par DPI
Sur mobile, pour l'affichage des images, chaque matériel a une taille physique et une résolution graphique spécifiques. Arrêtons-nous un instant sur les termes liés à la gestion des écrans et des images : - la taille d'un écran est exprimée en pixels. La taille d'un écran correspond à la largeur et la hauteur d'un écran en nombre de pixels.
- la finesse d'un écran (ou résolution d'affichage) est exprimée en "dpi" (dots per inch) ou "ppi" (pixels per inch). En français, c'est le nombre de points à afficher par pouce ou le nombre de pixels par pouce (un pouce équivaut à 2.54 cm). Plus cette valeur est élevée, plus l'affichage est net, fin et précis.
Un même fichier image, sur 2 écrans de même taille physique mais de résolution différente, peut se retrouver affiché en petit ou en grand. Pour éviter cela, et afficher l'image dans une taille identique, les images sont affichées dans un mode "étiré". - Dans le cas des écrans haute définition, il se peut que l'image affichée soit pixelisée.
- Dans le cas des écrans basse définition, c'est l'inverse : si l'image est en trop haute définition, il se peut que sa réduction provoque un flou.
Pour résoudre ce problème, WINDEV Mobile propose pour chaque image utilisée dans l'application de fournir plusieurs fichiers image différents, adaptés à différents DPI. A l'exécution, l'image la plus adaptée à la résolution sera automatiquement choisie.
Comment le faire ? Pour gérer automatiquement le DPI d'une image utilisée dans l'application : - Créez un jeu d'images correspondant aux différents DPI.
- 5 DPI sont gérés : 160, 240, 320, 480, 640.
- 3 DPI sont gérés : 160, 320, 480.
- Le nom de ces images doit être formaté de la façon suivante :
NomImage@dpi99x.Extension Où 99x correspond au coefficient multiplicateur par rapport au DPI de l'éditeur. L'éditeur travaille en 160 DPI. Par exemple, pour une image "Logo.png", le jeu d'images sera : - "Logo@dpi1x.png" pour le DPI de 160. Sous Android, correspond à mdpi.
- "Logo@dpi1_5x.png" pour le DPI de 240. Sous Android, correspond à hdpi.
- "Logo@dpi2x.png" pour le DPI de 320. Sous Android, correspond à xhdpi.
- "Logo@dpi3x.png" pour le DPI de 480. Sous Android, correspond à xxhdpi.
- "Logo@dpi4x.png" pour le DPI de 640. Sous Android, correspond à xxxhdpi.
- Sous l'éditeur, dans le champ correspondant au fichier image, sélectionnez un des fichiers du jeu d'images.
Lors de la création de l'archive Android ou iOS, WINDEV Mobile intégrera automatiquement l'ensemble des images fournies dans l'archive. Remarques - Il n'est pas obligatoire de fournir une image pour les 5 DPI gérés. En exécution, l'image la plus proche du DPI de l'écran de l'appareil sera affichée automatiquement.
- Veillez à respecter les formats d'images supportés par la plateforme utilisée.
- Pour certaines images (splash screen, icone de l'application, ...), l'interface de l'éditeur propose également de sélectionner un fichier par résolution. Dans ce cas, les deux méthodes peuvent être utilisées (sélection d'un fichier par résolution ou sélection d'un seul fichier au format multi-dpi).
- Le catalogue d'images génère automatiquement les différentes images nécessaires. Pour plus de détails, consultez Catalogue d'images.
- Les fichiers de type ".WDPIC" avec l'option "multi-dpi", générés par l'éditeur d'images, sont automatiquement gérés : il n'est pas nécessaire de générer les différentes images correspondant aux différents DPI.
Attention : Si un fichier de type ".WDPIC" doit être affecté par programmation à un champ, il est nécessaire que ce fichier ait préalablement été ajouté dans la liste des éléments du projet.
Documentation également disponible pour…
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|