使用 LibGdx 在 Java 中制作精灵表动画
Animating Sprite Sheets in Java using LibGdx
我这里有一些代码,它接受一个精灵 sheet 并通过获取我的图像的长度和宽度并将其按行和列划分,将其分成单独的精灵。这适用于我的测试精灵 sheet,但不适用于我实际要用于我的游戏的精灵。
我的动画Class在这里:
package Simple;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.graphics.g2d.Animation;
public class RunningMan {
private Texture texture;
private TextureRegion[] walkFrames;
private Animation walkAnimation;
private float stateTime = 0f;
private TextureRegion currentFrame;
int rows = 5;
int cols = 6;
public RunningMan(Texture texture) {
this.texture = texture;
TextureRegion[][] tmp = TextureRegion.split(texture, texture.getWidth() / cols, texture.getHeight() / rows); // split the sprite sheet up into its 30 different frames
walkFrames = new TextureRegion[rows * cols];
int index = 0;
for(int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
walkFrames[index++] = tmp[i][j]; // Put the 30 frames into a 1D array from the 2d array
}
}
walkAnimation = new Animation(0.06f, walkFrames); // initialize the animation class
stateTime = 0f;
}
public void draw(Batch batch) {
stateTime += Gdx.graphics.getDeltaTime(); // stateTime is used to determine which frame to show
if(stateTime > walkAnimation.getAnimationDuration()) stateTime -= walkAnimation.getAnimationDuration(); // when we reach the end of the animation, reset the stateTime
currentFrame = walkAnimation.getKeyFrame(stateTime); // Get the current Frame
batch.draw(currentFrame,50,50); // draw the frame
}
}
我的 Class 到 运行 动画在这里:
package Simple;
import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
public class Animation extends ApplicationAdapter {
SpriteBatch batch;
RunningMan man;
@Override
public void create () {
batch = new SpriteBatch();
man = new RunningMan(new Texture(Gdx.files.internal("WalkingMan.png")));
}
@Override
public void render () {
Gdx.gl.glClearColor(1, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
batch.begin();
man.draw(batch);
batch.end();
}
}
当我使用 WalkingMan.png 时,代码可以完美运行。但是当我去使用任何其他精灵 sheet,例如 WalkingWoman.jpg(我不担心这个不透明)时,当相应地调整列和行时,对齐将关闭。有什么建议么?
WalkingMan.png
WalkingWoman.jpg
动画 class 似乎通过假设 spritesheet 图像中的所有帧均等间隔将源图像分割成帧。因此对于 WalkingMan 图像,512x512px 原始图像被分成 30 帧,每帧 85.33px 宽(512 / 6 列)和 102.4px 高(512 / 5 行)。
如果如您所说,调整 WalkingWoman 图像(1300x935)的列号和行号,您将获得 36 帧,每帧 144.44px 宽(1300 / 9 列)和 233.75px 高(935 / 4 行)。
问题在于 WalkingWoman 子画面sheet 每一帧的间距不均匀。如果将第一帧从图像中分离出来,您会得到:
see how her foot is cut off on the right
WalkingMan 图像的每个图像都放置在 spritesheet 中相同大小的边界框内。您只需要确保 WalkingWoman sheet 的每一帧都以相同的方式均匀分布。
我这里有一些代码,它接受一个精灵 sheet 并通过获取我的图像的长度和宽度并将其按行和列划分,将其分成单独的精灵。这适用于我的测试精灵 sheet,但不适用于我实际要用于我的游戏的精灵。
我的动画Class在这里:
package Simple;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.graphics.g2d.Animation;
public class RunningMan {
private Texture texture;
private TextureRegion[] walkFrames;
private Animation walkAnimation;
private float stateTime = 0f;
private TextureRegion currentFrame;
int rows = 5;
int cols = 6;
public RunningMan(Texture texture) {
this.texture = texture;
TextureRegion[][] tmp = TextureRegion.split(texture, texture.getWidth() / cols, texture.getHeight() / rows); // split the sprite sheet up into its 30 different frames
walkFrames = new TextureRegion[rows * cols];
int index = 0;
for(int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
walkFrames[index++] = tmp[i][j]; // Put the 30 frames into a 1D array from the 2d array
}
}
walkAnimation = new Animation(0.06f, walkFrames); // initialize the animation class
stateTime = 0f;
}
public void draw(Batch batch) {
stateTime += Gdx.graphics.getDeltaTime(); // stateTime is used to determine which frame to show
if(stateTime > walkAnimation.getAnimationDuration()) stateTime -= walkAnimation.getAnimationDuration(); // when we reach the end of the animation, reset the stateTime
currentFrame = walkAnimation.getKeyFrame(stateTime); // Get the current Frame
batch.draw(currentFrame,50,50); // draw the frame
}
}
我的 Class 到 运行 动画在这里:
package Simple;
import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
public class Animation extends ApplicationAdapter {
SpriteBatch batch;
RunningMan man;
@Override
public void create () {
batch = new SpriteBatch();
man = new RunningMan(new Texture(Gdx.files.internal("WalkingMan.png")));
}
@Override
public void render () {
Gdx.gl.glClearColor(1, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
batch.begin();
man.draw(batch);
batch.end();
}
}
当我使用 WalkingMan.png 时,代码可以完美运行。但是当我去使用任何其他精灵 sheet,例如 WalkingWoman.jpg(我不担心这个不透明)时,当相应地调整列和行时,对齐将关闭。有什么建议么?
WalkingMan.png
WalkingWoman.jpg
动画 class 似乎通过假设 spritesheet 图像中的所有帧均等间隔将源图像分割成帧。因此对于 WalkingMan 图像,512x512px 原始图像被分成 30 帧,每帧 85.33px 宽(512 / 6 列)和 102.4px 高(512 / 5 行)。
如果如您所说,调整 WalkingWoman 图像(1300x935)的列号和行号,您将获得 36 帧,每帧 144.44px 宽(1300 / 9 列)和 233.75px 高(935 / 4 行)。
问题在于 WalkingWoman 子画面sheet 每一帧的间距不均匀。如果将第一帧从图像中分离出来,您会得到:
see how her foot is cut off on the right
WalkingMan 图像的每个图像都放置在 spritesheet 中相同大小的边界框内。您只需要确保 WalkingWoman sheet 的每一帧都以相同的方式均匀分布。