added Chinese translation and the adding score animation

2048-qt.pro

@@ -5,6 +5,11 @@ QT += qml quick widgets
 SOURCES += main.cpp \
     myclass.cpp
 
+lupdate_only {
+SOURCES += qml/main.qml \
+           qml/2048.js
+}
+
 RESOURCES += qml.qrc
 
 # Additional import path used to resolve QML modules in Qt Creator's code model
@@ -19,3 +24,5 @@ ICON = 2048.ico # On Mac OSX
 
 HEADERS += \
     myclass.h
+
+TRANSLATIONS = 2048-qt_zh_CN.ts

2048-qt_zh_CN.ts

@@ -0,0 +1,59 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE TS>
+<TS version="2.1" language="zh_CN">
+<context>
+    <name>main</name>
+    <message>
+        <source>2048 Game</source>
+        <translation>2048游戏</translation>
+    </message>
+    <message>
+        <source>File</source>
+        <translation>文件</translation>
+    </message>
+    <message>
+        <source>New Game</source>
+        <translation>新游戏</translation>
+    </message>
+    <message>
+        <source>Exit</source>
+        <translation>退出</translation>
+    </message>
+    <message>
+        <source>Help</source>
+        <translation>帮助</translation>
+    </message>
+    <message>
+        <source>About Qt</source>
+        <translation>关于Qt</translation>
+    </message>
+    <message>
+        <source>SCORE</source>
+        <translation>得分</translation>
+    </message>
+    <message>
+        <source>BEST</source>
+        <translation>最高分</translation>
+    </message>
+    <message>
+        <source>Join the numbers and get to the &lt;b&gt;2048 tile&lt;/b&gt;!</source>
+        <translation>把数字相加，得到&lt;b&gt;2048&lt;/b&gt;！</translation>
+    </message>
+    <message>
+        <source>Game Over</source>
+        <translation>游戏结束</translation>
+    </message>
+    <message>
+        <source>Game Over!</source>
+        <translation>游戏结束！</translation>
+    </message>
+    <message>
+        <source>You Win</source>
+        <translation>你赢了</translation>
+    </message>
+    <message>
+        <source>You win! Continue playing?</source>
+        <translation>你赢了！要继续玩吗？</translation>
+    </message>
+</context>
+</TS>

main.cpp

@@ -1,20 +1,28 @@
 #include <QApplication>
 #include <QQmlApplicationEngine>
+#include <QQmlContext>
+#include <QTranslator>
+#include <QDebug>
 #include "myclass.h"
-//#include <QDebug>
 
 int main(int argc, char *argv[])
 {
     QApplication app(argc, argv);
 
+    // Localization
+    QString locale = QLocale::system().name();
+    qDebug() << "Locale: " + locale;
+
+    QTranslator translator;
+    translator.load("2048-qt_" + locale);
+    app.installTranslator(&translator);
+
     QQmlApplicationEngine engine;
     engine.load(QUrl(QStringLiteral("qrc:///qml/main.qml")));
 
     MyClass myClass;
-
+    // Access C++ object "myClass" from QML as "myClass"
-//    qDebug() << engine.rootObjects().length();
+    engine.rootContext()->setContextProperty("myClass", &myClass);
-    QObject *mainWindow = engine.rootObjects()[0];
-    QObject::connect(mainWindow, SIGNAL(helpMenuTriggered()), &myClass, SLOT(aboutQt()));
 
     return app.exec();
 }

qml/2048.js

@@ -49,7 +49,8 @@ function startupFunction() {
 
     updateAvailableCells();
     createNewTileItems(true);
-    updateScore();
+    updateScore(0);
+    addScoreText.parent = scoreBoard.itemAt(0);
     console.log("Started a new game");
 }
 
@@ -139,7 +140,7 @@ function moveKey(event) {
             if (bestScore < score) {
                 bestScore = score;
             }
-            updateScore();
+            updateScore(oldScore);
             if (checkTargetFlag && maxTileValue() >= targetLevel) {
                 winMessage.open();
             }
@@ -256,7 +257,12 @@ function createNewTileItems(isStartup) {
     }
 }
 
-function updateScore() {
+function updateScore(oldScore) {
+    if (score > oldScore) {
+        addScoreText.text = "+" + (score-oldScore).toString();
+        addScoreAnim.running = true;
+    }
+
     scoreBoard.itemAt(0).scoreText = MyScript.score.toString();
     scoreBoard.itemAt(1).scoreText = MyScript.bestScore.toString();
 }
@@ -344,7 +350,7 @@ function createTileObject(ind, n, isStartup) {
         tile.runNewTileAnim = true;
     }
 
-    if (tile == null) {
+    if (tile === null) {
         // Error Handling
         console.log("Error creating a new tile");
     }
@@ -366,6 +372,7 @@ function moveMergeTilesLeftRight(i, v, v2, indices, left) {
                 // Move and merge
                 tileItems[gridSize*i+j].destroyFlag = true;
                 tileItems[gridSize*i+j].z = -1;
+                tileItems[gridSize*i+j].opacity = 0;
                 tileItems[gridSize*i+j].x = cells.itemAt(gridSize*i+indices[j]).x;
 //                tileItems[gridSize*i+j].destroy();
 
@@ -398,6 +405,7 @@ function moveMergeTilesUpDown(i, v, v2, indices, up) {
                 // Move and merge
                 tileItems[gridSize*j+i].destroyFlag = true;
                 tileItems[gridSize*j+i].z = -1;
+                tileItems[gridSize*j+i].opacity = 0;
                 tileItems[gridSize*j+i].y = cells.itemAt(gridSize*indices[j]+i).y;
 //                tileItems[gridSize*j+i].destroy();
 

qml/Tile.qml

@@ -55,7 +55,6 @@ Rectangle {
 
     Behavior on y {
         NumberAnimation {
-            easing.type: Easing.InQuad
             duration: moveAnimTime
             onRunningChanged: {
                 if ((!running) && destroyFlag) {
@@ -67,7 +66,6 @@ Rectangle {
 
     Behavior on x {
         NumberAnimation {
-            easing.type: Easing.InQuad
             duration: moveAnimTime
             onRunningChanged: {
                 if ((!running) && destroyFlag) {

qml/main.qml

@@ -16,8 +16,6 @@ ApplicationWindow {
     x: (Screen.width - width) / 2
     y: (Screen.height - height) / 2
 
-    signal helpMenuTriggered
-
     menuBar: MenuBar {
         Menu {
             title: qsTr("File")
@@ -36,8 +34,8 @@ ApplicationWindow {
             id: helpMenu
             title: qsTr("Help")
             MenuItem {
-                text: "About Qt"
+                text: qsTr("About Qt")
-                onTriggered: mainWindow.helpMenuTriggered()
+                onTriggered: myClass.aboutQt();
             }
         }
     }
@@ -85,7 +83,7 @@ ApplicationWindow {
                     color: helper.myColors.bgdark
                     property string scoreText: (index === 0) ? MyScript.score.toString() : MyScript.bestScore.toString()
                     Text {
-                        text: (index == 0) ? "SCORE" : "BEST"
+                        text: (index == 0) ? qsTr("SCORE") : qsTr("BEST")
                         anchors.horizontalCenter: parent.horizontalCenter
                         y: 7
                         font.pixelSize: 13
@@ -101,13 +99,48 @@ ApplicationWindow {
                     }
                 }
             }
+
+            Text {
+                id: addScoreText
+                font.pixelSize: 25
+                font.bold: true
+                color: Qt.rgba(119/255, 110/255, 101/255, 0.9);
+//                parent: scoreBoard.itemAt(0)
+                anchors.horizontalCenter: parent.horizontalCenter
+
+                property bool runAddScore: false
+                property real yfrom: 0
+                property real yto: -(parent.y + parent.height)
+                property int addScoreAnimTime: 600
+
+                ParallelAnimation {
+                    id: addScoreAnim
+                    running: false
+
+                    NumberAnimation {
+                        target: addScoreText
+                        property: "y"
+                        from: addScoreText.yfrom
+                        to: addScoreText.yto
+                        duration: addScoreText.addScoreAnimTime
+
+                    }
+                    NumberAnimation {
+                        target: addScoreText
+                        property: "opacity"
+                        from: 1
+                        to: 0
+                        duration: addScoreText.addScoreAnimTime
+                    }
+                }
+            }
         }
 
         Text {
             id: banner
             y: 90
             height: 40
-            text: "Join the numbers and get to the <b>2048 tile!</b>"
+            text: qsTr("Join the numbers and get to the <b>2048 tile</b>!")
             color: helper.myColors.fgdark
             font.pixelSize: 16
             verticalAlignment: Text.AlignVCenter
@@ -125,7 +158,7 @@ ApplicationWindow {
                     radius: 3
                     Text{
                         anchors.centerIn: parent
-                        text: "New Game"
+                        text: qsTr("New Game")
                         color: helper.myColors.fgbutton
                         font.pixelSize: 18
                         font.bold: true
@@ -162,8 +195,8 @@ ApplicationWindow {
 
         MessageDialog {
             id: deadMessage
-            title: "Game Over"
+            title: qsTr("Game Over")
-            text: "Game Over"
+            text: qsTr("Game Over!")
             standardButtons: StandardButton.Retry | StandardButton.Abort
             onAccepted: {
                 MyScript.startupFunction();
@@ -175,8 +208,8 @@ ApplicationWindow {
 
         MessageDialog {
             id: winMessage
-            title: "You Win"
+            title: qsTr("You Win")
-            text: "You win! Continue playing?"
+            text: qsTr("You win! Continue playing?")
             standardButtons: StandardButton.Yes | StandardButton.No
             onYes: {
                 MyScript.checkTargetFlag = false;