iOS - Verschiedene Bilder auf dem Gerät ODER Skalierung des gleichen Bildes?

8

Es sieht so aus, als ob Entwickler immer unterschiedliche Bild-Assets für verschiedene Geräte erstellen und sie basierend auf dem Gerät laden. Aber gibt es irgendwelche Nachteile, wenn man nur Bilder für das Gerät mit der größten Auflösung (iPad) erstellt und dieses Bild dann für das iPhone 6, 5 usw. skaliert?

Ich benutze SpriteKit, also würde ich einfach SKSpriteNodes in verschiedenen Größen erstellen und ihnen die gleiche Textur zuweisen und sie skalieren, um sie an den Knoten anzupassen.

Ich weiß, dass Leistung etwas sein kann (Laden großer Bilder für ältere Geräte). Aber abgesehen davon, gibt es noch etwas? Würden diese Bilder mehr pixelig / verschwommen erscheinen?

    
Alex K 26.02.2015, 00:52
quelle

5 Antworten

3

Die perfekte / puristische Antwort wäre, separate Bilder und Codes für jede Geräteauflösung zu verwenden.

Aus Ihrer eigenen Zeit- und Vernunftperspektive ist es jedoch sinnvoll, ein begrenztes Set zu verwenden, da die Anzahl der Auflösungen und Bildschirmgrößen in absehbarer Zeit nicht geringer wird. Warum also Stunden verschwenden, um mehrere Bilder zu erstellen, wenn dies nicht durch xcode vereinfacht werden kann.

Für Bilder mit einem quadratischen oder festen Seitenverhältnis denke ich, dass Sie nur ein Bild benötigen. Es gibt ein Problem mit Bildern wie Hintergründen, bei denen unabhängig von der Auflösung mindestens die verschiedenen Seitenrationen berücksichtigt werden müssen. Daher sind separate Bildseitenverhältnisse unerlässlich (wie 3: 2 und 16: 9), es sei denn, es ist Ihnen nichts auszumachen oder beschneidet die Bilder.

Wenn Sie beim Testen Probleme mit der Leistung feststellen, können Sie später Bilder mit geringerer Auflösung hinzufügen.

Was die Pixelierung betrifft, können Sie das nicht vermeiden. Wenn Sie darüber nachdenken, was passiert, wenn Sie von einer x3- auf eine x1-Auflösung wechseln, müssen Sie 3x3 Pixel in 1x1 mixen. Bei hoher Auflösung wird alles, was eine einzelne Pixelbreite (wie eine Linie) oder eine schnelle Farbänderung über ein paar Pixel aufweist, am meisten leiden. Es gibt viele Artikel online, über die Sie schauen können.

Die einzige Möglichkeit, Pixelierung zu vermeiden, wäre die Verwendung von Vektorbildern, die jedoch eine spezielle Software erfordern, um Vektorbilder zu laden und sie in UIImagie zu rendern.

Jedes Bild wird anders leiden, wenn Sie es verkleinern. Ein Gedanke könnte sein, für x2 Bilder zu gehen, die Sie 1 für iPhone 3 und 1 bis x3 für iPhone 6+ herunterskalieren. Das würde die Mehrheit der aktuellen Geräte mit nativer Auflösung abdecken und vielleicht weniger auffällige Pixelierung bieten.

    
Rory McKinnel 26.02.2015, 01:11
quelle
2

Es kommt darauf an. Es ist natürlich wirtschaftlicher, ein Bild oder ein Bild pro Seitenverhältnis zu verwenden, wenn das Abschneiden des Bildes ein Problem darstellen würde.

Bei Bildern wie Fotos kann dies durchaus akzeptabel sein, da diese Art von Bildern tendenziell keine pixelperfekten Merkmale enthält.

Wenn es sich jedoch um Grafik handelt - dünne Linien, scharfe Konturen, pixelgenaue Features - kann die Skalierung die Qualität stark beeinträchtigen.

