Back to Qt.io
Contact Us Blog Download Qt
Auf dieser Seite

Qt 3D: Einfaches QML-Beispiel für ein benutzerdefiniertes Material

Veranschaulicht die Erstellung eines benutzerdefinierten Materials in „ Qt 3D “.

Abbildung eines roten Quadrats

Dieses Beispiel zeigt, wie ein einfaches benutzerdefiniertes Material erstellt wird.

Ausführen des Beispiels

Sie können das Beispiel wie folgt ausführen:

Festlegen der Szene

Das Beispiel verwendet „ Scene3D “, um eine Szene zu rendern, in der das benutzerdefinierte Material verwendet wird. Die Szene enthält ein Ebenenmodell, das das benutzerdefinierte Material verwendet.

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)
    }
}

Festlegen des Materials

Das Material wird in „ simplecustommaterial/SimpleMaterial.qml “ mithilfe des Typs „ Material “ festgelegt. Zunächst werden die Parameter des Materials definiert, die den entsprechenden Uniforms in den Shadern zugeordnet werden, sodass sie über die QML geändert werden können.

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)
    }
]

Als Nächstes legen wir fest, welche Shader geladen werden. Für OpenGL ES 2- und OpenGL-Renderer stehen separate Versionen der Shader zur Verfügung.

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"

Im Vertex-Shader transformieren wir die Position einfach mithilfe der Transformationsmatrizen.

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);
}

Im Fragment-Shader setzen wir die Fragmentfarbe einfach auf die im Material angegebene Hauptfarbe.

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

Anschließend erstellen wir aus den Shadern „ ShaderPrograms “.

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)
}

Schließlich werden die Shader-Programme in den Techniken verwendet, die einem bestimmten API-Profil entsprechen.

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

Beispielprojekt @ 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.