Penjana Sprite Sheet
Gabungkan imej menjadi sprite sheet dengan seret untuk menyusun semula, reka letak grid, padding, mod skala. Eksport PNG/WebP/JPG dengan data JSON atlas untuk enjin permainan dan CSS.
Apakah sprite sheet dan mengapa menggunakannya?
Sprite sheet ialah satu fail imej yang mengandungi beberapa imej kecil (sprite) yang disusun dalam grid. Menggunakan sprite sheet mengurangkan permintaan HTTP, meningkatkan prestasi pemuatan halaman, dan menjadikan penerbitan permainan lebih cekap.
Format imej apa yang disokong?
Anda boleh memuat naik imej PNG, JPG, GIF, SVG, dan WebP. Alat ini menyokong muat naik pukal dan tampal dari papan keratan (Ctrl+V) untuk aliran kerja yang pantas.
Format eksport apa yang tersedia?
Eksport sprite sheet sebagai PNG (dengan ketelusan), WebP (format moden dengan saiz fail lebih kecil), atau JPG (terbaik untuk foto tanpa ketelusan). Pilih berdasarkan keperluan platform sasaran anda.
Bagaimana cara menyusun semula imej dalam sprite sheet?
Seret dan lepas imej kecil untuk menyusun semula kedudukannya dalam sprite sheet. Anda juga boleh menampal imej terus dari papan keratan menggunakan Ctrl+V.
Apakah data JSON atlas dan enjin apa yang menyokongnya?
Data JSON atlas mengandungi kedudukan, saiz, dan maklumat bingkai untuk setiap sprite. Ia serasi dengan enjin permainan popular seperti Phaser, PixiJS, Unity, Cocos2d, dan banyak lagi untuk pengekstrakan sprite automatik.
Apakah mod skala yang berbeza?
Muat mengekalkan nisbah. Isi meliputi sel dan memotong lebihan. Regang mendistorsi untuk mengisi.
Adakah alat ini menyokong ketelusan?
Ya, PNG dan WebP mengekalkan ketelusan. Anda juga boleh menetapkan warna latar belakang tersuai, yang berguna untuk eksport JPG yang tidak menyokong ketelusan.
Bagaimana padding mempengaruhi sprite sheet?
Padding menambah ruang antara sprite individu dalam helaian, mencegah pendarahan visual apabila tekstur diambil sampel. Ini amat penting untuk enjin permainan yang menggunakan penapisan linear.
Bolehkah saya menggunakan sprite sheet untuk CSS?
Ya, sprite sheet berfungsi dengan baik untuk sprite CSS. Data JSON atlas boleh digunakan untuk menjana peraturan CSS background-position, mengurangkan permintaan HTTP dan meningkatkan prestasi pemuatan halaman.
Apakah amalan terbaik untuk dimensi sprite sheet?
Kekalkan dimensi sebagai kuasa 2 (256x256, 512x512, 1024x1024) untuk pengendalian tekstur GPU yang optimum. Kebanyakan enjin permainan lebih suka dimensi ini untuk prestasi dan keserasian yang lebih baik.
Bagaimana sprite sheet meningkatkan prestasi permainan?
Sprite sheet mengurangkan panggilan lukisan dengan mengelompokkan beberapa sprite ke dalam satu tekstur. Ini mengurangkan perubahan status GPU, mengurangkan overhed memori, dan membolehkan penerbitan yang lebih cekap.
Apakah perbezaan antara sprite sheet dan atlas tekstur?
Sprite sheet biasanya menyusun bingkai dalam grid seragam, manakala atlas tekstur boleh membungkus sprite berbentuk tidak sekata dengan lebih cekap menggunakan algoritma seperti bin packing.
Cara Menggunakan Penjana Sprite Sheet
Gabungkan beberapa imej menjadi satu sprite sheet terus dalam pelayar anda. Seret untuk menyusun semula bingkai, laraskan grid dan padding dengan teliti, kemudian eksport atlas PNG/WebP/JPG bersama data JSON untuk enjin permainan dan sprite CSS. Semua pemprosesan adalah setempat.
- Tambah imej anda dan gunakan butang + dan − untuk menetapkan Columns dan Rows grid.
- Tetapkan Padding (px) supaya ada ruang antara sprite dan mengelakkan texture bleeding.
- Biarkan Sprite Size pada Auto untuk menyesuaikan bingkai terbesar, atau taip dimensi tetap untuk sel seragam.
- Pilih Scale Mode — Fit, Fill atau Stretch — untuk mengawal cara setiap imej menempati selnya.
- Pilih Background (Transparent, White, Black atau Custom), tetapkan Format kepada PNG, WebP atau JPG, dan namakan fail dalam Filename.
- Seret lakaran kecil untuk menyusun semula bingkai — koordinat atlas dikemas kini automatik — kemudian eksport helaian bersama atlas JSON.
Guna sekurang-kurangnya 2 px padding supaya sprite bersebelahan tidak bercampur apabila tekstur diskala atau ditapis dalam enjin anda.
Alat Berkaitan
- Kalkulator Chmod Kalkulator chmod dalam talian percuma untuk mengvisualisasikan dan mengira keizinan fail Linux dengan kotak tanda. Tukar serta-merta antara notasi angka (755, 644) dan simbolik (rwxr-xr-x). Menyokong keizinan khas seperti setuid, setgid, sticky bit.
- Jadual ASCII Rujukan pengkodan aksara ASCII lengkap dengan kod perpuluhan, heksadesimal, oktal, binari, entiti HTML dan penerangan aksara. Cari dan tapis serta-merta.
- Penguji Permintaan HTTP Uji API REST terus dalam pelayar anda. Hantar permintaan GET, POST, PUT, DELETE dengan pengepala, badan dan parameter tersuai. Lihat status, pengepala dan badan JSON respons serta-merta.
- Penjana .htaccess Jana peraturan .htaccess Apache untuk pengalihan, penulisan semula, header keselamatan, cache dan banyak lagi.
- Penjana Robots.txt Penjana robots.txt dalam talian percuma. Cipta dan sesuaikan fail robots.txt untuk mengawal perayapan enjin carian, menguruskan akses perayap, dan mengoptimumkan SEO laman web anda.
- Penjana Sitemap Penjana sitemap XML dalam talian percuma. Tambah URL, tetapkan keutamaan dan kekerapan, buat sitemap SEO serta-merta.
- GIF Pecahkan Bingkai Ekstrak dan muat turun bingkai individu daripada animasi GIF sebagai PNG atau helaian sprite. Alat dalam talian percuma dengan pratonton dan eksport ZIP.
- GIF Terbalik Songsangkan urutan main balik animasi GIF dalam talian percuma. Muat naik, pratonton dan muat turun serta-merta.