轉帖|使用教程|編輯:鮑佳佳|2021-09-01 10:41:47.750|閱讀 381 次
概述:文本演示了在 Qt 3D 場景中使用 Qt Quick 2 的 QML 應用程序。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
文本演示了在 Qt 3D 場景中使用 Qt Quick 2 的 QML 應用程序。
Qt組件推薦:
Scene2D演示了如何將 Qt Quick 2 場景渲染為紋理并在 Qt 3D 應用程序中使用該紋理,包括處理鼠標事件。3D 場景包含一個單獨的活動相機,并渲染一個 3D Qt 徽標以及一些使用 Qt Quick Controls 聲明的控件。
要從Qt Creator運行示例,請打開歡迎模式并從示例中選擇示例。有關更多信息,請訪問構建和運行示例。
我們在充當對象樹根的實體中設置 3D 場景。虛擬攝像機在main.qml 中指定:
Camera { { id: camera projectionType: CameraLens.PerspectiveProjection position: Qt.vector3d( 0.0, 0.0, 20 )) }
該RenderSettings指定使用的渲染算法,也使這是需要突出的Qt Quick的場景在3D幾何時妥善處理的鼠標事件三角形基于采摘:
RenderSettings { { activeFrameGraph: ForwardRenderer { { camera: camera clearColor: "white" } pickingSettings.pickMethod: pickMethod: PickingSettings.TrianglePicking },},
將由 Qt Quick 場景中的控件控制的 3D Qt 徽標聲明為:
Entity { { id: logoEntity Transform { { id: logoTransform scale: 1 translation: Qt.vector3d( 0, 0, logoControls.logoCentreZ ) ) rotation: fromEulerAngles( logoControls.rotationX, logoControls.rotationY, logoControls.rotationZ )) } Mesh { { id: logoMesh source: "Qt_logo.obj" } PhongMaterial { { id: logoMaterial diffuse: Qt.rgba( logoControls.colorR/255, logoControls.colorG/255, logoControls.colorB/255, 1.0 ) ) ambient: Qt.rgba( 0.1, 0.1, 0.1, 1.0 ) ) shininess: logoControls.shininess } components: [ [ logoTransform, logoMesh, logoMaterial ]] }
它只是由一個用于加載幾何體的 Mesh 組件組成;一個 PhongMaterial 組件給它一個表面外觀,一個 Transform 組件來指定它的位置、方向和比例。這些組件的屬性綁定到 logoControls 元素上的屬性,我們將在接下來討論。
我們首先聲明將成為我們的控制面板的實體。它由一個CuboidMesh組成,我們將在其上放置包含 Qt Quick 場景渲染的紋理。在這種情況下,我們為幾何體使用了一個簡單的立方體,但我們可以使用任何有效的 3D 幾何體,只要它具有紋理坐標即可。紋理坐標用于將紋理投影到 3D 表面上,也用于計算要傳遞到原始 Qt Quick 場景的鼠標事件的坐標。
Entity { { id: cube components: [ [cubeTransform, cubeMaterial, cubeMesh, cubePicker] property property real rotationAngle: 0 Transform { { id: cubeTransform translation: Qt.vector3d(2, 0, 10) scale3D: Qt.vector3d(1, 4, 1) rotation: fromAxisAndAngle(Qt.vector3d(0,1,0), cube.rotationAngle) } CuboidMesh { { id: cubeMesh }}
我們還包含一個ObjectPicker組件,以便我們可以使用鼠標與控件交互:
ObjectPicker { { id: cubePicker hoverEnabled: true dragEnabled: true // Explicitly require a middle click to have the Scene2D grab the mouse // events from the picker onPressed: { { if ((pick.button === PickEvent.MiddleButton) { { qmlTexture.mouseEnabled = !!qmlTexture.mouseEnabled logoControls.enabled = !!logoControls.enabled } } }
對于此示例,我們選擇使用一種交互機制,您必須明確地用中鍵單擊控件才能啟用它們。
要將紋理應用于網格,我們使用內置的 TextureMaterial:
TextureMaterial { id: cubeMaterial texture: offscreenTexture }
最后剩下的部分是如何從 Qt Quick 場景渲染上述紋理。這是通過Scene2D元素完成的:
Scene2D { id: qmlTexture output: RenderTargetOutput { attachmentPoint: RenderTargetOutput.Color0 texture: Texture2D { id: offscreenTexture width: 256 height: 1024 format: Texture.RGBA8_UNorm generateMipMaps: true magnificationFilter: Texture.Linear minificationFilter: Texture.LinearMipMapLinear wrapMode { x: WrapMode.ClampToEdge y: WrapMode.ClampToEdge
我們使用Texture2D和RenderTargetOutput類型來創建目標紋理并將其附加為Scene2D渲染器的輸出。
接下來,我們告訴Scene2D對象哪些實體可以為其提供輸入事件,并且我們最初禁用鼠標事件的處理:
} } } entities: [ [ cube ]]
最后,我們可以通過將自定義 QML 組件作為子元素添加到Scene2D元素來指定要渲染的 Qt Quick 場景:
LogoControls { id: logoControls width: offscreenTexture.width height: offscreenTexture.height } }
當ObjectPicker將 mouseEnabled 屬性設置為 true 時,Scene2D對象將處理來自附加到所列實體的任何 ObjectPicker 的鼠標事件。通過這種方式,您可以自由地以任何您希望的方式使用Scene2D對象生成的紋理,即使在多個實體上也是如此。
該LogoControls.qml文件只是一個普通的Qt Quick的2場面在這種情況下還使用Qt Quick的控制組件。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自: