Se preferir também pode assistir o formato original deste conteúdo que é a sua forma em vídeo. Este artigo vai servir como um exemplo e referência do que você pode aprender.


Por Júlio Rodrigues em

Como exibir, rotacionar, esticar e colorizar seus sprites com libGDX

Antes de começar é preciso inicializar alguns objetos e montar o esqueleto que será usado por todo o exemplo. Caso você queira replicar os exemplos de maneira idêntica você pode baixar os assets usados no projeto.

public class MyGdxGame extends ApplicationAdapter {

            public static final int WIDTH = 1280;
            public static final int HEIGHT = 768;

            SpriteBatch batch;

            Texture singleSkillImg;
            Texture singleSkillSmooth;
            Texture atlasImg;

            float skillWidth;
            float skillHeight;
            float scaledWidth;
            float scaledHeight;

            @Override
            public void create () {
                batch = new SpriteBatch();

                singleSkillImg = new Texture("evil-eye-red-3.png");
                singleSkillSmooth = new Texture("evil-eye-red-3.png");
                atlasImg = new Texture("skills.png");

                skillWidth = singleSkillImg.getWidth();
                skillHeight = singleSkillImg.getHeight();
                scaledWidth = skillWidth * 1.75f;
                scaledHeight = skillHeight * 1.75f;

                singleSkillSmooth.setFilter(Texture.TextureFilter.Linear, Texture.TextureFilter.Linear);
            }

            @Override
            public void render () {
                Gdx.gl.glClearColor(0.3f, 0.3f, 0.3f, 1);
                Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
                //scalingDraw();
                //smoothScalingDraw();
                //tintDraw();
                //justDraw();
                //drawGrid();
                //drawRotating();
                //drawUsingSrc();
                //drawGridRotating();
                //bonusDrawGridRotatingColorGrading();
            }

            ...

Começando pelo básico vamos apenas exibir uma imagem na tela

private void justDraw() {
    batch.begin();
    batch.draw(singleSkillImg, 0, 0);
    batch.end();
}
Simple exibição da imagem inteira

E agora começando a brincadeira um pouco mais interessante vamos centralizar.

private void justDraw() {
    batch.begin();
    batch.draw(singleSkillImg, WIDTH/2 - skillWidth/2, HEIGHT/2 - skillHeight/2);
    batch.end();
}
Alinhada ao centro

Em alguns casos pode ser muito importante utilizar o Texture.TextureFilter.Linear

private void smoothScalingDraw() {
    batch.begin();
    batch.draw(singleSkillSmooth, scaledWidth, 0, scaledWidth, scaledHeight);
    batch.end();
}
Esticando sem e com filtro

Desenhando somente uma parte da textura com os parâmetros src

private void drawUsingSrc() {
        batch.begin();
        batch.draw(atlasImg,
            WIDTH/2 - skillWidth/2, HEIGHT/2 - skillHeight/2,
            skillWidth/2, skillHeight/2,
            skillWidth, skillHeight,
            1f, 1f,
            0,
            (int) skillWidth, 0,
            (int) skillWidth, (int) skillHeight,
            false, false
        );
        batch.end();
    }
Uma fatia da imagem

Uma bela de uma rotação se faz dessa maneira

private void drawRotating() {
    batch.begin();
    batch.draw(atlasImg,
        WIDTH/2 - skillWidth/2, HEIGHT/2 - skillHeight/2,
        skillWidth/2, skillHeight/2,
        skillWidth, skillHeight,
        1f, 1f,
        45,
        (int) skillWidth, 0,
        (int) skillWidth, (int) skillHeight,
        false, false
    );
    batch.end();
Rotacionando

E agora o banquete

private void bonusDrawGridRotatingColorGrading() {
    batch.begin();
    final int columns = 3;
    final int lines = (int) (HEIGHT / skillHeight);
    final int iterations = lines * columns;
    float rotation = 0;
    for (int i = 0; i < lines; i++) {
        for (int j = 0; j < columns; j++) {
            batch.setColor(new Color(0.3f, 0.3f, 0.3f, 1).lerp(Color.WHITE, (float)(j+i*lines)/iterations));
            batch.draw(atlasImg,
                    j* skillWidth, i* skillHeight,
                    skillWidth /2, skillHeight /2,
                    skillWidth, skillHeight,
                    1f, 1f,
                    rotation,
                    j % 2 == 0 ? (int) skillWidth : 0, 0,
                    (int) skillWidth, (int) skillHeight,
                    false, false
            );
            rotation += 90f;
        }
    }
    batch.end();
}
Um grid com colorização e rotação
Perguntas/Queries relacionadas
  • spritebatch.draw
  • como centralizar imagem libgdx
  • como rotacionar sprite libgdx
  • como desenhar uma parte do sprite libgdx
  • como tirar efeito pixelado libgdx
© Bladecast 2018. Todos os direitos reservados.