Qt 3D: Ejemplo QML de material personalizado simple

Demuestra la creación de un material personalizado en Qt 3D.

Ilustración de un cuadrado rojo

Este ejemplo demuestra la creación de un material personalizado simple.

Ejecutar el ejemplo

Para ejecutar el ejemplo desde Qt Creatorabra el modo Welcome y seleccione el ejemplo de Examples. Para obtener más información, consulte Qt Creator: Tutorial: Construir y ejecutar.

Especificación de la escena

El ejemplo utiliza Scene3D para renderizar una escena que utilizará el material personalizado. La escena contiene un modelo de plano, que utiliza el material personalizado.

Entity {
    id: root

    components: [transform, mesh, material]

    SimpleMaterial {
        id: material
        maincolor: "red"
    }

    Transform {
        id: transform
        rotationX: 45
    }

    PlaneMesh {
        id: mesh
        width: 1.0
        height: 1.0
        meshResolution: Qt.size(2, 2)
    }
}

Especificación del material

El material se especifica en simplecustommaterial/SimpleMaterial.qml utilizando el tipo Material. Primero el material especifica parámetros, que son mapeados a los uniformes correspondientes en los shaders para que puedan ser cambiados desde el qml.

property color maincolor: Qt.rgba(0.0, 0.0, 0.0, 1.0)

parameters: [
    Parameter {
        name: "maincolor"
        value: Qt.vector3d(root.maincolor.r, root.maincolor.g, root.maincolor.b)
    }
]

A continuación se especifica qué shaders se cargan. Se proporcionan versiones separadas de los shaders para los renderizadores OpenGL ES 2 y OpenGL.

property string vertex: "qrc:/shaders/gl3/simpleColor.vert"
property string fragment: "qrc:/shaders/gl3/simpleColor.frag"
property string vertexRHI: "qrc:/shaders/gl45/simpleColor.vert"
property string fragmentRHI: "qrc:/shaders/gl45/simpleColor.frag"
property string vertexES: "qrc:/shaders/es2/simpleColor.vert"
property string fragmentES: "qrc:/shaders/es2/simpleColor.frag"

En el sombreador de vértices simplemente transformamos la posición por las matrices de transformación.

void main()
{
    // Transform position, normal, and tangent to world coords
    worldPosition = vec3(modelMatrix * vec4(vertexPosition, 1.0));

    // Calculate vertex position in clip coordinates
    gl_Position = mvp * vec4(worldPosition, 1.0);
}

En el fragment shader simplemente establecemos el color del fragmento para que sea el color principal especificado en el material.

uniform vec3 maincolor;
void main()
{
    //output color from material
    fragColor = vec4(maincolor,1.0);
}

A continuación, creamos ShaderPrograms a partir de los shaders.

ShaderProgram {
    id: gl3Shader
    vertexShaderCode: loadSource(parent.vertex)
    fragmentShaderCode: loadSource(parent.fragment)
}
ShaderProgram {
    id: es2Shader
    vertexShaderCode: loadSource(parent.vertexES)
    fragmentShaderCode: loadSource(parent.fragmentES)
}
ShaderProgram {
    id: rhiShader
    vertexShaderCode: loadSource(parent.vertexRHI)
    fragmentShaderCode: loadSource(parent.fragmentRHI)
}

Por último, los programas de sombreado se utilizan en las técnicas correspondientes a un perfil Api específico.

// OpenGL 3.1
Technique {
    filterKeys: [forward]
    graphicsApiFilter {
        api: GraphicsApiFilter.OpenGL
        profile: GraphicsApiFilter.CoreProfile
        majorVersion: 3
        minorVersion: 1
    }
    renderPasses: RenderPass {
        shaderProgram: gl3Shader
    }
},

Proyecto de ejemplo @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.