Qt Quick 3D - HelloCube の例

Qt Quick 3D で 2D オブジェクトと 3D オブジェクトを一緒にレンダリングする方法を説明します。

HelloCubeは、Qt Quick 3D で 2D アイテムを含む 3D 立方体をレンダリングする方法を示します。

2D アイテムの描画

シーン全体をmain.qmlファイルで設定します。

QtQuick3D モジュールの型を使えるようにするには、インポートする必要があります：

import QtQuick3D

矩形に画像とテキストを配置したシンプルなQtQuick アイテムを定義します。

Image {
    anchors.fill: parent
    source: "qt_logo.png"
}
Text {
    anchors.bottom: parent.bottom
    anchors.left: parent.left
    color: "white"
    font.pixelSize: 17
    text: qsTr("The Future is Written with Qt")
}

この単純な長方形には、縦に反転するアニメーションが2つあります。

transform: Rotation {
    id: rotation
    origin.x: qt_logo.width / 2
    origin.y: qt_logo.height / 2
    axis { x: 1; y: 0; z: 0 }
}

PropertyAnimation {
    id: flip1
    target: rotation
    property: "angle"
    duration: 600
    to: 180
    from: 0
}
PropertyAnimation {
    id: flip2
    target: rotation
    property: "angle"
    duration: 600
    to: 360
    from: 180
}

3D立方体を描く

立方体を描くのはとても簡単です。Camera とLight を定義した後、組み込みのModel で立方体を作成します。この例では、この立方体の表面に、前の2D長方形を拡散Texture としてレンダリングします。Rectangleでは、layer.enabled をtrue に設定する。

layer.enabled: true

このプロパティを有効にすると、2Dアイテムがオフスクリーン・サーフェスにレンダリングされ、キューブのテクスチャとして使用されます。

id: cube
source: "#Cube"
materials: DefaultMaterial {
    diffuseMap: Texture {
        sourceItem: qt_logo
    }
}
eulerRotation.y: 90

プロジェクト例 @ code.qt.io

©2024 The Qt Company Ltd. 本書に含まれるドキュメントの著作権は、それぞれの所有者に帰属します。本書で提供されるドキュメントは、Free Software Foundation が発行したGNU Free Documentation License version 1.3に基づいてライセンスされています。 Qtおよびそれぞれのロゴは、フィンランドおよびその他の国におけるThe Qt Company Ltd.の商標です。その他すべての商標は、それぞれの所有者に帰属します。