Qt 编写应用支持多语言版本–一个GUI应用示例

实时热门 publisher01 26℃

简介

上一篇博文已经说过如何编写支持多语言的Qt 命令行应用,这一篇说说Qt GUI 应用多语言支持的坑。

本人喜欢用代码来写布局,而不是用 Qt Designer 来设计布局,手写布局比 Qt Desiner 布局有以下优点:

  1. 手工布局,所想即所见,
  2. 源代码方式修改布局非常方便,只需要拷贝代码、注释代码就行,如果用 Qt Designer 修改原有布局,简直要人老命,拖放一下 widget 就会打乱了原有的 layout;

本文示例程序是一个GUI应用,手写布局,在工具栏中添加两个 QAction,可以切换中文、英文界面,主界面一个标签显示文本,一个按钮用来退出应用。

英文界面如下:

中文界面如下:

开发环境及步骤

VS 版本: vs2017 社区版
Qt 版本: 5.11.1
Qt VS tools: 2.3.2

第一步 新建 HelloQt 工程

默认的会创建 UI 文件,直接编译工程,复制编译产生的 ui_HelloQt.h 文件,重命名为 myUI_HelloQt.h 以这个文件为模板,手工布局。

第二步 在 setupUI() 中实现布局

使用MVC编程模型,只在 myUI_HelloQt.h 文件中实现GUI,这里虽然新建了两个 QAction 和一个 QPushButton ,但是没有连接信号和槽函数。

布局完成调试看看是否布局合理。

第三步 翻译并添加到资源

  1. 新建翻译文件 helloqt_zh.ts
  2. 用工具 lupdate 提取字符串,并语言家来翻译;
  3. 用工具 lrelease 发布 QM 文件,即 helloqt_zh.qm 文件;
  4. 在资源文件 HelloQt.qrc 中添加 QM 文件,并把资源重命名为 :/translations/helloqt_zh
    如图所示:

    上面的步骤只是准备了翻译字符串,实际上应用程序并不能切换语言,还需要执行下面的步骤:
  5. 新建一个成员变量 QTranslator *language_zh;,并在主窗口的构造方法中加载对应的QM文件, language_zh->load(":/translations/helloqt_zh");
  6. 加载了 QM 文件还不能切换多语言,需要安装才行。到底何时安装呢?这时候想起了前面的两个 QAction,只有点击了对应的工具条才切换对应的语言,在主窗口的构造方法中连接信号和槽函数:

            // signals and slots
        QObject::connect(ui.act_language_zh, SIGNAL(triggered(bool)), this, SLOT(on_trigger_language_zh(bool)));
            QObject::connect(ui.act_language_en, SIGNAL(triggered(bool)), this, SLOT(on_trigger_language_en(bool)));
            QObject::connect(ui.btn_quit, SIGNAL(clicked(bool)), this, SLOT(on_btn_quit_clicked(bool)));
  7. 分别实现 action 对应的槽函数,加载中文时安装 QTranslation,加载英文时卸载,如下面的代码所示:

    void HelloQt::on_trigger_language_zh(bool checked)
    {
        qDebug() << tr("Chinese") << endl;
        qApp->installTranslator(language_zh);
    }
    void HelloQt::on_trigger_language_en(bool checked)
    {
        qDebug() << tr("English") << endl;
        qApp->removeTranslator(language_zh);
    }
  8. 执行完上一步你就急着编译查看结果,点击两个工具栏你却发现并不能切换语言,为什么呢?因为切换语言的事件还没有处理呢。覆盖 changeEvent() 即可:

    void HelloQt::changeEvent(QEvent *event)
    {
        if (event->type() == QEvent::LanguageChange) {
            ui.retranslateUi(this);
            } else {
            QMainWindow::changeEvent(event);
        }
    }

至此两个工具栏终于可以正常地切换语言显示了。

深入一点

你可以看到工程中至少出现了3次 retranslateUi() 函数,一次是定义,两次是调用,第一次调用是在UI 初始化中,第二次调用是 changeEvent() 中切换语言,它所做的工作就是把UI widgets 上显示的字符串替换为特定语言的字符串。例如给主窗口设定窗口标题 HelloQtClass->setWindowTitle(QApplication::translate("HelloQtClass", "HelloQt", nullptr)); 最关键的是里面的 [static] QString QCoreApplication::translate(const char *context, const char *sourceText, const char *disambiguation = nullptr, int n = -1),这个函数才是负责翻译语言的。

第一个参数 context 理解为上下文,什么是上下文,Qt 助手说它就是一个类名。不同的字符串会分配到不同的上下文。分配规则是 tr() 是用哪个类名来限定的,如下面的代码,分别调用 QObject::tr("install Chinese")HelloQt::tr("install English") 那么就有两个上下文,分别是 QObjectHelloQt,这一点也可以从语言家看到。

void HelloQt::on_trigger_language_zh(bool checked)
{
    qDebug() << QObject::tr("install Chinese") << endl;
    qApp->installTranslator(language_zh);
}
void HelloQt::on_trigger_language_en(bool checked)
{
    qDebug() << HelloQt::tr("install English") << endl;
    qApp->removeTranslator(language_zh);
}

