Resolusi gambar untuk iPhone 6 dan 6+ baru, dukungan 3x ditambahkan?


141

Saya telah melihat beberapa artikel dan diskusi seperti di sini dan Di Sini tentang resolusi gambar yang akan digunakan iPhone baru @ 3x gambar untuk tampilan. Apakah itu benar

Jadi apakah itu berarti kita harus menyimpan tiga gambar? Katakanlah misalnya saya memiliki gambar 50 X 50, apakah saya harus menyimpan 3 gambar untuk mengoptimalkan tampilan iPhone baru?

  • Normal (50 X 50)
  • @ 2x - Retina (100 X 100)
  • @ 3x - Retina HD (150 X 150)

Atau akankah ponsel baru menggunakan @ 2x gambar saja dan tidak ada yang seperti @ 3x?

Saya telah menguji dengan membuat proyek sampel dan semua simulator tampaknya menggunakan @ 3x gambar, ini membingungkan.

Edit

Berikut ini beberapa info lebih lanjut

  • 3GS (163 ppi jadi gunakan Normal)
  • 4, 4s, 5 dan 5s (326 ppi jadi kami menggunakan @ 2x)
  • 6 (326 ppi jadi sepertinya akan menggunakan @ 2x)
  • 6 plus (401 ppi di sini letak kebingungan)

Edit

Berdasarkan Jawaban yang diberikan oleh Tsob dan nitin, saya menambahkan @ 3x gambar ke proyek saya.

Edit Informasi

Saya melihat beberapa pengguna bingung mengapa iPhone 6 menggunakan @ 2x gambar walaupun memiliki resolusi lebih tinggi, alasannya adalah

iPhone 6 mungkin memiliki resolusi yang berbeda tetapi memiliki kerapatan per pixel inci (PPI) yang sama

  • Resolusi menyangkut jumlah absolut piksel.
  • Kepadatan (alias Piksel per inci - PPI) menyangkut jumlah relatif piksel per inci yang sama untuk iPhone 6 dan iPhone sebelumnya, tetapi berbeda pada iPhone 6 plus.

Periksa lebih lanjut tentang ini di sini di utas ini

Oleh karena itu iPhone 6 menggunakan @ 2x gambar yang sama dengan iPhone 4, 5 dan 5S karena memiliki PPI yang sama dan iPhone 6 plus menggunakan @ 3x.


Lalu apa gunanya Retina 4 2x, jika tidak ada perangkat yang menggunakannya?
Mrunal

1
Saya setuju bahwa kepadatannya sama untuk iPhone 4, 5 dan 6 tetapi bagaimana cara mengatasi masalah resolusi yang berbeda? Jadi perbedaan besar 640x960 dan 750 × 1334 piksel. Jika saya perlu menggunakan gambar latar belakang yang menutupi seluruh layar. Bagaimana saya bisa mengatur xcassets gambar dalam kasus ini?
Matrosov Alexander

@MatrosovAlexander bagaimana Anda menyelesaikannya?
Mário Carvalho

sebagai solusi Saya menggunakan iphone 6 gambar untuk @ 2x gambar juga tetapi starnge bahwa xcode tidak memiliki gambar yang sesuai untuk itu
Matrosov Alexander

Jawaban:


54

Saya sudah mencoba dalam proyek sampel untuk menggunakan gambar standar, @ 2x dan @ 3x, dan simulator iPhone 6+ menggunakan gambar @ 3x. Jadi sepertinya ada @ 3x gambar yang harus dilakukan (jika simulator benar-benar mereplikasi perilaku perangkat). Tetapi yang aneh adalah bahwa semua perangkat (simulator) tampaknya menggunakan gambar @ 3x ini ketika berada pada struktur proyek, iPhone 4S / iPhone 5 juga.
Kurangnya komunikasi dari Apple pada struktur potensial @ 3x, sementara mereka meminta pengembang untuk menerbitkan aplikasi iOS8 mereka cukup membingungkan, terutama ketika melihat hasil tersebut di simulator.

** Edit dari Situs Web Apple **: Juga menemukan ini di bagian "Apa yang baru di iOS 8" di ruang pengembang Apple:

Dukungan untuk Skala Layar Baru iPhone 6 Plus menggunakan layar Retina HD baru dengan skala layar 3,0. Untuk memberikan pengalaman terbaik pada perangkat ini, sertakan karya seni baru yang dirancang untuk skala layar ini. Dalam Xcode 6, katalog aset dapat menyertakan gambar dengan ukuran 1x, 2x, dan 3x; cukup tambahkan aset gambar baru dan iOS akan memilih aset yang benar saat berjalan di iPhone 6 Plus. Perilaku memuat gambar di iOS juga mengenali sufiks @ 3x.

Masih tidak mengerti mengapa semua perangkat tampaknya memuat @ 3x. Mungkin itu karena saya menggunakan file biasa dan bukan xcassets? Akan segera dicoba.

Edit setelah pengujian lebih lanjut: Ok sepertinya iOS8 sudah bicara soal ini. Saat menguji pada iOS iOS 5 iPhone 5 simulator, ia menggunakan dengan benar gambar @ 2x. Tetapi ketika meluncurkan hal yang sama pada iOS 8 menggunakan @ 3x pada iPhone 5. Tidak yakin apakah itu perilaku yang diinginkan atau kesalahan / bug di iOS8 GM atau simulator di Xcode 6 sekalipun.


2
Ya saya diuji dengan simulator, semua perangkat mengambil gambar @ 3x, memang membingungkan
Bhumit Mehta

