[SOLVED] QML internationalization does not work

[guidupas]

Hello all!

I am having a problem with the translation of my app developed in QML

The translation file (.qm) is done but it does not work.

Can anyone help me?

Thanks in advance.

Code below:
@
#include <QGuiApplication>
#include <QQmlApplicationEngine>

#include <QTranslator>

int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);

QTranslator tradutor;

tradutor.load("qml_en", "./");
app.installTranslator(&tradutor);

QQmlApplicationEngine engine;
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

return app.exec();

}
@

[SGaist]

Hi,

Where is you qml_en.qm file located ?

[guidupas]

Hello SGaist!

The location of the file is in root folder and inside the resources. QTranlator.load returns true.

I have done some tests and I realized that the translation works with mail.qml but does not work with the MainForm.ui.qml

Here are my files:

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
 
#include <QTranslator>
 
int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
 
    QTranslator tradutor;
 
    tradutor.load("qml_en", ":/");
    app.installTranslator(&tradutor);
 
    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
 
    return app.exec();
}

qml_en.ts

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE TS>
<TS version="2.0" language="en_US">
<context>
    <name>MainForm</name>
    <message>
        <location filename="MainForm.ui.qml" line="57"/>
        <source>Taxa de juros</source>
        <translation>Interest rate</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Diária</source>
        <translation>Daily</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Mensal</source>
        <translation>Monthly</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Bimestral</source>
        <translation>Bimonthly</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Trimestral</source>
        <translation>Quarterly</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Semestral</source>
        <translation>Semiannual</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="98"/>
        <source>Anual</source>
        <translation>Yearly</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="111"/>
        <source>Calcular</source>
        <translation>Calculate</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="130"/>
        <source>Conversões (%) </source>
        <translation>Conversions (%)</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="142"/>
        <source>Ao dia: </source>
        <translation>Per day:</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="169"/>
        <source>Ao mês: </source>
        <translation>Per month:</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="196"/>
        <source>Ao bimestre: </source>
        <translation>Per bimester:</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="223"/>
        <source>Ao trimestre: </source>
        <translation>Per quarter:</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="250"/>
        <source>Ao semestre: </source>
        <translation>Per semester:</translation>
    </message>
    <message>
        <location filename="MainForm.ui.qml" line="277"/>
        <source>Ao ano: </source>
        <translation>Per year:</translation>
    </message>
</context>
<context>
    <name>main</name>
    <message>
        <location filename="main.qml" line="100"/>
        <location filename="main.qml" line="113"/>
        <location filename="main.qml" line="126"/>
        <location filename="main.qml" line="138"/>
        <location filename="main.qml" line="151"/>
        <location filename="main.qml" line="164"/>
        <source>mais de 10 trilhões</source>
        <translation>Higher then 10 trillion</translation>
    </message>
</context>
</TS>

main.qml

import QtQuick 2.4
import QtQuick.Window 2.2
 
Window {
    visible: true
 
    //width: Screen.width
    //height: Screen.height
 
    //maximumHeight: Screen.height
    //minimumHeight: Screen.height
 
    //maximumWidth: Screen.width
    //minimumWidth: Screen.width
 
    width: 360
    height: 640
 
    maximumHeight: 640
    minimumHeight: 640
 
    maximumWidth: 360
    minimumWidth: 360
 
    title: "InterestC-Mobile"
 
    MainForm {
        anchors.fill: parent
 
        mainContainer.width: parent.width
        mainContainer.height: parent.height
 
        conversaoDiariaValorText.text: Number(0.0).toLocaleString(Qt.locale());
        conversaoMensalValorText.text: Number(0.0).toLocaleString(Qt.locale());
        conversaoBimestralValorText.text: Number(0.0).toLocaleString(Qt.locale());
        conversaoTrimestralValorText.text: Number(0.0).toLocaleString(Qt.locale());
        conversaoSemestralValorText.text: Number(0.0).toLocaleString(Qt.locale());
        conversaoAnualValorText.text: Number(0.0).toLocaleString(Qt.locale());
 
        calcularButton.onClicked:
        {
            calculaConversoes();
        }
    }
}

MainForm.ui.qml

import QtQuick 2.4
import QtQuick.Controls 1.2
 
Rectangle {
    id: mainContainer
 
    width: 360
    height: 640
 
    property alias mainContainer: mainContainer
 
    property alias taxaJurosSpinBox: taxaJurosSpinBox
    property alias periodoJurosComboBox: periodoJurosComboBox
 
    property alias calcularButton: calcularButton
 
    property alias conversaoDiariaValorText: conversaoDiariaValorText
    property alias conversaoMensalValorText: conversaoMensalValorText
    property alias conversaoBimestralValorText: conversaoBimestralValorText
    property alias conversaoTrimestralValorText: conversaoTrimestralValorText
    property alias conversaoSemestralValorText: conversaoSemestralValorText
    property alias conversaoAnualValorText: conversaoAnualValorText
 
    color: "#ffffff"
 
    Rectangle {
        id: tituloRectangle
 
        anchors.horizontalCenter: parent.horizontalCenter
        y: parent.y
 
        width: parent.width
        height: parent.height * 0.10
        gradient: Gradient {
            GradientStop {
                position: 0
                color: "#fe3001"
            }
 
            GradientStop {
                position: 1
                color: "#fe8548"
            }
        }
        Image {
            antialiasing: false
            source: "Imagens/InterestC-Mobile-Text.png"
 
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
        }
    }
 
    Label {
        id: taxaJurosLabel
 
        anchors.horizontalCenter: parent.horizontalCenter
        y: parent.y + tituloRectangle.height * 1.3
 
        text: qsTr("Taxa de juros") + " (%)"
        font.pointSize: 18
    }
 
    Rectangle {
        id: taxaJurosInputRectangle
 
        width: parent.width * 0.85
        height: parent.height * 0.10
 
        anchors.horizontalCenter: parent.horizontalCenter
        y: parent.y + tituloRectangle.height * 1.7
 
        SpinBox {
            id: taxaJurosSpinBox
 
            anchors.verticalCenter: parent.verticalCenter
            anchors.left: parent.left
 
            width: parent.width * 0.47
            height: parent.height * 0.6
 
            font.pointSize: 16
 
            horizontalAlignment: Text.AlignHCenter
 
            decimals: 2
 
            minimumValue: 0
            maximumValue: 100
        }
 
        ComboBox {
            id: periodoJurosComboBox
 
            width: parent.width * 0.47
            height: parent.height * 0.6
 
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
 
            model: [qsTr("Diária"), qsTr("Mensal"), qsTr("Bimestral"), qsTr("Trimestral"), qsTr("Semestral"), qsTr("Anual")]
        }
    }
 
    Button {
        id: calcularButton
 
        anchors.horizontalCenter: parent.horizontalCenter
        y: 1.03 * (taxaJurosInputRectangle.y + taxaJurosInputRectangle.height)
 
        width: parent.width * 0.85
        height: taxaJurosInputRectangle.height * 0.6
 
        text: qsTr("Calcular")
    }
    Rectangle {
        id: conversoesRectangle
 
        width: parent.width * 0.9
        height: parent.height * 0.61
 
        anchors.horizontalCenter: parent.horizontalCenter
        y: 1.05 * (calcularButton.y + calcularButton.height)
 
        //property variant espacamentoConversoes: 1.03
 
        Text {
            id: conversaoTituloText
 
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.top: parent.top
 
            text: qsTr("Conversões (%) ")
 
            font.bold: true
            font.pixelSize: 25
        }
 
        Text {
            id: conversaoDiariaText
 
            anchors.left: parent.left
            y: parent.height / 7
 
            text: qsTr("Ao dia: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoDiariaValorText
 
            anchors.right: parent.right
            y: conversaoDiariaText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
 
        Text {
            id: conversaoMensalText
 
            anchors.left: parent.left
            y: parent.height / 7 * 2
 
            text: qsTr("Ao mês: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoMensalValorText
 
            anchors.right: parent.right
            y: conversaoMensalText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
 
        Text {
            id: conversaoBimestralText
 
            anchors.left: parent.left
            y: parent.height / 7 * 3
 
            text: qsTr("Ao bimestre: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoBimestralValorText
 
            anchors.right: parent.right
            y: conversaoBimestralText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
 
        Text {
            id: conversaoTrimestralText
 
            anchors.left: parent.left
            y: parent.height / 7 * 4
 
            text: qsTr("Ao trimestre: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoTrimestralValorText
 
            anchors.right: parent.right
            y: conversaoTrimestralText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
 
        Text {
            id: conversaoSemestralText
 
            anchors.left: parent.left
            y: parent.height / 7 * 5
 
            text: qsTr("Ao semestre: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoSemestralValorText
 
            anchors.right: parent.right
            y: conversaoSemestralText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
 
        Text {
            id: conversaoAnualText
 
            anchors.left: parent.left
            y: parent.height / 7 * 6
 
            text: qsTr("Ao ano: ")
 
            font.bold: true
            font.pixelSize: 20
        }
 
        Text {
            id: conversaoAnualValorText
 
            anchors.right: parent.right
            y: conversaoAnualText.y
 
            font.bold: true
            font.pixelSize: 20
 
            width: parent.width * 0.2
            height: parent.height * 0.1
 
            horizontalAlignment: Text.AlignRight
        }
    }
}

[edit: Corrected coding tags, it's ``` SGaist]

[SGaist]

Can you also share the pro file ?

[guidupas]

@SGaist

Here is the .pro file

TEMPLATE = app

QT += qml quick

SOURCES += main.cpp

RESOURCES += qml.qrc

TRANSLATIONS = qml_en.ts

lupdate_only{
SOURCES += main.qml \
          MainForm.ui.qml
}

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Default rules for deployment.
include(deployment.pri)

[guidupas]

@SGaist

What is happening is that it do not translate when it loads the app, but after that the translation works.

[SGaist]

What do you mean by "after that the translation works" ?

[guidupas]

@SGaist

Hello SGaist

It seems to be an issue with Qt 5.4.1. I have updated my version to Qt 5.4.2 and run again lupdate and lrelease and it worked.

[SGaist]

Good ! :)

Happy coding !