Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Please limit one question/topic per post.
Please provide the following details depending on types of question

▼ For question regarding Editor, please provide:
- Live2D Software Version: (e.g. Cubism Editor 3.1.02, Euclid Editor 1.2.02)
- OS & Version: (e.g. Windows 10, macOS HighSierra)
- PC Model: (e.g. MacBookPro 2017)
- Graphics Specifications: (e.g. GeForce GTX 950M)
- Memory: (e.g. 8GB)
- Illustration Software used: (e.g. Photoshop, ClipStudio, SAI)
- Attach screenshot or capture video to show your problem:
---------------------------
▼ For question regarding SDK, please provide:
- For us to reproduce the issue you wish to inquire about, please provide either a minimum project file which has the issue. or specific instructions on how to reproduce the issue.
- Types and version of Cubism SDK you are using.
---------------------------
▼ For question regarding Cubism Software License,
For issues related to purchasing, your order, license key, and subscription, please contact us via contact form:
https://www.live2d.com/en/contact/contact_form

How to set background image with OpenGL API for GLKView when rendering live2d.

edited February 2018 in Help
Hi, I am developing an iOS App with Live2D SDK 2.1.04 and I have to set background image when rendering the live2d model. However, when I using OpenGL API render a background image in GLKView context it only display half texture of the background image



Code as below.

#pragma mark - GLKViewDelegate
- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect {
CGFloat width = self.viewWidth;
CGFloat height = self.viewHeight;

glClearColor(1.0f, 1.0f, 1.0f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); EXC_BAD_ACCESS

GLfloat squareVertexData[] =
{
1, -1, 0.0f, 1.0f, 0.0f,
-1, 1, 0.0f, 0.0f, 1.0f,
-1, -1, 0.0f, 0.0f, 0.0f,
1, 1, -0.0f, 1.0f, 1.0f,
};

GLuint indices[] =
{
0, 1, 2,
1, 3, 0
};
self.mCount = sizeof(indices) / sizeof(GLuint);

GLuint buffer;
glGenBuffers(1, &buffer);
glBindBuffer(GL_ARRAY_BUFFER, buffer);
glBufferData(GL_ARRAY_BUFFER, sizeof(squareVertexData), squareVertexData, GL_STATIC_DRAW);

GLuint index;
glGenBuffers(1, &index);
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, index);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);

glEnableVertexAttribArray(GLKVertexAttribPosition);
glVertexAttribPointer(GLKVertexAttribPosition, 3, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 5, (GLfloat *)NULL + 0);


glEnableVertexAttribArray(GLKVertexAttribTexCoord0);
glVertexAttribPointer(GLKVertexAttribTexCoord0, 2, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 5, (GLfloat *)NULL + 3);


[self.mEffect prepareToDraw];
glDrawElements(GL_TRIANGLES, self.mCount, GL_UNSIGNED_INT, 0);

CGSize screen = CGSizeMake(width, height);

float scx = 3 / live2DModel->getCanvasWidth() ;
float scy = -3 / live2DModel->getCanvasWidth() *(screen.width/screen.height);
float x = -1.5;
float y = 1;
float matrix []= {
scx , 0 , 0 , 0 ,
0 , scy ,0 , 0 ,
0 , 0 , 1 , 0 ,
x , y , 0 , 1
} ;

live2DModel->setMatrix(matrix) ;

if (self.refreshAction) {
self.refreshAction();
}

live2DModel->update() ;
live2DModel->draw() ;
}
When I remove the live2d rendering source code, it will display the total image.


I think perhaps OpenGL API in my code is conflict with live2d, so how to set background image with OpenGL and live2d in a proper way?


Waiting for the answer...

Comments

  • Hi,
    GLfloat squareVertexData[] =
        {
            1, -1, 0.0f,    1.0f, 0.0f,
            -1, 1, 0.0f,    0.0f, 1.0f,
            -1, -1, 0.0f,   0.0f, 0.0f,
            1, 1, -0.0f,    1.0f, 1.0f,
        };
        
        GLuint indices[] =
        {
            0, 1, 2,
            1, 3, 0
        };
    In this part, polygons for the background on the bottom left is set as CCW (Counter Clock Wise). In live2DModel->draw(), setting of Culling is changed. However, triangles are regarded as background and are not displayed because the setting of Culling is not restored.

    In order ti solve this problem, you can restore settings of Culling after live2DModel->draw() or make the order of vertexes of the polygons for the background CW (Clock Wise). In case of the first solution written above, OpenGL settings changed in Live2D can be saved and restored by using DrawProfileCocos2D class in Live2D library. The class can be used by adding DrawProfileCocos2D:: preDraw() before live2DModel->draw(), and DrawProfileCocos2D:: postDraw() after live2DModel->draw()
    DrawProfileCocos2D::preDraw();
    live2DModel->draw();
    DrawProfileCocos2D::postDraw();
    Thanks,

  • Thanks for your reply! It worked for me! Thanks a lot! Great!
Sign In or Register to comment.