Trò chơi / Hình ảnh
Tạo, cắt và làm hoạt ảnh sprite sheet
Sắp xếp hình ảnh thành bảng sprite hoặc texture atlas, tách bảng thành các khung riêng và tạo hoạt ảnh cho chúng. Lưu PNG, siêu dữ liệu hash JSON, lớp CSS, tệp ZIP hoặc GIF động mà không tải hình ảnh của bạn lên.
Tạo, cắt và làm hoạt ảnh sprite sheet: Chế độ Tạo kết hợp các hình ảnh PNG, JPG, WebP và các khung GIF đã giải mã thành bảng theo lưới, hàng, cột hoặc bố cục tối ưu. Các ô đồng nhất sẽ vừa với hình ảnh lớn nhất, có thể căn giữa hoặc căn giữa phía dưới, kèm phần đệm, khoảng cách và tùy chọn kích thước lũy thừa của hai. Chế độ Cắt chia ảnh theo số lượng ô trong lưới hoặc kích thước pixel, hoặc phát hiện các vùng tách biệt bởi độ trong suốt hay màu nền khóa. Bạn có thể loại trừ các hình chữ nhật, bỏ qua ô trống và cắt bớt các cạnh trong suốt trước khi lưu ZIP hoặc gửi các khung sang chế độ Tạo hoạt ảnh. Chế độ Tạo hoạt ảnh phát một phạm vi khung đã chọn ở tốc độ 1–60 FPS theo thứ tự lặp hoặc ping-pong, với tính năng phóng to pixel và lớp da hành tùy chọn. Công cụ lưu GIF hoặc dải PNG nằm ngang. Hãy bắt đầu với trình tạo pixel art nếu bạn cần vẽ các khung trước. Chạy 100% cục bộ trong trình duyệt của bạn, không có tệp nào được tải lên máy chủ.
- Danh mục
- Trò chơi & tiệc
- Lượt chạy
- Trong trình duyệt của bạn
- Chi phí
- Miễn phí · không cần đăng ký
- Trạng thái khả dụng
- Sẵn sàng sử dụng
Chạy hoàn toàn trong trình duyệt của bạn
Sắp xếp các khung hình vào một bảng cho trò chơi của bạn.
Các ô đồng nhất sử dụng khung hình lớn nhất, cộng thêm khoảng đệm ở mọi phía. Khoảng cách dùng để tách các ô.
Thêm khung hình để bắt đầu. Bạn cũng có thể cắt một bảng trong mục Cắt rồi gửi các khung hình đến đây.
Hình ảnh và tệp xuất của bạn vẫn ở trong trình duyệt này. Hãy sử dụng các tệp đã lưu trong dự án trò chơi của riêng bạn.
Sprite sheet và texture atlas
Sprite sheet lưu trữ nhiều khung hình hoạt ảnh hoặc hình ảnh trò chơi trong một hình ảnh. Lưới đều mô tả từng khung bằng vị trí ô của khung đó. Texture atlas có thể dùng các hình chữ nhật không bằng nhau và cần các tọa độ mô tả từng hình ảnh. Tài liệu AtlasTexture của Godot (https://docs.godotengine.org/en/stable/classes/class_atlastexture.html) giải thích cách sử dụng một vùng của atlas làm kết cấu.
Căn giữa phía dưới giúp chân nhân vật nằm trên cùng một đường cơ sở trong mọi khung hình. Các ngăn được đóng gói giữ nguyên kích thước gốc của từng hình ảnh và không xoay chúng. Kích thước lũy thừa của hai thêm các pixel không sử dụng ở bên phải hoặc phía dưới; thao tác này không thay đổi tỷ lệ hình vẽ của bạn. PNG giữ nguyên độ trong suốt alpha đầy đủ, trong khi GIF có ít màu hơn và chỉ hỗ trợ độ trong suốt một bit.
Tọa độ hash JSON
Bản xuất hash JSON dùng tên khung hình làm khóa bên dưới frames. Mỗi mục có một hình chữ nhật khung với x, y, w và h, một sourceSize, một spriteSourceSize cùng các cờ rotated và trimmed. Tọa độ đếm số pixel từ góc trên bên trái của sheet. Đối tượng meta ghi lại tên tệp hình ảnh và tổng kích thước sheet. Trình tải atlas hash JSON của Phaser (https://docs.phaser.io/api-documentation/class/loader-loaderplugin#atlasJSONHash) mô tả định dạng khung hình được đặt tên này.
Hãy để bản xuất dùng biên nguyên bản của hình ảnh thay vì biên ô đã đệm, đồng thời đặt trimmed và rotated thành false. Tùy chọn Cut có thể xuất một danh sách riêng gồm các hình chữ nhật đã chọn. Chỉ cắt phần rìa trong suốt khi bạn muốn ảnh cắt sát; hãy tắt tùy chọn này để giữ nguyên các ô hoạt ảnh đều nhau và điểm neo của chúng. Hãy so sánh các hình chữ nhật đã lưu với trình nhập của công cụ trò chơi trước khi dùng atlas trong một dự án.
Cách sử dụng
- Chọn Tạo, Cắt hoặc Tạo hoạt ảnh; mỗi chế độ đều có một liên kết để bạn đánh dấu.
- Thêm các khung hoặc một bảng, sau đó điều chỉnh bố cục, lưới cắt hoặc cài đặt hoạt ảnh.
- Xem trước kết quả và tải xuống các tệp cho dự án trò chơi của bạn.
Quyền riêng tư và giới hạn
Tệp của bạn vẫn ở trong trình duyệt. Không có gì được tải lên.
Công cụ liên quan
Câu hỏi thường gặp
Tôi nên dùng lưới hay texture atlas được sắp xếp tối ưu?
Lưới cho mọi khung cùng kích thước ô, dễ cắt hoặc nhập dưới dạng hoạt ảnh thông thường. Bảng được sắp xếp tối ưu đặt các khung có kích thước khác nhau lên các dải để tiết kiệm dung lượng. Các khung được sắp xếp tối ưu không bị xoay và cần các hình chữ nhật JSON đã xuất hoặc cài đặt vùng tương đương trong công cụ trò chơi của bạn.
Tại sao nên dùng phần đệm, khoảng cách hoặc mở rộng cạnh?
Kết cấu đã lọc có thể lấy mẫu các pixel lân cận và tạo ra các đường nối màu, hiện tượng này gọi là rò màu kết cấu. Phần đệm tạo khoảng trống bên trong mỗi ô; khoảng cách tạo khe hở giữa các ô. Công cụ này thêm các pixel trong suốt hoặc pixel có màu nền, không sao chép các pixel ở cạnh. Mở rộng cạnh lặp lại màu ở cạnh của sprite vào phần viền; hãy dùng cài đặt kết cấu của công cụ trò chơi hoặc trình đóng gói atlas có tính năng mở rộng cạnh nếu dự án của bạn cần, đặc biệt khi dùng mipmap.
Làm cách nào để nhập bảng vào Godot, Unity hoặc Phaser?
Trong Godot, hãy dùng các vùng của bảng làm texture atlas hoặc khung hoạt ảnh. Trong Unity, hãy coi hình ảnh là nhiều sprite rồi cắt theo lưới thông thường hoặc xác định các hình chữ nhật. Phaser có thể dùng spritesheet thông thường hoặc atlas hash JSON. Hãy giữ PNG và JSON cùng nhau. Cài đặt nhập có thể khác nhau: chọn bộ lọc điểm gần nhất để pixel art sắc nét, kiểm tra độ trong suốt và kích thước ô, đồng thời bảo đảm tên khung và định dạng JSON phù hợp với dự án của bạn.
GIF có những giới hạn nào về độ trong suốt và thời gian?
GIF hỗ trợ tối đa 256 màu trong bảng màu và một mục trong suốt trong bảng màu, vì vậy pixel chỉ có thể trong suốt hoàn toàn hoặc đục hoàn toàn. Alpha dưới 50% sẽ trở thành trong suốt; các giá trị alpha khác sẽ trở thành đục. Thay vào đó, hãy chọn màu mờ để hòa trộn các cạnh mượt mà. Thời lượng khung được làm tròn theo 10 ms với mức tối thiểu 20 ms, nên không thể biểu diễn chính xác 60 FPS. GIF đã xuất sẽ lặp liên tục; ping-pong thêm các khung quay lại mà không lặp lại khung ở hai đầu.
Tệp của tôi có rời khỏi trình duyệt không?
Không. Việc đọc hình ảnh, sắp xếp bảng, phát hiện vùng và tạo tệp xuất đều diễn ra trên thiết bị của bạn. Bảng lớn và hoạt ảnh dài cần nhiều bộ nhớ hơn. Cảnh báo sẽ xuất hiện khi có hơn 400 khung hoặc một cạnh dài hơn 8.192 pixel. Giới hạn hoạt động là 1.000 khung được nhập, 16.384 pixel cho mỗi cạnh và 64 triệu pixel cho mỗi hình ảnh hoặc tệp xuất hoạt ảnh.
Công cụ miễn phí · trong trình duyệt của bạn lượt chạy · không cần tài khoản