Pixi.js: Animasi spritesheet yang bergetar di iOS

Dibuat pada 16 Feb 2017  ·  29Komentar  ·  Sumber: pixijs/pixi.js

Contoh: http://moonrat.co.uk/html5/pixi-ios-animation-bug/

Apa yang Anda lihat adalah 3 ukuran animasi, x0.5 di bagian atas, lalu x0.75 di tengah dan x1 di bagian bawah. Di sisi kiri jalur rendering reguler diambil, di sisi kanan tiga animasi menggunakan pixi-picture.

Sekarang, saya _hanya melihat masalah ini pada perangkat iOS dalam mode WebGL_. Peramban lain, bahkan Safari di Mac, berfungsi dengan baik. iOS dalam mode kanvas, baik-baik saja. Tetapi perangkat iOS (iPad dan iPhone) yang menggunakan WebGL... goyah

@ivanpopelyshev menyarankan untuk mencoba pixi-picture, untuk rendering yang lebih akurat, dan itu membantu pada sebagian besar perangkat, tetapi tidak pada semua, dan sangat jarang menghilangkan masalah

Berikut adalah daftar bagaimana semua perangkat iOS yang saya lihat pada contoh di atas

iPad Mini 2: 10.0.2 - pixi bergetar, pixi-picture tidak
iPad 4: 8.4 - pixi bergetar, pixi-picture melakukannya, tetapi kurang begitu
iPad Air: 10.2 - pixi getar, pixi-picture tidak
iPad Air: 10.3 - pixi bergetar, pixi-picture tidak
iPad Air2: 8.3 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu

iphone 4s: 9.1 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone 4s: 9.2.1 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone 5: 9.1 - pixi bergetar, pixi-picture juga
iphone 5: 10.1 - pixi bergetar, gambar pixi juga
iphone 5s: 10.0.2 - pixi bergetar, pixi-picture tidak
iphone 6: 8.2 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone 6: 10.0.2 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone 6+: 8.4 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone 6+: 9.2.1 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu
iphone se: 10.2 - pixi bergetar, pixi-picture tidak
iphone 7: 10.2 - pixi bergetar, pixi-picture tidak, tetapi kurang begitu

Ada ide?

💾 v4.x (Legacy)

Komentar yang paling membantu

Jika masalahnya hanya sprite yang goyah di IOS, maka ya, lakukan "jika ios maka setel fragmen presisi ke tinggi".
Jika bukan ios, maka plugin gambar mungkin diperlukan. Tapi itu bukan hanya untuk masalah ios saya :)

Semua 29 komentar

Informasi tambahan; goyangan ini TIDAK terjadi pada pixi v3 terakhir: http://moonrat.co.uk/html5/pixi-ios-animation-bug-v3/

v3 lebih baik? Itu menarik

Saya memiliki masalah "goyangan" yang sama di iOS hanya ketika memutar beberapa bentuk (itu terjadi ketika sudutnya bergerak di sekitar 0). Tidak dapat kembali ke v3…

satu-satunya perbedaan yang saya pikir mungkin adalah bahwa kita menyimpan data vertex dalam array float32 di v4? Mungkin masalah presisi?

@GoodBoyDigital Saya mengujinya hari ini, @themoonrat mengatakan hal yang sama.

keren - mungkin presisi shader?

Apakah layak diuji dengan roundPixels disetel ke false untuk melihat apakah itu menghentikannya?

Pada Jumat, 17 Februari 2017 pukul 16:13 Mat Groves [email protected] menulis:

keren - mungkin presisi shader?


Anda menerima ini karena Anda berlangganan utas ini.
Balas email ini secara langsung, lihat di GitHub
https://github.com/pixijs/pixi.js/issues/3742#issuecomment-280692953 ,
atau matikan utasnya
https://github.com/notifications/unsubscribe-auth/AAipZJ8DLKkA3bRJQIOYcmTDpXZgfTehks5rdccygaJpZM4MDJtw
.

roundPixels salah secara default, saya sudah memeriksanya.

Tunggu, tunggu, itu mengingatkanku!

@ivanpopelyshev - Anda tahu bagaimana Anda meminta saya untuk mengubah presisi shader default ke highp dan itu tidak mengubah apa pun. Yah saya baru saja mencobanya pada versi baru yang Anda berikan kepada saya pagi ini, dan itu _memperbaikinya!

Oke, ini aneh.
Jadi.
Bahkan cabang dev saat ini, dengan highp untuk PRECISION berfungsi. Namun....

PIXI.settings.PRECISION = 'highp'
Tidak berfungsi
Jika Anda langsung masuk ke pixi.js, dan edit
PRECISION: 'mediump',
ke
PRECISION: 'highp',
Kemudian bekerja.

jadi, presisi tinggi + nilai ganda? Tampaknya konversi double->float->highp adalah hal yang buruk untuk iphone/ipad. Saya pikir itu karena tidak bulat, tetapi sebenarnya memotong banyak hal.

Jadi sepertinya ini adalah masalah pengaturan yang tidak diambil alih-alih yang lainnya

tangkapan yang bagus @themoonrat

k, saya punya perbaikan; itu karena gaya mengimpor pengaturan. Membuatnya statis untuk mengimpor waktu, daripada dinamis seperti saat ini. Segera naikkan PR

Juga kita benar-benar harus menggunakan Float64Array di Sprrite daripada Float32Array, yang akan sedikit mengurangi kesalahan.

EDIT: tidak akan, tetapi dengan beberapa tindakan lain bisa :)

@ivanpopelyshev saya pikir kami baik-baik saja - kami mengunggahnya sebagai float32 jadi tidak ada gunanya menahannya dengan presisi ganda..

Sayangnya saya masih mengalami goyangan pada iPad Mini3 dengan pixi4.4.1.
Saya secara manual menyetel PIXI.settings.PRECISION = 'highp', apa lagi yang harus saya lakukan?

Apakah Anda melihat peringatan penghentian di konsol? Jika ya maka Anda benar-benar menggunakan 4.4.1.

Apa kasus penggunaan Anda? Hanya beberapa sprite di panggung?

Ya, saya melihat peringatan penghentian penggunaan PIXI.settings.PRECISION_FRAGMENT.
Pengujian saya hanya memiliki 1 AnimatedSprite yang diputar pada 24fps (kecepatan 0,4).
Animasi dibuat dengan TexturePacker dan dimensi tekstur dasarnya adalah POT (2048x2048)
Dalam 4.4.1 ia bergoyang lebih sedikit dari sebelumnya, tetapi masih terlihat jitter.

Dan bagaimana jika Anda menggunakan penyaji gambar-pixi untuk itu? Cukup tambahkan yang ini: https://github.com/pixijs/pixi-picture/tree/master/bin dan tulis

sprite.pluginName = 'picture';

Besar! Menggunakan pixi-picture itu terlihat sempurna :)
Jadi ini adalah penyaji sprite alternatif?
Dalam kasus apa kita harus menggunakannya? (selain kasus yang jelas ini). Bisakah itu digunakan sebagai penyaji umum (mendukung pengelompokan multi-tekstur) atau lebih untuk tujuan tertentu?

Lalu saya tahu apa yang salah dengan penyaji sprite utama. Gambar pixi adalah hal bodoh yang tidak ditumpuk sama sekali, tetapi mengurangi artefak perbatasan dan mendukung mode campuran overlay/hardlight.

Perbedaan utama adalah bagaimana koordinat UV dilewatkan. Renderer sprite utama menggunakan Uint16, sedangkan gambar seperti semua plugin lainnya menggunakan Float.

FYI:
PIXI.settings.PRECISION_FRAGMENT = 'highp';
memecahkan animasi ios yang goyah untuk saya tanpa plugin apa pun

ps - @ivanpopelyshev , Anda membuat PRECISION_VERTEX 'highp' secara default untuk menyelesaikan ini, tetapi mungkin Anda memilih yang salah? Adakah kerugian bagi game saya untuk menurunkannya kembali ke 'mediump'?
pps - haruskah kita membuatnya agar pengaturan 'highp' diturunkan ke 'mediump' jika mode lawas diaktifkan?

Saya memiliki masalah yang sama dan saya menggunakan pixi v4.6.2. Ini bug yang sangat kritis bagi saya. @ivanpopelyshev , Adakah yang menyelesaikan masalah ini?

PIXI.settings.PRECISION_FRAGMENT = 'highp'
sebelum membuat penyaji

Ingat bahwa beberapa perangkat tidak mendukungnya, dan lebih baik mengaktifkan highp hanya pada perangkat tertentu yang ada goyangan.

Juga, gunakan plugin pixi-picture dan sprite.pluginName='picture' jika Anda ingin memperbaiki masalah untuk sejumlah kecil objek.

Jika masalahnya hanya sprite yang goyah di IOS, maka ya, lakukan "jika ios maka setel fragmen presisi ke tinggi".
Jika bukan ios, maka plugin gambar mungkin diperlukan. Tapi itu bukan hanya untuk masalah ios saya :)

@ivanpopelyshev , @themoonrat terima kasih, berhasil.

Utas ini telah dikunci secara otomatis karena tidak ada aktivitas terbaru setelah ditutup. Silakan buka edisi baru untuk bug terkait.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat