Affichage GWT, mgwt et retina

Question

J'ai implémenté une application iOS basée sur mgwt et PhoneGap.

J'ai une image

<g:Image url="resources/img/topMenuTitle.png"></g:Image> 

et deux fichiers correspondants topMenuTitle.png (320px par 40px) et topMenuTitle@2x.png (640px par 80px). Je ne sais pas quelle est la meilleure façon d'afficher l'image dans l'affichage de la rétine lorsqu'elle est appliquée (par exemple, chargez topMenuTitle@2x.png lorsque le périphérique prend en charge l'affichage rétine et topMenuTitle.png dans le cas contraire).

Jusqu'à présent, j'ai essayé d'utiliser retina.js mais cela n'a pas fonctionné. Je suppose que Retinajs traite les images au moment où la page se charge, et ne traite pas les images qui apparaîtront plus tard.

Answer 1

Avec mgwt il y a une variable de liaison différée mgwt.os. Il peut avoir différentes valeurs:

<define-property name="mgwt.os" values="iphone, ipad, retina, ipad_retina, android, android_tablet, blackberry, desktop" /> 

Vous pouvez utiliser cette variable et utiliser différentes ressources dans votre application. Jetez un oeil à la thématisation façon dont on fait en mgwt pour voir comment fournir des images différentes:

http://code.google.com/p/mgwt/wiki/Styling

si vous cherchez un moyen facile de charger une image que vous pouvez faire quelque chose comme:

OsDetection d = MGWT.getOsDetection(); 

Image img = null; 
if(d.isRetina() || isIPadRetina()){ 
    img = new Image("retinaurl"); 
}else{ 
    img = new Image("nonretinaurl"); 
} 

Bien sûr, une meilleure façon de le faire est d'utiliser la liaison différée, mais c'est correct pour certaines images dans votre code.

Answer 2

Utilisez DeferredBinding. Voici un exemple:

http://retina.teknonsys.com/