<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[3d Cube color picker in QML]]></title><description><![CDATA[<p dir="auto">Dear developers</p>
<p dir="auto">I am currently developing a colour cube for 3D colour selection.</p>
<p dir="auto">This cube rotates according to the finger movements on the screen.</p>
<p dir="auto">However, I have some problems with some rotations of the cube. These rotations are the following:</p>
<ul>
<li>Rotation with a finger movement from left to right</li>
<li>Rotation with a finger movement from right to left</li>
</ul>
<p dir="auto">For the colour selection I have no idea how to implement it.</p>
<p dir="auto">I have to develop this project only in QML.</p>
<p dir="auto">Can someone help me?</p>
<p dir="auto">I am attaching the code of each object I created in QML and the uv mapping of the cube.</p>
<p dir="auto"><strong>main.qml</strong></p>
<pre><code>Window {
    visible: true
    property alias scene3d: scene3d
    width: 600
    height: 600

    Scene3D
    {
        id : scene3d
        anchors.fill: parent
        focus: false
        aspects: ["render", "logic", "input"]
        hoverEnabled: true
        cameraAspectRatioMode: Scene3D.AutomaticAspectRatio

        RootEntity
        {
            id:root
        }
    }

    Model {
        id: cube
        x: -18.166
        y: 28.564
        source: "#Cube"
        z: -22.62796
        materials: cubeMaterial
        DefaultMaterial {
            id: cubeMaterial
            diffuseColor: "#4aee45"
        }
    }
}
</code></pre>
<p dir="auto"><strong>CustomCameraController.qml</strong></p>
<pre><code>Entity{
    id: root
    property Camera camera;
    property real dt: 0.001
    property real linearSpeed: 1
    property real lookSpeed: 500

    MouseDevice {
        id: mouseDevice
        sensitivity: 0.007
    }

    MouseHandler {
        id: mh
        property vector3d upVect: Qt.vector3d(0, 1, 0)
        property point lastPos;
        property real pan;
        property real tilt;
        sourceDevice: mouseDevice

        onPanChanged: {

            if (camera.position.y &lt; 0.5 &amp;&amp; camera.position.y &gt; -3.) {


                root.camera.panAboutViewCenter(-pan, upVect);

            }

            if (camera.position.y &gt; 0.5 &amp;&amp; camera.position.y &lt; 3.) {

                root.camera.panAboutViewCenter(pan, upVect);

            }

            if (camera.position.y &lt; 6. &amp;&amp; camera.position.y &gt; 3.) {

                root.camera.panAboutViewCenter(-pan, upVect);

            }

            if (camera.position.y &gt; -6. &amp;&amp; camera.position.y &lt; -3.) {

                root.camera.panAboutViewCenter(pan, upVect);

            }

        }

        onTiltChanged: root.camera.tiltAboutViewCenter(tilt);

        onPressed: {

            lastPos = Qt.point(mouse.x, mouse.y);

        }

        onPositionChanged: {

            if (mouse.buttons === 1){ // Left button for rotation

                pan = -(mouse.x - lastPos.x) * dt * lookSpeed;
                tilt = (mouse.y - lastPos.y) * dt * lookSpeed;

            }

            lastPos = Qt.point(mouse.x, mouse.y)

        }
    }
}

**RootEntity.qml**

</code></pre>
<p dir="auto">Entity {<br />
id: root</p>
<pre><code>Camera {
    id: mainCamera
    projectionType: CameraLens.PerspectiveProjection
    fieldOfView: 45
    aspectRatio: 16/9
    nearPlane : 0.1
    farPlane : 1000.0
    position: Qt.vector3d(0.0, 4.49373, -3.78577)
    upVector: Qt.vector3d( 0.0, 1.0, 0.0 )
    viewCenter: cubeTransform.translation
}

CustomCameraController {
    id: mainCameraController
    camera: mainCamera
}

components: [

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(1, 0, 0)

    },

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(0, 1, 0)

    },

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(-1, 0, 0)

    },

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(0, -1, 0)

    },

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(0, 0, 1)

    },

    DirectionalLight{
        color: "#e0eef0"
        intensity: 0.4
        enabled: true
        worldDirection: Qt.vector3d(0, 0, -1)

    },


    RenderSettings {


        Viewport {
            normalizedRect: Qt.rect(0.0, 0.0, 1.0, 1.0)

            RenderSurfaceSelector {
                CameraSelector {
                    id: cameraSelector
                    camera: mainCamera

                    FrustumCulling {

                        ClearBuffers {
                            buffers: ClearBuffers.AllBuffers
                            clearColor: "black"
                            NoDraw {}
                        }

                        LayerFilter {
                            filterMode: LayerFilter.DiscardAnyMatchingLayers
                            layers: [topLayer]
                        }

                        LayerFilter {
                            filterMode: LayerFilter.AcceptAnyMatchingLayers
                            layers: [topLayer]

                            ClearBuffers {
                                buffers: ClearBuffers.DepthBuffer
                            }
                        }
                    }
                }

            }

        }
    },

    InputSettings {}
]

Layer {
    id: topLayer
    recursive: true
}

Entity {
        id: cubeEntity


        Texture2D {
            id: cubeTexture

            TextureImage {
                source: "qrc:/texture.png"
            }
        }

        Mesh {
            id: cubeMesh

            source: "qrc:/cube.obj"
        }

        Transform {
            id: cubeTransform
        }

        ObjectPicker {
            id: cubePicker

            onClicked: {

                console.log("x : " + pick.worldIntersection.normalized().x)
                console.log("y : " + pick.worldIntersection.normalized().y)
                console.log("z : " + pick.worldIntersection.normalized().z)
                console.log("position : " + pick.position)

            }
        }

        NormalDiffuseMapMaterial{
            id: cubeMaterial
            diffuse: cubeTexture
            normal: cubeTexture
            specular: "black"
            shininess: 50
        }

        components: [cubeMesh, cubeTransform, cubeMaterial, cubePicker]

}
</code></pre>
<p dir="auto">}</p>
<p dir="auto"><strong>Texture uv mapping</strong></p>
<p dir="auto"><img src="https://ddgobkiprc33d.cloudfront.net/d4cb6541-5b12-418c-bc38-4b290bcd7bb9.png" alt="texture.png" class=" img-fluid img-markdown" /></p>
<p dir="auto"><strong>Picture of the application</strong></p>
<p dir="auto"><img src="https://ddgobkiprc33d.cloudfront.net/a6302c48-a2cb-4896-aa66-9ef277aee8d3.png" alt="5826282d-a0ea-4d41-9212-0b639df9b596-image.png" class=" img-fluid img-markdown" /></p>
]]></description><link>https://forum.qt.io/topic/129478/3d-cube-color-picker-in-qml</link><generator>RSS for Node</generator><lastBuildDate>Tue, 22 Sep 2026 00:51:32 GMT</lastBuildDate><atom:link href="https://forum.qt.io/topic/129478.rss" rel="self" type="application/rss+xml"/><pubDate>Tue, 17 Aug 2021 11:35:32 GMT</pubDate><ttl>60</ttl></channel></rss>