Mithrandir
Mithrandir

Reputation: 33

Can I texture this cube that is rendered in GL_TRIANGLE_STRIP mode?

I'm trying to render and texture a cube using GL_TRIANGLE_STRIP mode.

The cube's base info is in the following arrays. It gets loaded correctly, and the shape is OK.

    float vertexData[24] = { //Coordinates for the vertices of a cube.
    //vertices
     1, 1, -1,
     -1, 1, -1,
     1, -1, -1,
     -1, -1, -1,
     1, 1, 1,
     -1, 1, 1,
     -1, -1, 1,
     1, -1, 1
    };

    int vertexDrawIndices[14] = {  //Draw order for vertices in GL_TRIANGLE_STRIP mode.
       3,2,6,7,4,2,0,3,1,6,5,4,1,0
    };

In order to construct this simplistic cube data, I referenced this image: rendering a cube in one triangle strip

Now for texturing, can I add texture coordinates to this cube? Or is it cursed to be shaded with flat colors?

If I had to answer my own question with logic, I'd say texturing it is impossible like this, but maybe someone knows a way?

Upvotes: 2

Views: 337

Answers (1)

Scheff's Cat
Scheff's Cat

Reputation: 20141

What a nice puzzle… – Just the right warm-up before going back to business.

I see two possible solutions:

  1. Use a cube texture
  2. Modify the vertex data.

For the cube texture mapping, I'd like to refer to Learn OpenGL – Cubemaps.
So, the vertex coordinates should be usable as texture coordinates as well.

The original approach of OP won't work with a single texture because there are vertices with same coordinates but distinct texture coordinates.

So, I would end up with a new array of pairs with 14 coordinates and 14 texture coordinates (or two corresponding arrays).

While I tried to apply this to the unwrapping of OP, I came to the conclusion that even this is not possible. E.g. coordinates 3 and 4 appear at the top and bottom of the unwrapped cube → resulting again in two distinct texture coordinates for the same vertex.

For my luck, I already solved the cube-with-one-triangle-strip-puzzle (many) years ago (when OpenGL Performer still was state-of-the-art). Looking into my old notes, I found that my unwrapping was much better fitting for the intended texturing.

a cube unwrapped into a triangle strip starting with the red triangle and ending with the blue.

I copy/pasted the coordinates from that old sample:

  const GLfloat x0 = -1, x1 = 1, y0 = -1, y1 = 1, z0 = -1, z1 = 1;
  const GLfloat coords[] = {
    x0, y1, z1,
    x0, y0, z0,
    x0, y0, z1,
    x1, y0, z1,
    x0, y1, z1,
    x1, y1, z1,
    x1, y1, z0,
    x1, y0, z1,
    x1, y0, z0,
    x0, y0, z0,
    x1, y1, z0,
    x0, y1, z0,
    x0, y1, z1,
    x0, y0, z0
  };

So, all I had to do was to use the sketch as texture and write down the resp. texture coordinates:

  const GLfloat s0 = 0, s1 = 1.f / 5, s2 = 2.f / 5, s3 = 3.f / 5, s4 = 4.f / 5, s5 = 1;
  const GLfloat t0 = 0, t1 = 1.f / 5, t2 = 2.f / 5, t3 = 3.f / 5, t4 = 4.f / 5, t5 = 1;
  const GLfloat texCoords[] = {
    s0, t1,
    s1, t0,
    s1, t1,
    s2, t1,
    s1, t2,
    s2, t2,
    s2, t3,
    s3, t2,
    s3, t3,
    s4, t3,
    s3, t4,
    s4, t4,
    s4, t5,
    s5, t4
  };

To check this out, I applied this to a minimal QOpenGLWidget sample which I found in my personal folder using the above image as texture.

testQOpenGLTexCube.cc:

#include <QtWidgets>
#include <QOpenGLFunctions_3_3_Compatibility>

class GLWidget: public QOpenGLWidget,
  protected QOpenGLFunctions_3_3_Compatibility
{
  private:
    QOpenGLTexture *_pGLTex;
    QOpenGLShaderProgram *_pGLPrg;
    GLuint _coordAttr;
    GLuint _texCoordAttr;
    GLuint _matUniform;
    double _t;
    QMatrix4x4 _matProj;
    QTimer _qTimerAnim;

  public:

    GLWidget(QWidget *pQParent = nullptr):
      QOpenGLWidget(pQParent),
      _pGLTex(nullptr), _pGLPrg(nullptr), _t(0)
    {
      QObject::connect(&_qTimerAnim, &QTimer::timeout,
        [this]() { _t += 0.1; update(); });
    }

    virtual ~GLWidget() = default;

    GLWidget(const GLWidget&) = delete;
    GLWidget& operator=(const GLWidget&) = delete;

  public:

    virtual QSize minimumSizeHint() const
    {
      return QSize(50, 50);
    }
    virtual QSize sizeHint() const
    {
      return QSize(400, 400);
    }

  protected:

    virtual void initializeGL();
    virtual void resizeGL(int width, int height);
    virtual void paintGL();

};

static const char *vertexShaderSource =
  "# version 330\n"
  "layout (location = 0) in vec3 coord;\n"
  "layout (location = 1) in vec2 texCoord;\n"
  "uniform mat4 mat;\n"
  "out vec2 texCoordVtx;\n"
  "void main() {\n"
  "  texCoordVtx = texCoord;\n"
  "  gl_Position = mat * vec4(coord, 1.0);\n"
  "}\n";

static const char *fragmentShaderSource =
  "#version 330\n"
  "in vec2 texCoordVtx;\n"
  "uniform sampler2D tex;\n"
  "out vec4 colorFrag;\n"
  "void main() {\n"
  "  colorFrag = texture2D(tex, texCoordVtx.xy);\n"
  "}\n";

void GLWidget::initializeGL()
{
  initializeOpenGLFunctions();
  glClearColor(0.525f, 0.733f, 0.851f, 1.0f);
  _qTimerAnim.start();
}

void GLWidget::resizeGL(int w, int h)
{
  _matProj.setToIdentity();
  _matProj.perspective(45.0f, GLfloat(w) / h, 0.01f, 100.0f);
}

void GLWidget::paintGL()
{
  const qreal retinaScale = devicePixelRatio();
  glViewport(0, 0, width() * retinaScale, height() * retinaScale);
  // clear screen
  glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
  // create texture if not yet done
  if (!_pGLTex) {
    _pGLTex = new QOpenGLTexture(QImage("cube-tex.png").mirrored());
    _pGLTex->setMagnificationFilter(QOpenGLTexture::Nearest);
    _pGLTex->setMinificationFilter(QOpenGLTexture::Nearest);
  }
  // create shader program if not yet done
  if (!_pGLPrg) {
    _pGLPrg = new QOpenGLShaderProgram(this);
    _pGLPrg->addShaderFromSourceCode(QOpenGLShader::Vertex,
      vertexShaderSource);
    _pGLPrg->addShaderFromSourceCode(QOpenGLShader::Fragment,
      fragmentShaderSource);
    _pGLPrg->link();
    _coordAttr = _pGLPrg->attributeLocation("coord");
    _texCoordAttr = _pGLPrg->attributeLocation("texCoord");
    _matUniform = _pGLPrg->uniformLocation("mat");
    _pGLPrg->setUniformValue("tex", 0);
  }
  // render textured cube
  glEnable(GL_DEPTH_TEST);
  glEnable(GL_CULL_FACE);
  _pGLPrg->bind();
  _pGLTex->bind();
  QMatrix4x4 mat = _matProj;
  mat.translate(0, 0, -5);
  mat.rotate(_t, -1.0, -1.0, 1.0);
  _pGLPrg->setUniformValue(_matUniform, mat);
  const GLfloat x0 = -1, x1 = 1, y0 = -1, y1 = 1, z0 = -1, z1 = 1;
  const GLfloat coords[] = {
    x0, y1, z1,
    x0, y0, z0,
    x0, y0, z1,
    x1, y0, z1,
    x0, y1, z1,
    x1, y1, z1,
    x1, y1, z0,
    x1, y0, z1,
    x1, y0, z0,
    x0, y0, z0,
    x1, y1, z0,
    x0, y1, z0,
    x0, y1, z1,
    x0, y0, z0
  };
  const GLfloat s0 = 0, s1 = 1.f / 5, s2 = 2.f / 5, s3 = 3.f / 5, s4 = 4.f / 5, s5 = 1;
  const GLfloat t0 = 0, t1 = 1.f / 5, t2 = 2.f / 5, t3 = 3.f / 5, t4 = 4.f / 5, t5 = 1;
  const GLfloat texCoords[] = {
    s0, t1,
    s1, t0,
    s1, t1,
    s2, t1,
    s1, t2,
    s2, t2,
    s2, t3,
    s3, t2,
    s3, t3,
    s4, t3,
    s3, t4,
    s4, t4,
    s4, t5,
    s5, t4
  };
  glVertexAttribPointer(_coordAttr, 3, GL_FLOAT, GL_FALSE, 0, coords);
  glVertexAttribPointer(_texCoordAttr, 2, GL_FLOAT, GL_FALSE, 0, texCoords);
  glEnableVertexAttribArray(0);
  glEnableVertexAttribArray(1);
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 14);
  glDisableVertexAttribArray(1);
  glDisableVertexAttribArray(0);
  // done
  _pGLTex->release(); _pGLPrg->release();
}

int main(int argc, char *argv[])
{
  QApplication app(argc, argv);
  // setup GUI
  QMainWindow qMainWin;
  GLWidget glWidget;
  qMainWin.setCentralWidget(&glWidget);
  qMainWin.show();
  // runtime loop
  return app.exec();
}

Output:

Snapshot of testQOpenGLTexCube

Upvotes: 3

Related Questions