语言家界面的显示:

第二个参数 sourceText 就是源代码中以 tr() 括起来的字符串。

后面的两个参数暂时没有用到,忽略。

一张图说明上下文,源字符串二者的关系,如果代码中某个字符串被删除了但是 TS 文件中还存在,而且今后不需要这个翻译,就可以用记事本打开 TS 文件,直接删除以 vanished 标记的翻译:

回到 retranslateUi() 函数,这是一个自定义的函数,用户在这里翻译GUI界面,如果发现GUI上某个 widget 语言没有变化,就需要在这里翻译,如下面的代码翻译标签和按钮的文本,以及两个工具栏的文本:

```C++
    // add your own translate here.
    act_language_zh->setText(QApplication::translate("QObject", "Chinese", nullptr));
    act_language_en->setText(QApplication::translate("QObject", "English", nullptr));
    lbl_hello->setText(QApplication::translate("QObject", "<h2><i>Hello</i><font color=red>Qt!</font></h2>", nullptr));
    btn_quit->setText(QApplication::translate("QObject", "&Quit", nullptr));
```

上面的代码中标签文本是一个 HTML 代码,这个也可以翻译的, HTML 样式保留,只需要替换里面的 HelloQt! 即可。

源代码

只列出关键的源代码,首先是布局文件 myUI_HelloQt.h

#pragma once
#ifndef MYUI_HELLOQT_H
#define MYUI_HELLOQT_H
#include <QtCore/QVariant>
#include <QtWidgets/QApplication>
#include <QtWidgets/QMainWindow>
#include <QtWidgets/QMenuBar>
#include <QtWidgets/QStatusBar>
#include <QtWidgets/QToolBar>
#include <QtWidgets/QWidget>
#include <QtWidgets/QMenu>
#include <QtWidgets/QAction>
#include <QtWidgets/QLabel>
#include <QtWidgets/QPushButton>
#include <QtWidgets/QVBoxLayout>
QT_BEGIN_NAMESPACE
class Ui_HelloQtClass
{
public:
    QMenuBar *menuBar;
    QToolBar *mainToolBar;
    QWidget *centralWidget;
    QStatusBar *statusBar;
    QAction *act_language_zh;
    QAction *act_language_en;
    QLabel *lbl_hello;
    QPushButton *btn_quit;
    void setupUi(QMainWindow *HelloQtClass)
    {
        if (HelloQtClass->objectName().isEmpty())
            HelloQtClass->setObjectName(QStringLiteral("HelloQtClass"));
        //HelloQtClass->resize(600, 400);
        HelloQtClass->setFixedSize(400, 160);
        menuBar = new QMenuBar(HelloQtClass);
        menuBar->setObjectName(QStringLiteral("menuBar"));
        HelloQtClass->setMenuBar(menuBar);
        mainToolBar = new QToolBar(HelloQtClass);
        mainToolBar->setObjectName(QStringLiteral("mainToolBar"));
        HelloQtClass->addToolBar(mainToolBar);
        centralWidget = new QWidget(HelloQtClass);
        centralWidget->setObjectName(QStringLiteral("centralWidget"));
        // add actions here.
        act_language_zh = new QAction(QObject::tr("Chinese"), HelloQtClass);
        act_language_en = new QAction(QObject::tr("English"), HelloQtClass);
        mainToolBar->addAction(act_language_zh);
        mainToolBar->addAction(act_language_en);
        // add your widgets here.
        lbl_hello = new QLabel(HelloQtClass);
        lbl_hello->setText(QObject::tr("<h2><i>Hello</i><font color=red>Qt!</font></h2>"));
        lbl_hello->setAlignment(Qt::AlignHCenter);
        
        btn_quit = new QPushButton(QObject::tr("&Quit"), HelloQtClass);
                
        QVBoxLayout *vLayout = new QVBoxLayout;
        vLayout->addWidget(lbl_hello);
        vLayout->addWidget(btn_quit);
        centralWidget->setLayout(vLayout);
        HelloQtClass->setCentralWidget(centralWidget);
        statusBar = new QStatusBar(HelloQtClass);
        statusBar->setObjectName(QStringLiteral("statusBar"));
        HelloQtClass->setStatusBar(statusBar);
        retranslateUi(HelloQtClass);
        QMetaObject::connectSlotsByName(HelloQtClass);
    } // setupUi
    void retranslateUi(QMainWindow *HelloQtClass)
    {
        // NOTE: the first parameter `context` in translate() must match the `context` in Qt Linguist.
        // [static] QString QCoreApplication::translate(const char *context, const char *sourceText, const char *disambiguation = nullptr, int n = -1)
        HelloQtClass->setWindowTitle(QApplication::translate("HelloQtClass", "HelloQt", nullptr));
        // add your own translate here.
        act_language_zh->setText(QApplication::translate("QObject", "Chinese", nullptr));
        act_language_en->setText(QApplication::translate("QObject", "English", nullptr));
        lbl_hello->setText(QApplication::translate("QObject", "<h2><i>Hello</i><font color=red>Qt!</font></h2>", nullptr));
        btn_quit->setText(QApplication::translate("QObject", "&Quit", nullptr));
    } // retranslateUi
};
namespace Ui {
    class HelloQtClass : public Ui_HelloQtClass {};
} // namespace Ui
QT_END_NAMESPACE
#endif // MYUI_HELLOQT_H

