實作單通道線框渲染方法的 Qt 3D QML 應用程式。
Qt 3D 線框渲染說明了如何使用一組自定義着色器繪制單個實體（三葉結）以實作單通道線框渲染方法。Qt技術交流交流群開通，QQ搜尋群号“7654444821”加入
下載下傳Qt6最新試用版
運作示例
要從Qt Creator運作示例，請打開歡迎模式并從示例中選擇示例。有關更多資訊，請通路建構和運作示例。
建立實體
渲染器方面尋找具有一些幾何體、材質和可選的變換的實體。這些都是以 QComponent 的子類的形式指定的，這些子類已經以Mesh、Material和Transform的形式導出到 QML 引擎中。我們使用這些元件在TrefoilKnot.qml 中建立自定義 QML 項。
我們首先導入Qt3D 2.0提供實體類型和值類型助手的子產品，例如 Qt.vector3d()。我們還導入了Qt3D.Renderer提供渲染器方面選取的元件和其他類型的子產品：
import Qt3D.Core 2.0
import Qt3D.Render 2.0
要使用其他方面的元件，我們也需要導入相應的 QML 子產品。
然後，我們使用實體類型作為自定義 QML 類型的根元素，公開一些自定義屬性，就像在 QML 中使用任何其他類型一樣：
Entity {
id: root
property real x: 0.0
property real y: 0.0
property real z: 0.0
property real scale: 1.0
property real theta: 0.0
property real phi: 0.0
property Material material
除了聚合元件之外，Entity類型還可用于将子對象組合在一起。這類似于Qt Quick 2 中Item類型的使用方式。
指定轉換
我們執行個體化一個Transform元件和一個Mesh元件。該變換部件指定當繪制與OpenGL的管線渲染器應該如何改變的幾何形狀。我們将一組有序的轉換組合成一個單一的Transform元件。這些資訊将通過标準命名的統一變量自動提供給我們的着色器：
Transform {
id: transform
translation: Qt.vector3d(root.x, root.y, root.z)
rotation: fromEulerAngles(theta, phi, 0)
scale: root.scale
}
加載動态 Per-Vertex 資料
該網格元件是非常簡單的。我們使用它的 source 屬性從 Wavefront Obj 格式的檔案中加載一組靜态幾何體（例如頂點位置、法線向量和紋理坐标）。此資料是從 Blender 應用程式導出的。
Mesh {
id: mesh
source: "assets/obj/trefoil.obj"
}
除了Mesh元素，Qt 3D 還支援通過基于任務的引擎調用的 C++ 鈎子動态生成每個頂點的屬性資料。
聚合元件
然而，僅僅執行個體化元件是不夠的。為了讓它們在實體上注入特殊行為，實體必須通過它的 components 屬性聚合元件：
components: [ transform, mesh, root.material ]
這允許在多個實體之間非常容易地共享元件。在這個例子中，我們有包含在 TrefoilKnot 自定義類型中的變換和網格元件。Material類型的最終元件由 TrefoilKnot 自定義類型的屬性提供。我們稍後将自定義實體的外觀。
從相機渲染
我們使用 main.qml 中的 TrefoilKnot 自定義類型在螢幕上繪制三葉結。
我們使用與TrefoilKnot.qml 中相同的導入語句，并為動畫所需的 Qt Quick 子產品添加命名空間導入：
import QtQuick 2.1 as QQ2
import Qt3D.Core 2.0
import Qt3D.Render 2.0
我們使用實體類型作為根類型隻是為了充當其子項的父項。從這個意義上說，Entity類型很像Item類型：
import Qt3D.Input 2.0
import Qt3D.Extras 2.0
Entity {
id: root
RendererSettings 元件使用ForwardRenderer類型來完全配置渲染器，而無需觸及任何 C++ 代碼：
// Render from the mainCamera
components: [
RenderSettings {
activeFrameGraph: ForwardRenderer {
id: renderer
camera: mainCamera
}
},
// Event Source will be set by the Qt3DQuickWindow
InputSettings { }
]
BasicCamera 類型是對表示虛拟相機的内置Camera類型的簡單包裝。它具有諸如近平面和遠平面、視野、縱橫比、投影類型、位置和方向等屬性：
BasicCamera {
id: mainCamera
position: Qt.vector3d( 0.0, 0.0, 15.0 )
}
的配置類型提供了一種用于當正在完成其使用的方面和部件适當執行具有照相機的滑鼠控制臨時解決方法：
FirstPersonCameraController { camera: mainCamera }
使用多個相機并使用幀圖在它們之間進行選擇是微不足道的，以進行全部或部分場景渲染。
映射材料
Qt 3D 有一個強大且非常靈活的材料系統，允許多層次的定制。我們使用 WireframeMaterial 自定義類型來包裝Material類型：
WireframeMaterial {
id: wireframeMaterial
effect: WireframeEffect {}
ambient: Qt.rgba( 0.2, 0.0, 0.0, 1.0 )
diffuse: Qt.rgba( 0.8, 0.0, 0.0, 1.0 )
然後我們執行個體化 TrefoilKnot 類型并在其上設定材質：
TrefoilKnot {
id: trefoilKnot
material: wireframeMaterial
}
Qt 3D 引擎與渲染器方面現在有足夠的資訊來最終使用我們指定的材質渲染我們的網格。
使用動畫元素
我們使用 Qt Quick 2 提供的動畫元素為 TrefoilKnot 和 WireframeMaterial 類型的屬性設定動畫。使用 QML 屬性綁定機制更新類型的元件的屬性：
QQ2.SequentialAnimation {
loops: QQ2.Animation.Infinite
running: true
QQ2.NumberAnimation {
target: wireframeMaterial;
property: "lineWidth";
duration: 1000;
from: 0.8
to: 1.8
}
QQ2.NumberAnimation {
target: wireframeMaterial;
property: "lineWidth";
duration: 1000;
from: 1.8
to: 0.8
}
QQ2.PauseAnimation { duration: 1500 }
}
QNode基類會注意到屬性更新，并自動發送到渲染器方面中的相應對象。然後渲染器負責将屬性更新轉換為 GLSL 着色器程式中統一變量的新值。
運作示例以檢視線框線寬度脈沖的三葉結。所有繁重的工作都由 GPU 完成。CPU 隻需運作屬性動畫并将場景圖和幀圖轉換為原始 OpenGL 調用。
也可以通過自定義着色器程式和材質在 GPU 上制作動畫。
Qt元件推薦
- QtitanRibbon |下載下傳試用：遵循Microsoft Ribbon UI Paradigm for Qt技術的Ribbon UI元件，研究為Windows、Linux和Mac OS X提供功能完整的Ribbon元件。
- QtitanChart |下載下傳試用：是一個C++庫，代表一組，這些控件使您可以快速地為應用程式提供漂亮而豐富的圖形。并且支援所有主要的桌
================================================== ==
Qt技術交流交流群開通，QQ搜尋群号“7654444821”或者掃描二維碼加入
