Add texture coordinate array, color coordinate array the right way for it to work.

[johnspeny]

I am using latest adxe version before it changed to axis.

I can't figure out a way to properly add texture coordinates in an array on a triangle.
desired image 1
desired image 2(optional though)

I seem to be creating 3 lines of _customCommand.createVertexBuffer and _customCommand.updateVertexBuffer, I don't know if that's the right way of doing it.

I also think there is an issue with _customCommand.setVertexDrawInfo(0, m_vertexDataCount); what value should m_vertexDataCount be?

void SampleScene::generateTriangle()
{
	const char* vertexShaderSource = "#version 330 core\n"
		"layout (location = 0) in vec2 a_position;\n"
		"layout (location = 1) in vec2 a_texCoord;\n"
		"layout (location = 2) in vec4 a_color;\n"
		"out vec4 ourColor;\n"
		"out vec2 TexCoord;\n"
		"uniform mat4 u_MVPMatrix;\n"
		"void main()\n"
		"{\n"
		"   gl_Position = u_MVPMatrix * vec4(a_position, 0.0, 1.0);\n"
		"   ourColor = a_color;\n"
		"   TexCoord = a_texCoord;\n"
		"}\0";

	const char* fragmentShaderSource = "#version 330 core\n"
		"out vec4 FragColor;\n"
		"in vec4 ourColor;\n"
		"in vec2 TexCoord;\n"
		"uniform sampler2D u_tex0;\n"
		"void main()\n"
		"{\n"
		"	FragColor = texture(u_tex0, TexCoord);\n"
		"}\0";

	auto program = cocos2d::backend::Device::getInstance()->newProgram(vertexShaderSource, fragmentShaderSource);

	auto& pipelineDescriptor = _customCommand.getPipelineDescriptor();
	_programState = new (std::nothrow) backend::ProgramState(program);
	pipelineDescriptor.programState = _programState;

	auto& vertexLayout = pipelineDescriptor.programState->getVertexLayout();
	const auto& attributeInfo = _programState->getProgram()->getActiveAttributes();
	auto iter = attributeInfo.find("a_position");
	if (iter != attributeInfo.end())
	{
		vertexLayout->setAttribute("a_position",
			iter->second.location,
			backend::VertexFormat::FLOAT2,
			0,
			false);
	}

	iter = attributeInfo.find("a_texCoord");
	if (iter != attributeInfo.end())
	{
		vertexLayout->setAttribute("a_texCoord",
			iter->second.location,
			backend::VertexFormat::FLOAT2,
			2 * sizeof(float),
			false);
	}

	iter = attributeInfo.find("a_color");
	if (iter != attributeInfo.end())
	{
		vertexLayout->setAttribute("a_color",
			iter->second.location,
			backend::VertexFormat::UBYTE4,
			4 * sizeof(float),
			true);
	}

	// stride = 8 * sizeof(float)
	vertexLayout->setLayout(8 * sizeof(float));

	/*
	@brief get uniforms from program state
	*/
	_mvpMatrixLocation = pipelineDescriptor.programState->getUniformLocation("u_MVPMatrix");
	_textureLocation = pipelineDescriptor.programState->getUniformLocation("u_tex0");

	/*
	@brief vertex data
	*/
	float pos_Vertices[] = {
		// positions
		90.0f, 30.0f,
		120.0f, 60.0f,
		150.0f, 30.0f
	};

	float color_Vertices[] = {
		// color
		1.0f, 0.0f, 0.0f, 1.0f,
		0.0f, 1.0f, 0.0f, 1.0f,
		0.0f, 0.0f, 1.0f, 1.0f
	};

	float texture_Vertices[] = {
		// texture
		90.0f, 30.0f,
		120.0f, 60.0f,
		150.0f, 30.0f
	};

	size_t pCount = (sizeof(pos_Vertices) / (sizeof(float) * 2));
	size_t colorCount = (sizeof(color_Vertices) / (sizeof(float) * 4));
	size_t textureCount = (sizeof(texture_Vertices) / (sizeof(float) * 2));

	// total vertex count from the vertex buffer ( 3 vertices for my case)
	m_vertexDataCount = 3;

	// glVertexAttribPointer part
	_customCommand.createVertexBuffer(sizeof(pos_Vertices), pCount, CustomCommand::BufferUsage::DYNAMIC);
	_customCommand.createVertexBuffer(sizeof(color_Vertices), colorCount, CustomCommand::BufferUsage::DYNAMIC);
	_customCommand.createVertexBuffer(sizeof(texture_Vertices), textureCount, CustomCommand::BufferUsage::DYNAMIC);

	/*
	@brief glBufferData(data, size)
	*/
	_customCommand.updateVertexBuffer(pos_Vertices, sizeof(pos_Vertices));
	_customCommand.updateVertexBuffer(color_Vertices, sizeof(color_Vertices));
	_customCommand.updateVertexBuffer(texture_Vertices, sizeof(texture_Vertices));

	/*
	@brief update uniforms
	*/
	const auto& projectionMat = Director::getInstance()->getMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_PROJECTION);
	_customCommand.getPipelineDescriptor().programState->setUniform(_mvpMatrixLocation, projectionMat.m, sizeof(projectionMat.m));

	/*
	@brief texture rendering on shape
	*/
	auto _texture = Director::getInstance()->getTextureCache()->addImage("lowres-desert-ground.png");
	_customCommand.getPipelineDescriptor().programState->setUniform(_textureLocation, &_texture, sizeof(_texture));
	_customCommand.getPipelineDescriptor().programState->setTexture(_textureLocation, 0, _texture->getBackendTexture());

	/*
	@brief: draw type
	*/
	_customCommand.setDrawType(CustomCommand::DrawType::ARRAY);
	_customCommand.setPrimitiveType(CustomCommand::PrimitiveType::TRIANGLE);
}

void SampleScene::draw(cocos2d::Renderer* renderer, const cocos2d::Mat4& transform, uint32_t flags)
{
	_customCommand.init(0);
	_customCommand.setVertexDrawInfo(0, m_vertexDataCount);
	renderer->addCommand(&_customCommand);
}

The code above runs but with no visible triangle.

Also I know I could just use 1 vertex array like below but I don't want that approach.

float vertices[] = {
		// positions              // color                                    // texture
		90.0f, 30.0f,		1.0f, 0.0f, 0.0f, 1.0f,                  90.0f, 30.0f,
		120.0f, 60.0f,		0.0f, 1.0f, 0.0f, 1.0f,			120.0f, 60.0f,
		150.0f, 30.0f,		0.0f, 0.0f, 1.0f, 1.0f,			150.0f, 30.0f
	};

[DelinWorks]

If you're on windows, are you using ANGLE as your backend renderer?

[DelinWorks]

Sorry for the late response but you should be able to make a buffer with the size of maybe 12 vertices and then interpolate this vertex array based on screen size, you can do that as I mentioned above, you'd need to acquire the vertex buffer and update it just like this:

auto buffer = mesh->getMeshIndexData()->getVertexBuffer();
buffer->updateData(vertices.data(), vertices.size());

[johnspeny]

I tried to make a call to updateData every time the terrain moves offsets to the left, I get a memory access violation error on _meshIndexData. Then again all am trying to do is convert that old tutorial to the new approach. I also do not understand how and where to use the updateData(), its probably the last missing puzzle to get everything working well.

[DelinWorks]

use updateData after you've done creating the mesh. preferably in the update method

[johnspeny]

Tried that but nothing new, its harder than it sounds. Maybe my brain can't comprehend it well. There is something to do with the one creation of the mesh that maybe confusing me abit.I will probably share the public git repo and you have a glance.

[johnspeny]

Sorry for the delay. The Repo, I have tried to explain the flow, in case something is not clear don't hesitate to inform me.