【问题标题】:LibGDX 0.9.9 - Apply cubemap in environmentLibGDX 0.9.9 - 在环境中应用立方体贴图
【发布时间】:2014-02-19 15:20:48
【问题描述】:

我正在使用 LibGDX 0.9.9。我正在尝试渲染立方体贴图和雾。所以我的代码如下:

public void show() {
    modelBatch = new ModelBatch();
    environment = new Environment();
    environment.set(new ColorAttribute(ColorAttribute.AmbientLight, 1.0f, 0.4f, 0.4f, 1f));

    environment.set(new ColorAttribute(ColorAttribute.Fog, 0.9f, 1f, 0f, 1f));
    environment.add(new DirectionalLight().set(0.8f, 0.8f, 0.8f, -1f, -0.8f, -0.2f));

    cubemap = new Cubemap(Gdx.files.internal("cubemap/pos-x.png"), 
                Gdx.files.internal("cubemap/neg-x.png"), 
                Gdx.files.internal("cubemap/pos-y.png"), 
                Gdx.files.internal("cubemap/neg-y.png"), 
                Gdx.files.internal("cubemap/pos-z.png"), 
                Gdx.files.internal("cubemap/neg-z.png"));
    environment.set(new CubemapAttribute(CubemapAttribute.EnvironmentMap, cubemap));

    cam = new PerspectiveCamera(67, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
    cam.position.set(1f, 1f, 1f);
    cam.lookAt(0,0,0);
    cam.near = 0.1f;
    cam.far = 300f;
    cam.update();

    ModelLoader loader = new ObjLoader();

    model = loader.loadModel(Gdx.files.internal("earth/earth.obj"));


    instance = new ModelInstance(model);



    NodePart blockPart = model.nodes.get(0).parts.get(0);

    renderable = new Renderable();
    blockPart.setRenderable(renderable);
    renderable.environment = environment;
    renderable.worldTransform.idt();        

    renderContext = new RenderContext(new DefaultTextureBinder(DefaultTextureBinder.WEIGHTED, 1));

    shader = new DefaultShader(renderable);
    shader.init();

    camController = new CameraInputController(cam);
    Gdx.input.setInputProcessor(camController);
}

@Override
public void render(float delta) {
camController.update();

    Gdx.gl.glViewport(0, 0, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT | GL20.GL_DEPTH_BUFFER_BIT);

    renderContext.begin();
    shader.begin(cam, renderContext);

    shader.render(renderable);
    shader.end();
    renderContext.end();
}

但是什么也没发生。我只看到对象。 我究竟做错了什么?

【问题讨论】:

    标签: java android opengl-es-2.0 libgdx


    【解决方案1】:

    花了一些时间后,我在 LibGDX 中实现了立方体贴图。也许,这不是理想的解决方案,但仅此而已(至少我找不到任何东西)。所以,我使用了原生 OpenGL ES 函数和 LibGDX。我的课在下面:

    public class EnvironmentCubemap implements Disposable{
    
    protected final Pixmap[] data = new Pixmap[6];  
    protected ShaderProgram shader;
    
    protected int u_worldTrans;
    protected Mesh quad;
    private Matrix4 worldTrans;
    private Quaternion q;
    
    protected String vertexShader = " attribute vec3 a_position; \n"+
            " attribute vec3 a_normal; \n"+
            " attribute vec2 a_texCoord0; \n"+          
            " uniform mat4 u_worldTrans; \n"+                   
            " varying vec2 v_texCoord0; \n"+
            " varying vec3 v_cubeMapUV; \n"+            
            " void main() { \n"+
            "     v_texCoord0 = a_texCoord0;     \n"+
            "     vec4 g_position = u_worldTrans * vec4(a_position, 1.0); \n"+
            "     v_cubeMapUV = normalize(g_position.xyz); \n"+
            "     gl_Position = vec4(a_position, 1.0); \n"+
            " } \n";
    
    protected String fragmentShader = "#ifdef GL_ES \n"+
            " precision mediump float; \n"+
            " #endif \n"+           
            " uniform samplerCube u_environmentCubemap; \n"+            
            " varying vec2 v_texCoord0; \n"+
            " varying vec3 v_cubeMapUV; \n"+            
            " void main() {      \n"+
            "   gl_FragColor = vec4(textureCube(u_environmentCubemap, v_cubeMapUV).rgb, 1.0);   \n"+
            " } \n";
    
    public String getDefaultVertexShader(){
        return vertexShader;
    }
    
    public String getDefaultFragmentShader(){
        return fragmentShader;
    }
    
    public EnvironmentCubemap (Pixmap positiveX, Pixmap negativeX, Pixmap positiveY, Pixmap negativeY, Pixmap positiveZ, Pixmap negativeZ) {
        data[0]=positiveX;
        data[1]=negativeX;
    
        data[2]=positiveY;
        data[3]=negativeY;
    
        data[4]=positiveZ;
        data[5]=negativeZ;
    
        init();   
    }
    
    public EnvironmentCubemap (FileHandle positiveX, FileHandle negativeX, FileHandle positiveY, FileHandle negativeY, FileHandle positiveZ, FileHandle negativeZ) {
        this(new Pixmap(positiveX), new Pixmap(negativeX), new Pixmap(positiveY), new Pixmap(negativeY), new Pixmap(positiveZ), new Pixmap(negativeZ));
    }
    
    //IF ALL SIX SIDES ARE REPRESENTED IN ONE IMAGE
    public EnvironmentCubemap (Pixmap cubemap) {        
        int w = cubemap.getWidth();
        int h = cubemap.getHeight();
        for(int i=0; i<6; i++) data[i] = new Pixmap(w/4, h/3, Format.RGB888);
        for(int x=0; x<w; x++)
            for(int y=0; y<h; y++){
                //-X
                if(x>=0 && x<=w/4 && y>=h/3 && y<=h*2/3) data[1].drawPixel(x, y-h/3, cubemap.getPixel(x, y));
                //+Y
                if(x>=w/4 && x<=w/2 && y>=0 && y<=h/3) data[2].drawPixel(x-w/4, y, cubemap.getPixel(x, y));
                //+Z
                if(x>=w/4 && x<=w/2 && y>=h/3 && y<=h*2/3) data[4].drawPixel(x-w/4, y-h/3, cubemap.getPixel(x, y));
                //-Y
                if(x>=w/4 && x<=w/2 && y>=h*2/3 && y<=h) data[3].drawPixel(x-w/4, y-h*2/3, cubemap.getPixel(x, y));
                //+X
                if(x>=w/2 && x<=w*3/4 && y>=h/3 && y<=h*2/3) data[0].drawPixel(x-w/2, y-h/3, cubemap.getPixel(x, y));
                //-Z
                if(x>=w*3/4 && x<=w && y>=h/3 && y<=h*2/3) data[5].drawPixel(x-w*3/4, y-h/3, cubemap.getPixel(x, y));
            }
        cubemap.dispose();
        cubemap=null;
        init();     
    }
    
    private void init(){        
         shader = new ShaderProgram(vertexShader, fragmentShader);
            if (!shader.isCompiled())
                throw new GdxRuntimeException(shader.getLog());
    
         u_worldTrans = shader.getUniformLocation("u_worldTrans");
    
         quad = createQuad();      
         worldTrans = new Matrix4();         
         q = new Quaternion();
    
         initCubemap();
    } 
    
    private void initCubemap(){
        //bind cubemap
        Gdx.gl20.glBindTexture(GL20.GL_TEXTURE_CUBE_MAP, 0);
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_POSITIVE_X, 0, GL20.GL_RGB, data[0].getWidth(), data[0].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[0].getPixels());
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_NEGATIVE_X, 0, GL20.GL_RGB, data[1].getWidth(), data[1].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[1].getPixels());
    
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_POSITIVE_Y, 0, GL20.GL_RGB, data[2].getWidth(), data[2].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[2].getPixels());
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_NEGATIVE_Y, 0, GL20.GL_RGB, data[3].getWidth(), data[3].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[3].getPixels());
    
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_POSITIVE_Z, 0, GL20.GL_RGB, data[4].getWidth(), data[4].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[4].getPixels());
        Gdx.gl20.glTexImage2D(GL20.GL_TEXTURE_CUBE_MAP_NEGATIVE_Z, 0, GL20.GL_RGB, data[5].getWidth(), data[5].getHeight(), 0, GL20.GL_RGB, GL20.GL_UNSIGNED_BYTE, data[5].getPixels());
    
        //Gdx.gl20.glGenerateMipmap(GL20.GL_TEXTURE_CUBE_MAP);
        //Gdx.gl20.glTexParameteri(GL20.GL_TEXTURE_CUBE_MAP, GL20.GL_TEXTURE_MIN_FILTER, GL20.GL_LINEAR);
    
        Gdx.gl20.glTexParameteri ( GL20.GL_TEXTURE_CUBE_MAP, GL20.GL_TEXTURE_MIN_FILTER,GL20.GL_LINEAR_MIPMAP_LINEAR );     
        Gdx.gl20.glTexParameteri ( GL20.GL_TEXTURE_CUBE_MAP, GL20.GL_TEXTURE_MAG_FILTER,GL20.GL_LINEAR );
        Gdx.gl20.glTexParameteri ( GL20.GL_TEXTURE_CUBE_MAP, GL20.GL_TEXTURE_WRAP_S, GL20.GL_CLAMP_TO_EDGE );
        Gdx.gl20.glTexParameteri ( GL20.GL_TEXTURE_CUBE_MAP, GL20.GL_TEXTURE_WRAP_T, GL20.GL_CLAMP_TO_EDGE );   
    
        Gdx.gl20.glGenerateMipmap(GL20.GL_TEXTURE_CUBE_MAP);
    }
    
    
    
    public void render(Camera camera){
    
        //SPECIAL THANKS TO Jos van Egmond 
        camera.view.getRotation( q, true );
        q.conjugate();
        ///////////////////////////////////    
        worldTrans.idt();
        worldTrans.rotate(quaternion);
    
        shader.begin();     
        shader.setUniformMatrix(u_worldTrans, worldTrans.translate(0, 0, -1));
    
        quad.render(shader, GL20.GL_TRIANGLES);
        shader.end();
    }
    
    public Mesh createQuad(){
        Mesh mesh = new Mesh(true, 4, 6, VertexAttribute.Position(), VertexAttribute.  ColorUnpacked(), VertexAttribute.TexCoords(0));
            mesh.setVertices(new float[] 
            {-1f, -1f, 0, 1, 1, 1, 1, 0, 1,
            1f, -1f, 0, 1, 1, 1, 1, 1, 1,
            1f, 1f, 0, 1, 1, 1, 1, 1, 0,
            -1f, 1f, 0, 1, 1, 1, 1, 0, 0});
            mesh.setIndices(new short[] {0, 1, 2, 2, 3, 0});
            return mesh;
    }
    
    @Override
    public void dispose() {
        shader.dispose();
        quad.dispose();
        for(int i=0; i<6; i++) 
            data[i].dispose();
    }
    
    }
    

    如何使用它?只需创建它的实例:

    EnvironmentCubemap envCubemap = new EnvironmentCubemap(Gdx.files.internal("cubemap/pos-x.png"), Gdx.files.internal("cubemap/neg-x.png"), 
                Gdx.files.internal("cubemap/pos-y.jpg"), Gdx.files.internal("cubemap/neg-y.jpg"), 
                Gdx.files.internal("cubemap/pos-z.png"), Gdx.files.internal("cubemap/neg-z.png"));
    

    EnvironmentCubemap envCubemap = new EnvironmentCubemap(new Pixmap(Gdx.files.internal("cubemap/all_in_one.jpg")));
    

    然后使用它的render方法:

    envCubemap.render(camera);
    

    我希望它可以帮助别人!

    【讨论】:

    • @Nolesh 您好,只是想了解您的代码,为什么您将 worldTrans(它是什么?)每帧旋转 +=0.1f?什么是假凸轮?谢谢
    • 是的,您将如何使用 libGDX 中的 Camera 类?这样旋转是适当的。
    • 不幸的是,这个类不能与 LibGDX 相机一起正常工作。如果有人能够扩展这个类来使用相机,那就太好了。
    【解决方案2】:

    默认着色器(glsl 文件)目前不支持立方体贴图。您必须提供自己的 glsl 文件才能使用立方体贴图。 DefaultShader(默认使用的着色器的 CPU 部分)将立方体贴图绑定到名为:u_environmentCubemap 的统一体。此外,如果材质包含环境立方体贴图属性,则宏 environmentCubemapFlag 将由 DefaultShader 定义。在着色器中使用以下 sn-p 来使用立方体贴图:

    #ifdef environmentCubemapFlag
    uniform samplerCube u_environmentCubemap;
    #endif
    

    这是一个使用立方体贴图(和法线贴图)的相关示例 sn-p:https://github.com/libgdx/libgdx/blob/master/tests/gdx-tests-android/assets/data/g3d/shaders/reflect.glsl 这是一个更高级的示例 sn-p:https://github.com/libgdx/libgdx/blob/master/tests/gdx-tests-android/assets/data/g3d/shaders/test.glsl

    您可以像这样指定您的自定义着色器:

    modelBatch = new ModelBatch(Gdx.files.internal("data/vertex.glsl"), Gdx.files.internal("data/fragment.glsl"));
    

    有关使用自定义着色器的更多信息:http://blog.xoppa.com/creating-a-shader-with-libgdx/

    【讨论】:

    • 感谢您的回答。我相信DefaultShader 很快就会支持立方体贴图。我没有使用立方体贴图,而是决定在我的世界中使用大球体。我从你的一些教程中得到了这个想法。
    【解决方案3】:

    我使用立方体贴图并创建了一个不使用原生 textureCube 的类。取而代之的是,我创建了 6 个平面并将它们定位在相机周围。所以,我的相机固定在这些“墙”内。这个实现比使用cubemap 描述的above 更快更容易一些。

    public class SkyBox implements Disposable{  
    
    Matrix4 tranformation;
    ShaderProgram program;  
    int u_projTrans;
    int u_worldTrans;
    int u_tex;
    
    Texture[] textures;
    
    Mesh quad;  
    boolean invert = false;
    
    protected String vertexShader =             
            " attribute vec4 a_position; "+
            " attribute vec2 a_texCoord0; "+            
            " varying vec2 v_texCoord; "+           
            " uniform mat4 u_worldTrans; "+
            " uniform mat4 u_projTrans; "+          
            " void main() "+
            " {  "+
            "   gl_Position = u_projTrans * u_worldTrans * vec4(a_position);     "+
            "   v_texCoord = a_texCoord0;    "+
            " } ";
    
    protected String fragmentShader = 
            " #ifdef GL_ES \n"+
            " precision mediump float; \n"+
            " #endif \n"+           
            " uniform sampler2D s_diffuse; "+
            " varying vec2 v_texCoord; "+           
            " void main() "+
            " { "+
            "   gl_FragColor = texture2D( s_diffuse, v_texCoord );   "+
            " } ";
    
    public String getDefaultVertexShader(){
        return vertexShader;
    }
    
    public String getDefaultFragmentShader(){
        return fragmentShader;
    }
    
    
    public SkyBox (Pixmap positiveX, Pixmap negativeX, Pixmap positiveY, Pixmap negativeY, Pixmap positiveZ, Pixmap negativeZ) {
    
        textures = new Texture[6];
    
        textures[3] = new Texture(positiveX);
        textures[2] = new Texture(negativeX);
    
        textures[4] = new Texture(positiveY);
        textures[5] = new Texture(negativeY);
    
        textures[0] = new Texture(positiveZ);
        textures[1] = new Texture(negativeZ);
    
        positiveX.dispose();
        positiveX=null;
    
        negativeX.dispose();
        negativeX=null;
    
        positiveY.dispose();
        positiveY=null;
    
        negativeY.dispose();
        negativeY=null;
    
        positiveZ.dispose();
        positiveZ=null;
    
        negativeZ.dispose();
        negativeZ=null;
    
        init();
    }
    
    public SkyBox (FileHandle positiveX, FileHandle negativeX, FileHandle positiveY, FileHandle negativeY, FileHandle positiveZ, FileHandle negativeZ) {
        this(new Pixmap(positiveX), new Pixmap(negativeX), new Pixmap(positiveY), new Pixmap(negativeY), new Pixmap(positiveZ), new Pixmap(negativeZ));     
    }
    
    public SkyBox (Pixmap cubemap) {        
        int w = cubemap.getWidth();
        int h = cubemap.getHeight();
    
        Pixmap[] data = new Pixmap[6];
        for(int i=0; i<6; i++) data[i] = new Pixmap(w/4, h/3, Format.RGB888);
        for(int x=0; x<w; x++)
            for(int y=0; y<h; y++){
                //-X
                if(x>=0 && x<=w/4 && y>=h/3 && y<=h*2/3) data[1].drawPixel(x, y-h/3, cubemap.getPixel(x, y));
                //+Y
                if(x>=w/4 && x<=w/2+1 && y>=0 && y<=h/3) data[2].drawPixel(x-w/4, y, cubemap.getPixel(x, y));
                //+Z
                if(x>=w/4 && x<=w/2 && y>=h/3 && y<=h*2/3) data[4].drawPixel(x-w/4, y-h/3, cubemap.getPixel(x, y));
                //-Y
                if(x>=w/4 && x<=w/2 && y>=h*2/3 && y<=h) data[3].drawPixel(x-w/4, y-h*2/3, cubemap.getPixel(x, y));
                //+X
                if(x>=w/2 && x<=w*3/4 && y>=h/3 && y<=h*2/3) data[0].drawPixel(x-w/2, y-h/3, cubemap.getPixel(x, y));
                //-Z
                if(x>=w*3/4 && x<=w && y>=h/3 && y<=h*2/3) data[5].drawPixel(x-w*3/4, y-h/3, cubemap.getPixel(x, y));
            }
    
        textures = new Texture[6];
    
        textures[0] = new Texture(data[4]);
        textures[1] = new Texture(data[5]);
    
        textures[2] = new Texture(data[1]);
        textures[3] = new Texture(data[0]);
    
        textures[4] = new Texture(data[2]);
        textures[5] = new Texture(data[3]);
    
        for(int i=0; i<6; i++) {
            data[i].dispose();
            data[i] = null;
        }
        cubemap.dispose();
        cubemap=null;
    
        init();
    }
    
    public SkyBox (FileHandle cubemap){
        this(new Pixmap(cubemap));
    }
    
    public Mesh createTexturedQuad(){
        Mesh quad = new Mesh(true, 4, 6, VertexAttribute.Position(), new VertexAttribute(Usage.TextureCoordinates, 2, "a_texCoord0"));
        quad.setVertices(new float[] 
            {-1f, -1f, 0, 0, 1,
            1f, -1f, 0, 1, 1,
            1f, 1f, 0, 1, 0,
            -1f, 1f, 0, 0, 0});
        quad.setIndices(new short[] {0, 1, 2, 2, 3, 0});
        return quad;
    }
    
    public void setInvert(boolean enable){
        invert = enable;
    }
    
    public void init() {        
        program = new ShaderProgram(vertexShader, fragmentShader);
        if (!program.isCompiled())
            throw new GdxRuntimeException(program.getLog());
        else Gdx.app.log("shader", "shader compiled successfully!");
        u_projTrans = program.getUniformLocation("u_projTrans");
        u_worldTrans = program.getUniformLocation("u_worldTrans");
        u_tex = program.getUniformLocation("s_diffuse");   
    
        tranformation = new Matrix4();      
        quad = createTexturedQuad();
    
    }
    
    
    public void render(Camera camera){      
    
        Gdx.graphics.getGL20().glCullFace(GL20.GL_BACK);
    
        program.begin();    
        program.setUniformMatrix(u_projTrans, camera.combined);
    
        //front
        tranformation.idt();    
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);           
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[0].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        //left  
        tranformation.idt();
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);       
        tranformation.rotate(Vector3.Y, 90);    
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[ invert ? 3 : 2].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        //right
        tranformation.idt();
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);       
        tranformation.rotate(Vector3.Y, -90);   
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[invert ? 2 : 3].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        //bottom
        tranformation.idt();
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);       
        tranformation.rotate(Vector3.X, -90);   
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[5].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        //top
        tranformation.idt();
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);       
        tranformation.rotate(Vector3.X, 90);    
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[4].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        //back
        tranformation.idt();
        tranformation.translate(camera.position.x, camera.position.y, camera.position.z);           
        tranformation.rotate(Vector3.Y, 180);   
        tranformation.translate(0, 0, -1);
        if(invert) tranformation.rotate(Vector3.Y, 180);
        program.setUniformMatrix(u_worldTrans, tranformation);      
        textures[1].bind(0);
        program.setUniformi("s_diffuse", 0);        
        quad.render(program, GL20.GL_TRIANGLES);
    
        program.end();  
    }
    
    @Override
    public void dispose() {
        program.dispose();
        quad.dispose(); 
        for(int i=0; i<6; i++){
            textures[i].dispose();
            textures[i]=null;
        }
    }
    }
    

    这个类的使用和previous one一样。编码愉快!

    【讨论】:

    • 如何将其放大以成为场景的背景,我的意思是我希望场景中的对象出现在四边形内
    【解决方案4】:

    除了Nolesh' solution,天空盒可以像这样相对于相机旋转正确旋转:

    Quaternion q = new Quaternion();
    camera.view.getRotation( q, true );
    q.conjugate();
    
    envCubemap.render( q );
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-09-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-05-06
      相关资源
      最近更新 更多