2012-03-29 9 views
0

Ich muss meine Anwendung zu aktualisieren, damit es Retina-Display in New iPad unterstützen kann, aber ich habe noch einige Zweifel darüber. Ist es richtig, dass wir ein neues Bild erstellen müssen, das die Auflösung für das Retina-Display unterstützt und trotzdem das letzte Bild für die Anwendung ohne Retina-Display-Unterstützung behält? Wenn ja, dann wird unsere App eine große Größe haben, oder? Gibt es eine Möglichkeit, es zu einem einzigen zu machen? Vielleicht verwenden Sie einfach das Bild mit hoher Auflösung, aber ändern Sie die Größe für die normale Anwendung (die Anwendung, die Retina-Display nicht unterstützt). Kann mir jemand helfen?wie Bild für iPad-Anwendung, die Retina-Display zu unterstützen

Antwort

0

Sie müssen zwei Bilder erstellen. eins für alte Auflösung und eins für Retina-Display. Wenn ich mich erinnere, haben Sie nur @ x2 auf Retina Bilder hinzufügen:

mypicture.jpg (old display) 

[email protected] (retina display) 

Ich hoffe, auf diese Weise auf das iphone ähnlich ist.

+0

Hallo! Ich bin mir nicht sicher, dass es immer funktionieren wird, ich habe etwas darüber gelesen. vielleicht funktioniert es für das SDK, aber nicht für die Webseiten. Bist du dir sicher? Ansonsten kann ich helfen, indem ich ein kleines js-Skript posten, das dieses Verhalten nachahmt. Es hängt auch davon ab, was Risma für "Anwendung" bedeutet. Wenn es wirklich eine "App" oder einfach eine responsive Website ist. Wie auch immer, lass es mich wissen. – Stratboy

+0

Ja, Sie haben Recht. Nur so funktioniert die ios-Anwendung. Für das Web habe ich das nicht gesehen. – Tobi

+0

Also, @Risma: brauchen Sie nur App-Code oder Web/Responsive-Code? – Stratboy

0

Für das Web können Sie weiterhin die @ 2x-Namenskonvention verwenden. Deklarieren Sie das Hintergrundbild und legen Sie die Größe fest. Rufen Sie in der Retina-Display-Medienabfrage das hochauflösende Bild auf.

figure{background-image:url(../img/imageName.png);background-size:57px 57px;} 

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), 
    only screen and (-o-min-device-pixel-ratio: 3/2), 
    only screen and (min--moz-device-pixel-ratio: 1.5), 
    only screen and (min-device-pixel-ratio: 1.5) { 

figure{background-image:url(../img/[email protected]);} 

} 

Es gibt Nebenserverlösungen Auch hier ist eine: Link

Verwandte Themen