Question

enter image description here

如何提高使用openGL绘制的线条的质量。我不知道我这样做是最好的方式。我正在使用ShareRenderer和line。但是你可以在图像中看到圆角不能很好地渲染。我得到点触摸和拖动，我认为这将很容易划线，但我想这需要在openGL中做不同的。我想用手指追踪字母以便学习写作。我可以使用openGL-es 1或2，没关系。此处用于图像的设备是Samsung S3。

  @Override
    public void render(float delta) {
        super.render(delta);
        if(mPoints.size() < maxPoints) return;
        shapeRenderer.begin(ShapeRenderer.ShapeType.Line);
        for(int i=0; i < maxPoints-1; i++) {
            Vector3 pnt = mPoints.get(i); 
            if(pnt.x == 0 && pnt.y == 0) continue;
            Vector3 pnt2 = mPoints.get(i+1); 
            if(pnt2.x == 0 && pnt2.y == 0) continue;
            shapeRenderer.line(pnt.x,  pnt.y, pnt2.x, pnt2.y);
        }
        shapeRenderer.end();

    }
@Override
public void resize(int width, int height) {
    super.resize(width, height);
    shapeRenderer.setProjectionMatrix(getCamera().combined);
    Gdx.gl20.glLineWidth(200);
    Gdx.gl.glEnable(GL20.GL_BLEND);
}

@Override
    public boolean touchDown(int x, int y, int pointer, int button) {
        currentFinger = pointer;
        if (++numStrokes >= 2) { //number of strokes for a letter
            numStrokes = 0;
            clearAllPoints();
            currentPointIndex = 0;
        }
        setPoint(0, 0);
        return false;
    }

@Override
public boolean touchDragged(int x, int y, int pointer) {
    if(currentFinger!=pointer) return false;
   Vector3 pnt = mPoints.get(currentPointIndex);
   tempVector.set(x, y, 0);
   getCamera().unproject(tempVector);
   float dx = Math.abs(tempVector.x - pnt.x);
   float dy = Math.abs(tempVector.y - pnt.y);
   if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
        setPoint(x, y);
   }
   return false;
}

下面的UPDATED渲染方法绘制填充的矩形和圆形，填充的圆圈效果更好。

public void render(float delta) {
        super.render(delta);
        if(mPoints.size() < maxPoints) return;
        shapeRenderer.begin(ShapeRenderer.ShapeType.FilledRectangle);
        for(int i=0; i < maxPoints-1; i++) {
            Vector3 pnt = mPoints.get(i); 
            if(pnt.x == 0 && pnt.y == 0) continue;
            Vector3 pnt2 = mPoints.get(i+1); 
            if(pnt2.x == 0 && pnt2.y == 0) continue;

            //This creates a rectangle from the set of points see : http://stackoverflow.com/questions/7854043/drawing-rectangle-between-two-points-with-arbitrary-width
            dist.set(pnt2.x - pnt.x, pnt2.y - pnt.y, 0);
            pVector.set(dist.y, -dist.x, 0); //Find perpendicular (right angle) to points , basically swap x and y , make one negative
            float length = (float) Math.sqrt(pVector.x * pVector.x + pVector.y * pVector.y); //Thats length of perpendicular

            normVector.set(pVector.x - length, pVector.y-length, 0);
            //shapeRenderer.filledCircle(pnt.x, pnt.y, lineWidth);
            shapeRenderer.filledRect(pnt.x - pVector.x * rectWidth/2 , pnt.y - pVector.y * rectWidth /2, rectWidth, rectWidth);
        }
        shapeRenderer.end();

    }

Answer 1

OpenGL ES不支持1.0以外的OpenGL线宽，因此您应该在Android上避免使用它（参见Libgdx gl10.glLineWidth()）。

要获得更平滑，更圆润的“胖线”，请将每个触摸点绘制为圆形，并将多个像素间隔的点与矩形相连接。

请参阅：

Answer 2

为了使任何线条或形状更平滑，您可以使用Multisample_anti-aliasing的功能

要做到这一点你需要做的是：

替换Gdx.gl.glClear（）中的参数; 用这个：

Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT | GL20.GL_DEPTH_BUFFER_BIT | (Gdx.graphics.getBufferFormat().coverageSampling?GL20.GL_COVERAGE_BUFFER_BIT_NV:0));

除此之外转到android html桌面等默认包并添加此行

for android：

config.numSamples =2;

for ios：

config.multisample = GLKViewDrawableMultisample.valueOf("2");

for desktop：

config.samples = 3;

我是libGDX的新手，所以我发现这是使用任何形状做到最简单的方法..

libgdx opengl线路质量改进

2 个答案: