horizontal

[apps/homescreen.git] / homescreen / qml / main.qml

diff --git a/homescreen/qml/main.qml b/homescreen/qml/main.qml
index 96a1950..13500bd 100644 (file)
--- a/homescreen/qml/main.qml
+++ b/homescreen/qml/main.qml
@@ -26,38 +26,145 @@ Window {
     width: container.width * container.scale
     height: container.height * container.scale
     title: 'HomeScreen'
+    color: "#00000000"
 
     Image {
         id: container
         anchors.centerIn: parent
-        width: 1080
-        height: 1920
-        scale: screenInfo.scale_factor()
-        source: './images/AGL_HMI_Blue_Background_NoCar-01.png'
+        width: 1920
+        height: 720
+        scale: 1.0
+        source: './images/menubar_background.png'
 
         ColumnLayout {
+            id: menuBar
             anchors.fill: parent
             spacing: 0
             TopArea {
                 id: topArea
-                Layout.fillWidth: true
-                Layout.preferredHeight: 218
+                anchors.horizontalCenter: parent.horizontalCenter
+                Layout.preferredHeight: 80
+                x: 640
             }
 
             Item {
                 id: applicationArea
                 Layout.fillWidth: true
                 Layout.fillHeight: true
-                Layout.preferredHeight: 1920 - 218 - 215
+                Layout.preferredHeight: 510
 
                 visible: true
+                MouseArea {
+                    enabled: true
+                }
             }
 
-            MediaArea {
-                id: mediaArea
-                Layout.fillWidth: true
+            ShortcutArea {
+                id: shortcutArea
+                anchors.horizontalCenter: parent.horizontalCenter
                 Layout.fillHeight: true
-                Layout.preferredHeight: 215
+                Layout.preferredHeight: 130
+            }
+        }
+        states: [
+            State {
+                name: "normal"
+                PropertyChanges {
+                    target: container
+                    y: 0
+                }
+                PropertyChanges {
+                    target: topArea
+                    y: 0
+                }
+                PropertyChanges {
+                    target: applicationArea
+                    y: 80
+                }
+                PropertyChanges {
+                    target: shortcutArea
+                    y: 590
+                }
+            },
+            State {
+                name: "fullscreen"
+                PropertyChanges {
+                    target: container
+                    y: -720
+                }
+                PropertyChanges {
+                    target: topArea
+                    y: -80
+                }
+                PropertyChanges {
+                    target: applicationArea
+                    y: -510
+                }
+                PropertyChanges {
+                    target: shortcutArea
+                    y: 720
+                }
+            }
+        ]
+        transitions: Transition {
+            NumberAnimation {
+                target: topArea
+                property: "y"
+                easing.type: "OutQuad"
+                duration: 250
+            }
+            NumberAnimation {
+                target: applicationArea
+                property: "y"
+                easing.type: "OutQuad"
+                duration: 250
+            }
+            NumberAnimation {
+                target: shortcutArea
+                property: "y"
+                easing.type: "OutQuad"
+                duration: 250
+            }
+        }
+    }
+
+
+
+
+
+    Item {
+        id: switchBtn
+        anchors.right: parent.right
+        anchors.rightMargin: 20
+        anchors.top: parent.top
+        anchors.topMargin: 5
+        width: 55
+        height: 55
+        z: 1
+
+        MouseArea {
+            anchors.fill: parent
+            property string btnState: 'normal'
+            Image {
+                id: image
+                anchors.fill: parent
+                source: './images/normal.png'
+            }
+            onClicked: {
+                if (btnState === 'normal') {
+                    image.source = './images/fullscreen.png'
+                    btnState = 'fullscreen'
+                    container.state = 'fullscreen'
+                    container.opacity = 0.0
+                    touchArea.switchArea(1)
+
+                } else {
+                    image.source = './images/normal.png'
+                    btnState = 'normal'
+                    container.state = 'normal'
+                    container.opacity = 1.0
+                    touchArea.switchArea(0)
+                }
             }
         }
     }