add book

Qt6QMLBeginnersCode/12-TransformsTransitionsAnimations/13-StatesTransitions/CMakeLists.txt

@@ -0,0 +1,48 @@
+cmake_minimum_required(VERSION 3.16)
+
+project(13-StatesTransitions VERSION 0.1 LANGUAGES CXX)
+
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+
+find_package(Qt6 6.4 REQUIRED COMPONENTS Quick)
+
+qt_standard_project_setup()
+
+qt_add_executable(app13-StatesTransitions
+    main.cpp
+)
+
+qt_add_resources(app13-StatesTransitions "images"
+        PREFIX /
+        FILES
+                images/treespringsmall.png
+                images/treesummersmall.png
+)
+
+qt_add_qml_module(app13-StatesTransitions
+    URI 13-StatesTransitions
+    VERSION 1.0
+    QML_FILES Main.qml
+)
+
+# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
+# If you are developing for iOS or macOS you should consider setting an
+# explicit, fixed bundle identifier manually though.
+set_target_properties(app13-StatesTransitions PROPERTIES
+#    MACOSX_BUNDLE_GUI_IDENTIFIER com.example.app13-StatesTransitions
+    MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
+    MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
+    MACOSX_BUNDLE TRUE
+    WIN32_EXECUTABLE TRUE
+)
+
+target_link_libraries(app13-StatesTransitions
+    PRIVATE Qt6::Quick
+)
+
+include(GNUInstallDirs)
+install(TARGETS app13-StatesTransitions
+    BUNDLE DESTINATION .
+    LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR}
+    RUNTIME DESTINATION ${CMAKE_INSTALL_BINDIR}
+)

Qt6QMLBeginnersCode/12-TransformsTransitionsAnimations/13-StatesTransitions/Main.qml

@@ -0,0 +1,152 @@
+import QtQuick
+
+Window {
+    width: 640
+    height: 480
+    visible: true
+    title: qsTr("States and Transitions")
+
+    Rectangle{
+        id: containerRectId
+        anchors.fill: parent
+
+        //Sky
+        Rectangle{
+            id: skyId
+            width: parent.width
+            height: 200
+            color: "blue"
+        }
+
+
+        Rectangle{
+            id: groundId
+            anchors.top: skyId.bottom
+            anchors.bottom: parent.bottom
+            width: parent.width
+            color: "lime"
+        }
+
+
+        Image{
+            id: treeSummerId
+            x: 50
+            y: 100
+            width: 200
+            height: 300
+            source: "qrc:/images/treesummersmall.png"
+        }
+
+        Image{
+            id: treeSpringId
+            x: 50
+            y: 100
+            width: 200
+            height: 300
+            source: "qrc:/images/treespringsmall.png"
+        }
+
+        Rectangle{
+            id: sunId
+            x: parent.width - width - 100
+            y: 50
+            width: 100
+            height: 100
+            color: "yellow"
+            radius: 600
+        }
+
+        state: "spring"
+
+        states: [
+
+           //Spring
+            State{
+                name: "spring"
+                PropertyChanges {
+                   target: skyId
+                   color: "deepskyblue"
+                }
+                PropertyChanges {
+                    target: treeSummerId
+                    opacity: 0
+                }
+                PropertyChanges {
+                    target: treeSpringId
+                    opacity: 1
+                }
+                PropertyChanges {
+                    target: groundId
+                    color: "lime"
+                }
+                PropertyChanges {
+                    target: sunId
+                    color: "lightyellow"
+
+                }
+            },
+
+            //Summer
+            State{
+                name: "summer"
+                PropertyChanges {
+                   target: skyId
+                   color: "lightblue"
+                }
+                PropertyChanges {
+                    target: treeSummerId
+                    opacity: 1
+                }
+                PropertyChanges {
+                    target: treeSpringId
+                    opacity: 0
+                }
+                PropertyChanges {
+                    target: groundId
+                    color: "darkkhaki"
+                }
+                PropertyChanges {
+                    target: sunId
+                    color: "yellow"
+
+                }
+            }
+
+        ]
+
+        //Transitions
+        transitions: [
+            Transition{
+                from: "summer"
+                to: "spring"
+                ColorAnimation{
+                    duration: 500
+                }
+                NumberAnimation{
+                    property: "opacity"
+                    duration: 500
+                }
+            },
+
+            Transition{
+                from: "spring"
+                to: "summer"
+                ColorAnimation{
+                    duration: 500
+                }
+                NumberAnimation{
+                    property: "opacity"
+                    duration: 500
+                }
+
+            }
+        ]
+
+        MouseArea{
+            anchors.fill: parent
+            onClicked: function(){
+                containerRectId.state = (containerRectId.state === "spring" ? "summer" : "spring")
+            }
+        }
+    }
+}

Qt6QMLBeginnersCode/12-TransformsTransitionsAnimations/13-StatesTransitions/main.cpp

@@ -0,0 +1,19 @@
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+int main(int argc, char *argv[])
+{
+    QGuiApplication app(argc, argv);
+
+    QQmlApplicationEngine engine;
+    const QUrl url(u"qrc:/13-StatesTransitions/Main.qml"_qs);
+    QObject::connect(
+        &engine,
+        &QQmlApplicationEngine::objectCreationFailed,
+        &app,
+        []() { QCoreApplication::exit(-1); },
+        Qt::QueuedConnection);
+    engine.load(url);
+
+    return app.exec();
+}