Horloge localisée avec changement de langue à l'exécution

Consultez le manuel «Qt Linguist » pour plus d’informations sur la traduction des applications Qt.

Interface utilisateur

Cet exemple affiche l'heure et la date actuelles selon les paramètres régionaux et la langue de votre système. Les textes de l'interface utilisateur sont également localisés dans les langues suivantes : anglais, allemand, français, espagnol, italien, japonais, coréen, portugais, arabe et chinois. Les utilisateurs peuvent également utiliser un bouton de menu pour sélectionner différentes langues et différents paramètres régionaux.

La version anglaise de l'application :

La version allemande après avoir changé de langue à l'exécution :

Mise en œuvre

L'application comporte quatre parties :

• CMakeLists.txt
• main.cpp
• Gestionnaire de traduction (translator.h, translator.cpp)
• Main.qml

CMakeLists.txt

L'intégration CMake est identique à celle de l'exemple « Horloge localisée ». Veuillez vous reporter à cette page pour plus de détails.

main.cpp

Point de départ de l'application, chargé de charger le module QML.

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine;
    QObject::connect(
            &engine, &QQmlApplicationEngine::objectCreationFailed, &app,
            [](const QUrl &) { QCoreApplication::exit(-1); }, Qt::QueuedConnection);
    engine.loadFromModule("qtexamples.localizedclockswitchlocale", "Main");
    return app.exec();
}

Gestionnaire de traduction (translator.h, translator.cpp)

TranslatorManager est une classe singleton QML qui gère le changement de langue et de paramètres régionaux lors de l'exécution. La méthode principale de cette classe est ` TranslatorManager::switchLanguage()`, qui accepte une chaîne de caractères représentant un code de langue.

Bien que la méthode soit marquée avec ` Q_INVOKABLE`, la classe `TranslatorManager` est déclarée avec ` QML_ELEMENT ` et `QML_SINGLETON`. Cela permet d'accéder directement à la méthode depuis QML ; voir également `Main.qml`.

void TranslatorManager::switchLanguage(const QString&lang)
{
    QLocale locale(lang);
    QLocale::setDefault(locale);
    qApp->removeTranslator(&m_translator); // not necessary from Qt 6.10
   if (m_translator.load(locale, "clock"_L1, "_"_L1, ":/i18n/"_L1)
       && qApp->installTranslator(&m_translator)) {
        m_engine.retranslate();
    } else {
        qWarning("Could not load translation to %s!", qPrintable(locale.name()));
    }
}

Mise à jour des traductions à l'exécution

Lors du changement de langue, la traduction précédente est supprimée (QCoreApplication::removeTranslator()) et une nouvelle traduction pour la langue sélectionnée est chargée (QTranslator::load()) puis installée (QCoreApplication::installTranslator()). La fonction QQmlEngine::retranslate() déclenche alors la retraduction des chaînes du document QML.

Mise à jour des formats de date et d’heure

Le changement de langue peut également avoir une incidence sur l'affichage des dates et des heures. Par exemple, si QLocale sur votre système privilégie la locale « en_US » pour « en » et « de_DE » pour « de » :

• L'application est initialement chargée avec « US » comme code de pays.
• Conformément aux conventions de la locale US, la date s'affiche au format MM/JJ/AAAA et l'heure utilise le format 12 heures.
• Après avoir changé la langue en allemand, « de_DE » étant la première locale préférée pour la langue allemande, le pays passe à l'Allemagne.
• Les conventions allemandes imposent le format de date JJ.MM.AAAA et utilisent un format d'heure sur 24 heures.

Lors du changement de langue, l’application met à jour ses paramètres de localisation ( QLocale ) en fonction de la langue sélectionnée à l’aide de la fonction QLocale::setDefault(). Lors de l’affichage de l’heure, la fonction Date.toLocaleTimeString() se charge d de l’heure et de la date en fonction de la locale de l’application (voir Main.qml).

Main.qml

Le fichier QML principal définit l'interface utilisateur de l'application. L'interface affiche l'heure, la date et un compteur de secondes. Pour la traduction de base (titre de la fenêtre) et la gestion du pluriel (nombre de secondes), veuillez vous reporter à l'exemple « Horloge localisée ».

Lorsqu’un élément est sélectionné dans l’ Menu, la méthode ` TranslatorManager.switchLanguage() ` est appelée avec le code de langue correspondant. Cet appel se charge également de retraduire les textes traduisibles (voir « Translator Manager »). Cependant, il faut encore appeler la méthode ` updateClock() ` pour mettre à jour la représentation de l’heure dans le nouveau format de localisation lorsque la langue est modifiée.

        ListModel {
            id: languageModel
            ListElement { name: "English"; code: "en" }
            ListElement { name: "Deutsch"; code: "de" }
            ListElement { name: "العربية"; code: "ar" }
            ListElement { name: "한국어"; code: "ko" }
            ListElement { name: "中文"; code: "zh" }
            ListElement { name: "日本語"; code: "ja" }
            ListElement { name: "Français"; code: "fr" }
            ListElement { name: "Italiano"; code: "it" }
            ListElement { name: "Español"; code: "es" }
            ListElement { name: "Português"; code: "pt" }
        }
        Menu {
            id: languageMenu
            width: languageButton.width
            Repeater {
                model: languageModel
                delegate: MenuItem {
                    required property string name
                    required property string code
                    text: name
                    onTriggered: {
                        TranslatorManager.switchLanguage(code)
                        root.selectedLanguage = name
                        root.updateClock()
                    }
                }
            }
        }

Exemple de projet sur code.qt.io