This is a application for display turn by run navigation information.halibut_8.0.0halibut_7.99.3halibut_7.99.2halibut_7.99.1halibut/8.0.0halibut/7.99.3halibut/7.99.2halibut/7.99.18.0.07.99.37.99.27.99.1

Change-Id: I0866a7d9ffa347c0935b4d00259ad1a74cd00d6e
Signed-off-by: wanglu <wang_lu@dl.cn.nexty-ele.com>

1 files changed, 187 insertions, 0 deletions

diff --git a/app/qml/TbtBoard.qml b/app/qml/TbtBoard.qml
new file mode 100644
index 0000000..cf6f537
--- /dev/null
+++ b/app/qml/TbtBoard.qml
@@ -0,0 +1,187 @@
+import QtQuick 2.0
+
+//turn by turn board view
+Item {
+    id: tbt_board
+
+    property bool showboard: false
+
+    // the backgroud image(the small one)
+    Image {
+        id: whitebackgroud
+        visible: !showboard
+        anchors.top: parent.top
+        width:turnDirection.width
+        height:turnDirection.height + distance.height
+        source: "qrc:simple-background-white.png"
+        z: 1
+    }
+
+    // turn direction arrow board image(the small one)
+    Image {
+        id: turnDirection
+        visible: !showboard
+        anchors.top: parent.top
+        z: 3
+    }
+
+    // the distance to the next crossing road(textview)(the small one)
+    Text {
+        id: distance
+        visible: !showboard
+        anchors.top: turnDirection.bottom
+        z: 3
+        font.pixelSize: 23
+        width:turnDirection.width
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        font.family: "Lato"
+        font.weight: Font.Light
+        color: "#000000"
+    }
+
+    // the backgroud image
+    Image {
+        id: backgroudBoard
+        visible: showboard
+        anchors.fill: parent
+        source: "qrc:simple-bottom-background-black.png"
+        z: 1
+    }
+
+    // turn direction arrow board image
+    Image {
+        id: turnDirectionBoard
+        visible: showboard
+        width : parent.height - turnInstructionsBoard.height - distanceBoard.height
+        height: parent.height - turnInstructionsBoard.height - distanceBoard.height
+        anchors.centerIn: parent
+        z: 3
+    }
+
+    // the distance to the next crossing road(textview)
+    Text {
+        id: distanceBoard
+        visible: showboard
+        anchors.bottom: turnInstructionsBoard.top
+        z: 3
+        font.pixelSize: 45
+        width:tbt_board.width
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        font.family: "Lato"
+        font.weight: Font.Light
+        color: "#FFFFFF"
+    }
+
+    // the description of the next crossing road(textview)
+    Text {
+        id: turnInstructionsBoard
+        visible: showboard
+        anchors.bottom: parent.bottom
+        z: 3
+        font.pixelSize: 30
+        width:tbt_board.width
+        wrapMode: Text.Wrap
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        font.family: "Lato"
+        font.weight: Font.Light
+        color: "#FFFFFF"
+    }
+
+    // the cases of direction arrow board
+    states: [
+        State {
+            name: "arriveDest" //arrive the destination
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:destination_full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:destination.png" }
+        },
+        State {
+            name: "0" // NoDirection
+            PropertyChanges { target: turnDirectionBoard; source: "" }
+            PropertyChanges { target: turnDirection; source: "" }
+        },
+        State {
+            name: "1" // DirectionForward
+            PropertyChanges { target: turnDirectionBoard; source: "" }
+            PropertyChanges { target: turnDirection; source: "" }
+        },
+        State {
+            name: "2" // DirectionBearRight
+            PropertyChanges { target: turnDirectionBoard; source: "" }
+            PropertyChanges { target: turnDirection; source: "" }
+        },
+        State {
+            name: "3" // DirectionLightRight
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-r-30-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-r-30-large.png" }
+        },
+        State {
+            name: "4" // DirectionRight
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-r-45-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-r-45-large.png" }
+        },
+        State {
+            name: "5" // DirectionHardRight
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-r-75-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-r-75-large.png" }
+        },
+        State {
+            name: "6" // DirectionUTurnRight
+            //TODO modify qtlocation U-Turn best.For test, change app source.
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-l-180-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-l-180-large.png" }
+        },
+        State {
+            name: "7" // DirectionUTurnLeft
+            //TODO modify qtlocation U-Turn best.For test, change app source.
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-r-180-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-r-180-large.png" }
+        },
+        State {
+            name: "8" // DirectionHardLeft
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-l-75-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-l-75-large.png" }
+        },
+        State {
+            name: "9" // DirectionLeft
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-l-45-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-l-45-large.png" }
+        },
+        State {
+            name: "10" // DirectionLightLeft
+            PropertyChanges { target: turnDirectionBoard; source: "qrc:arrow-l-30-full.png" }
+            PropertyChanges { target: turnDirection; source: "qrc:arrow-l-30-large.png" }
+        },
+        State {
+            name: "11" // DirectionBearLeft
+            PropertyChanges { target: turnDirectionBoard; source: "" }
+            PropertyChanges { target: turnDirection; source: "" }
+        }
+    ]
+
+    // Set distance
+    function do_setDistance(dis) {
+        if(dis > 1000)
+        {
+           distanceBoard.text = (dis / 1000).toFixed(1) + " km"
+        }
+        else
+        {
+           distanceBoard.text = dis + " m"
+        }
+
+        distance.text = (((dis/100).toFixed(0))*100) +"m"
+    }
+
+    //set turnInstructions
+    function do_setTurnInstructions(turnInstructions) {
+        turnInstructionsBoard.text = turnInstructions
+    }
+
+    //show the tbt board(the big one)
+    function do_showTbtboard(mvisible) {
+       showboard = mvisible
+    }
+}