Jadi sebagai kesimpulan, pada hari ini jalur terbaik yang mungkin akan memanfaatkan "@ 2x" dalam nama gambar tapi entah bagaimana memeriksa perangkat untuk 6 Plus dan menggunakan gambar 3x TANPA "@ 3x" sehingga tidak meracuni perangkat 2x?
darkheartfelt

Tampaknya pilihan 3x pada iPhone 6 hanya terjadi jika aset yang dimaksud adalah JPG, bukan PNG.
emreberge

102

MEMPERBARUI:

Tautan baru untuk ukuran gambar ikon dengan apel.

https://developer.apple.com/ios/human-interface-guidelines/graphics/image-size-and-resolution/

masukkan deskripsi gambar di sini


Ya, Benar di sini, Apple memberikan dokumentasi resmi tentang ukuran ikon atau gambar

masukkan deskripsi gambar di sini

Anda harus mengatur gambar untuk iPhone6 ​​dan iPhone6 ​​+

Untuk iPhone 6:

750 x 1334 (@2x) for portrait

1334 x 750 (@2x) for landscape

Untuk iPhone 6 Plus:

1242 x 2208 (@3x) for portrait

2208 x 1242 (@3x) for landscape

Untuk info lebih lanjut tentang Gambar dan resolusinya, ini adalah posting terbaik yang pernah membantu

Untuk mengatur ukuran gambar untuk kontrol, Anda dapat mengatur 1x @ 2x dan @ 3x seperti berikut:

masukkan deskripsi gambar di sini


8
jika semua perangkat retina 2x atau 3x mengapa katalog aset meminta gambar 1x pada proyek untuk penargetan untuk iPhone hanya di iOS 7/8? Tidak masuk akal.
Bebek

1
mungkin itu untuk iphone4 @RubberDuck :) lihat bahwa ipad 2 dan iPad Mini yang membutuhkan 1x
Nitin Gohel

maaf tetapi Anda tidak membaca apa yang saya tulis. Saya berbicara tentang proyek hanya iPhone untuk iOS 7. Tidak ada iphone dengan 1x yang dapat menjalankan iOS 7 tetapi katalog aset masih memintanya.
Bebek

@RubberDuck Pilih aset gambar Anda dan kemudian lihat panel utilitas di sisi kanan Xcode. Salah satu tab memiliki seperangkat kotak centang. Mungkin aset Anda memiliki terlalu banyak kotak centang yang dipilih sehingga 1x muncul sebagai opsi.
rmaddy


10

Saya telah menguji dengan membuat proyek sampel dan semua simulator tampaknya menggunakan @ 3x gambar, ini membingungkan.

Buat versi gambar yang berbeda di katalog aset Anda sehingga gambar itu sendiri memberi tahu Anda versi apa itu:

masukkan deskripsi gambar di sini

Sekarang jalankan aplikasi pada setiap simulator secara bergantian. Anda akan melihat bahwa gambar 3x hanya digunakan pada iPhone 6 Plus.

Hal yang sama berlaku jika gambar diambil dari bundel aplikasi menggunakan nama mereka (misalnya one.png , one@2x.png , dan one@3x.png ) dengan memanggil imageNamed:dan menetapkan ke dalam tampilan gambar.

(Namun, ada perbedaan jika Anda menetapkan gambar ke tampilan gambar di Interface Builder - versi 2x diabaikan pada perangkat resolusi ganda. Ini mungkin bug, tampaknya bug pathForResource:ofType:.)


1
Anda telah menandai aset sebagai "universal", karenanya mengapa Anda melihat perilaku yang konsisten. Coba pilih "spesifik perangkat" di menu drop-down!
Nikolay Spassov

1
@RalphZhouYuan Sekarang bekerja dengan baik untuk saya. Anda tidak akan melihat versi 2x tercantum , tetapi hanya menetapkan versi 1x dan versi 2x atau 3x akan digunakan dengan benar. Atau, cukup gunakan katalog aset.
matt

1
@RalphZhouYuan Inilah contoh yang dapat saya unduh: github.com/mattneub/Programming-iOS-Book-Examples/tree/master/… - ini menampilkan keduanya menggunakan file gambar dalam bundel aplikasi dan file gambar dalam katalog aset dan semuanya bekerja dengan benar.
matt

3
@matt Saya akhirnya menemukan bahwa masalah saya terkait dengan pengaturan target penempatan (yaitu 6.0) dari aplikasi saya. Saya membuka pertanyaan: stackoverflow.com/questions/26333278/… dan meluncurkan laporan bug ke Apple.
inexcii

1
@RalphZhouYuan Wow, detektif hebat melacak itu! Terima kasih telah melaporkan kembali.
matt

2

ios akan selalu mencoba untuk mengambil gambar terbaik, tetapi akan kembali ke opsi lain .. jadi jika Anda hanya memiliki gambar normal di aplikasi dan perlu @ 2x gambar itu akan menggunakan gambar normal.

jika Anda hanya memasukkan @ 2x dalam proyek dan Anda membuka aplikasi pada perangkat normal itu akan menurunkan skala gambar untuk ditampilkan.

Jika Anda menargetkan perangkat ios7 dan ios8 dan menginginkan kualitas terbaik, Anda memerlukan @ 2x dan @ 3x untuk ponsel dan normal dan @ 2x untuk aset iPad, karena tidak ada ponsel retina yang tersisa dan tidak ada iPad @ 3x.

mungkin lebih baik membuat aset dalam aplikasi dari grafik vektor ... periksa http://mattgemmell.com/using-pdf-images-in-ios-apps/


cukup gunakan PaintCode yang luar biasa untuk vektor di aplikasi
Fattie
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.