Betrachten Sie das folgende Beispiel: Stellen Sie sich vor, Sie möchten ein benutzerdefiniertes Textfeld mit einer festen Größe erstellen. Der Textbereich wird von einem schwarzen Umriss mit einer Linienbreite von 1px umschlossen. Sie verwenden die Retina-Auflösung für Ihre Grafik und Ihr Startpunkt ist die 4 "Bildschirmgröße. Wie wird die Box auf anderen Bildschirmgrößen angezeigt, vorausgesetzt, das Textfeld skaliert mit dem Bildschirm? Und wie wird es auf einem nicht aussehen -retina Anzeige?

Nicht-Retina: Die Auflösung muss halbiert werden. Stellen Sie sich einen Block von 2x2 Pixeln in Ihrem Kunstwerk vor - er muss in einem einzigen Pixel berechnet werden. Unser Umriss ist nur 1 Pixel breit, so dass ein 2x2-Pixel-Block mit einer durchlaufenden Linie zwei schwarze und zwei weiße Pixel enthält. Das resultierende Nicht-Retina-Pixel wird grau sein. In Wirklichkeit ist die Skalierung etwas komplexer, aber das Ergebnis wird eine verschwommene, weniger schwarze und etwas dickere Linie sein.

Scaled Retina: Auflösung muss erhöht werden. Stellen Sie sich ein Gerät mit einer Auflösung von 1,5x des 4-Zoll-Bildschirms vor. Die 1px-Linie müsste 1,5 Pixel breit werden, was natürlich nicht funktioniert. Stattdessen wird die ursprüngliche 1px-Linie auf eine Grauskala gestreckt zwei (oder mehr) Pixel, die ungefähr der "Menge an Schwärze" entsprechen, die eine 1,5px-Linie haben würde.

Bei jeder Skalierung (nach oben oder nach unten) wird die Kontur verschwommen, dicker und weniger schwarz.

Das Beispiel ist nicht perfekt, weil iOS Bilder mit dehnbaren, perfekt skalierbaren Teilen definieren kann. Für unsere rechteckige Box wäre dies tatsächlich möglich. Es funktioniert jedoch nicht für komplexere Kunstwerke.

Wenn die Pixel-Perfektion ein Muss ist, gibt es bei jeder Auflösung oder Vektorgrafiken keine Bilder (Quartz / SVGKit ). ..)

Bearbeiten: Ich habe mein Beispiel in Photoshop mit bilinearer Skalierung reproduziert. Auf dem Gerät kann dies etwas anders aussehen, da möglicherweise ein anderer Skalierungsalgorithmus verwendet wird. Aber ich denke, du wirst den Punkt verstehen ...

    
Toastor 26.02.2015 10:31
quelle
1

Ich habe schon länger den Eindruck, dass ein einzelnes Bild, das Sie später skalieren würden, auch in Ordnung ist.

Für die Vielzahl der Möglichkeiten, dies zu tun, zusammen mit einigen Benchmarks, schauen Sie sich NSHispter: Image Resizing Techniques

an >

Und für weitere Informationen lesen Sie die Kernbild Apple doc, das im NSHipster-Artikel ebenfalls erwähnt wird.

    
Louis Tur 26.02.2015 01:44
quelle
0

Niemand hat tatsächlich geantwortet, ob die Bildqualität reduziert würde. Ich habe gerade versucht, dies zu implementieren, und die Bilder erscheinen etwas pixeliger, als wenn sie in ihrer ursprünglichen Größe gehalten würden.

    
Alex K 26.02.2015 07:17
quelle
0

Ich kann aus meiner Erfahrung in Bezug auf die Speichernutzung antworten. Genug Leute haben über die Bildqualität geantwortet. Das einzige andere Problem ist die Speichernutzung. Ich habe die Technik, die du in meinem Spiel Piston Flip beschrieben hast, benutzt und es hat gut funktioniert, weil ich nicht viele Texturen oder Knoten benutzt habe. In einem anderen Spiel, an dem ich gerade arbeite, kann ich es mir nicht leisten, große Bilder zu verwenden und sie zu skalieren, da jedes Gerät nur die Kacheln laden kann, die für seine Bildschirmgröße festgelegt wurden.

Es kommt also wirklich darauf an.

    
bricksmart 15.08.2015 01:38
quelle

Tags und Links