Pixi.js: Mengatur jangkar seharusnya tidak menggambar ulang konten objek tampilan

Dibuat pada 11 Apr 2018 · 4Komentar · Sumber: pixijs/pixi.js

Hai,

meskipun pivot dan jangkar itu sangat membingungkan, Jika saya membayangkan jangkar sebagai titik bulat yang dapat saya atur di photoshop atau editor flash lama sebagai titik rotasi, yang terjadi di pixi adalah semua konten objek tampilan digambar ulang dengan mengatur jangkar sebagai asalnya titik.

var app = new PIXI.Application(800, 600, {backgroundColor : 0x1099bb});
document.body.appendChild(app.view);

var bunny = PIXI.Sprite.fromImage('required/assets/basics/bunny.png');

var container = new PIXI.Sprite();
container.addChild(bunny);
container.x = 0;
container.y = 0;

app.stage.addChild(container);

bunny.anchor.set(0.5);
//bunny_c.pivot.set(15,5);

Dengan contoh ini saya berharap kelinci berada dengan jangkar yang mempengaruhi rotasinya berubah tetapi kelinci tidak digambar ulang!

💾 v4.x (Legacy) 🤔 Question

Sumber

DavidGOrtega

Semua 4 komentar

Setiap elemen memiliki transformasi, yaitu posisi/rotasi/poros
Sprite memiliki jangkar, yang berarti "titik tekstur ini harus berada di (0,0) dari sistem koordinat lokal".

Poros rotasi selalu (0,0) dari sistem koordinat lokal.

Jika Anda menginginkan perilaku yang berbeda, Anda dapat mengubah kelas Transform dan membuat instance Transform yang ditambal untuk elemen yang terpengaruh.

https://github.com/pixijs/pixi.js/blob/dev/src/core/display/TransformStatic.js
https://github.com/pixijs/pixi.js/blob/dev/src/core/sprite/Sprite.js#L174

Juga, kelinci adalah redrawn setiap frame dalam pixi. Perpustakaan tidak memiliki mekanisme untuk melacak semua perubahan, itu hanya berfungsi. Kalau tidak, beratnya bisa 3MB atau lebih :)

ivanpopelyshev pada 11 Apr 2018

Untuk kasus Anda, lebih baik mengatur pivot ke pusat kelinci. Pastikan untuk melakukannya dengan konstanta, gunakan bunny.texture.width hanya saat dimuat.

ivanpopelyshev pada 11 Apr 2018

👍1

@DavidGOrtega menutup ini karena saya merasa pertanyaan Anda telah dijawab. Jangan ragu untuk membuka kembali jika Anda memiliki masalah lebih lanjut!