ShapeRenderer使用LibGDX生成像素化形状

Posted 2021-04-20

当我使用ShapeRenderer时，它总是出现像素化。但如果我在相同尺寸的Photoshop中绘制形状，它会非常光滑和干净。

我的方法如下：

package com.me.actors;

import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.glutils.ShapeRenderer;
import com.badlogic.gdx.graphics.glutils.ShapeRenderer.ShapeType;
import com.badlogic.gdx.scenes.scene2d.Actor;

public class bub_actors extends Actor {
    private ShapeRenderer shapes;
    private Texture text;
    private Sprite sprite;

    public bub_actors(){
        shapes = new ShapeRenderer();
        text = new Texture(Gdx.files.internal("data/circle.png"));
        sprite = new Sprite();
        sprite.setRegion(text);
    }
    @Override
    public void draw(SpriteBatch batch, float parentAlpha) {
            batch.draw(sprite, 200, 200, 64, 64);
            shapes.begin(ShapeType.FilledCircle);
            shapes.filledCircle(50, 50, 32);
            shapes.setColor(Color.BLACK);
            shapes.end();
    }
}

这是输出的图像：

关于为什么会这样的想法？是否可以使ShapeRenderer看起来像图像（因此我不必创建不同颜色的圆圈的SpriteBatch ......）。

答案

差异是anti-aliasing，Photoshop适用于它生成的图像。如果放大两个圆的边缘，您将看到消除锯齿的边缘周围有一些半黑色像素，其中ShapeRenderer生成的圆圈只显示完全打开或关闭的像素。

Libgdx ShapeRenderer设计用于在屏幕上获得调试形状的快速简单方法，它不支持抗锯齿。获得一致抗锯齿渲染的最简单方法是使用纹理。 （也可以使用OpenGL着色器。）

也就是说，您不必创建不同的精灵只是为了渲染不同的彩色圆圈。只需使用透明背景的白色圆圈，然后使用render it with a color。 （假设你想要各种纯色圆圈）。

另一答案

这是一种非常简单的方法，可以在不使用纹理和SpriteBatch的情况下实现平滑和美观的形状。

您所要做的就是渲染几个形状稍大一些的形状和较低的alpha通道以及第一个。

越多越好的结果，但是，当然，考虑你的屏幕的ppi。

...
float alphaMultiplier = 0.5f; //you may play with different coefficients
float radiusStep = radius/200;
int sampleRate = 3;
...

//do not forget to enable blending
Gdx.gl.glEnable(GL20.GL_BLEND);
Gdx.gl.glBlendFunc(GL20.GL_SRC_ALPHA, GL20.GL_ONE_MINUS_SRC_ALPHA);

shapeRenderer.begin(ShapeType.Filled);

//first rendering
shapeRenderer.setColor(r, g, b, a);
shapeRenderer.circle(x, y, radius);

//additional renderings
for(int i=0; i<sampleRate; i++) {
    a *= alphaMultiplier;
    radius += radiusStep;
    shapeRenderer.setColor(r, g, b, a);
    shapeRenderer.circle(x, y, radius);
}

shapeRenderer.end();
...

以下是您可以实现的截图。