然后是 HelloQt.h

#pragma once
#include <QtWidgets/QMainWindow>
#include <QTranslator>
#include "myUI_HelloQt.h"
class HelloQt : public QMainWindow
{
    Q_OBJECT
public:
    HelloQt(QWidget *parent = Q_NULLPTR);
public slots:
    void on_trigger_language_zh(bool checked);
    void on_trigger_language_en(bool checked);
protected slots:
    void on_btn_quit_clicked(bool clicked);
    
protected:
    void changeEvent(QEvent *event) override;
private:
    Ui::HelloQtClass ui;
    QTranslator *language_zh;
};

然后是 HelloQt.c

#include <QDebug>
#include "HelloQt.h"
HelloQt::HelloQt(QWidget *parent)
    : QMainWindow(parent)
{
    ui.setupUi(this);
    
    // load translation
    language_zh = new QTranslator(this);
    language_zh->load(":/translations/helloqt_zh");
    // signals and slots
    QObject::connect(ui.act_language_zh, SIGNAL(triggered(bool)), this, SLOT(on_trigger_language_zh(bool)));
    QObject::connect(ui.act_language_en, SIGNAL(triggered(bool)), this, SLOT(on_trigger_language_en(bool)));
    QObject::connect(ui.btn_quit, SIGNAL(clicked(bool)), this, SLOT(on_btn_quit_clicked(bool)));
}
void HelloQt::on_trigger_language_zh(bool checked)
{
    qDebug() << QObject::tr("install Chinese") << endl;
    qApp->installTranslator(language_zh);
}
void HelloQt::on_trigger_language_en(bool checked)
{
    qDebug() << HelloQt::tr("install English") << endl;
    qApp->removeTranslator(language_zh);
}
void HelloQt::on_btn_quit_clicked(bool clicked)
{
    qApp->quit();
}
//************************************
// Method:    changeEvent
// FullName:  HelloQt::changeEvent
// Access:    protected 
// Returns:   void
// Qualifier:
// Parameter: QEvent * event
// Description: change language.
//************************************
void HelloQt::changeEvent(QEvent *event)
{
    if (event->type() == QEvent::LanguageChange) {
        ui.retranslateUi(this);
    } else {
        QMainWindow::changeEvent(event);
    }
}

然后是翻译文件 helloqt_zh.ts

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE TS>
<TS version="2.1" language="zh_CN">
<context>
    <name>HelloQt</name>
    <message>
        <location filename="HelloQt.cpp" line="27"/>
        <source>install English</source>
        <oldsource>English</oldsource>
        <translation>安装英文</translation>
    </message>
</context>
<context>
    <name>HelloQtClass</name>
    <message>
        <location filename="myUI_HelloQt.h" line="80"/>
        <source>HelloQt</source>
        <translation>你好Qt</translation>
    </message>
</context>
<context>
    <name>QObject</name>
    <message>
        <location filename="myUI_HelloQt.h" line="49"/>
        <location filename="myUI_HelloQt.h" line="83"/>
        <source>Chinese</source>
        <translation>中文</translation>
    </message>
    <message>
        <location filename="myUI_HelloQt.h" line="50"/>
        <location filename="myUI_HelloQt.h" line="84"/>
        <source>English</source>
        <translation>英文</translation>
    </message>
    <message>
        <location filename="myUI_HelloQt.h" line="56"/>
        <location filename="myUI_HelloQt.h" line="85"/>
        <source>&lt;h2&gt;&lt;i&gt;Hello&lt;/i&gt;&lt;font color=red&gt;Qt!&lt;/font&gt;&lt;/h2&gt;</source>
        <translation>&lt;h2&gt;&lt;i&gt;你好&lt;/i&gt;&lt;font color=red&gt;Qt!&lt;/font&gt;&lt;/h2&gt;</translation>
    </message>
    <message>
        <location filename="myUI_HelloQt.h" line="59"/>
        <location filename="myUI_HelloQt.h" line="86"/>
        <source>&amp;Quit</source>
        <translation>&amp;退出</translation>
    </message>
    <message>
        <location filename="HelloQt.cpp" line="21"/>
        <source>install Chinese</source>
        <translation>安装中文</translation>
    </message>
</context>
</TS>

然后是资源文件 HelloQt.qrc

<RCC>
    <qresource prefix="/translations">
        <file alias="helloqt_zh">helloqt_zh.qm</file>
    </qresource>
</RCC>

声明

欢迎转载,请注明出处和作者,同时保留声明。
作者:LinTeX9527
出处:https://www.cnblogs.com/LinTeX9527/p/11015060.html
本博客的文章如无特殊说明,均为原创,转载请注明出处。如未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

转载请注明:Python量化投资 » Qt 编写应用支持多语言版本–一个GUI应用示例

喜欢 (0)or分享 (0)