Qt實例1 - 查找框(2)實現功能

上一節我們完成了搜索框基本的界面，但是光有外表是沒用的，華而不實最終將會遭人唾棄。那我們還差哪些功能？

1.搜索按鈕可以做成填了內容才啟用，這樣用戶體驗會好一點。

2.用tr實現國際化，我們用中文作為例子。

3.真正地實現文本查找。

針對上面的需求我們相應地給出解決方案：

1.1 可以在初始化的時候先把搜索按鈕禁用，用setEnabled(false)來實現。

1.2 當用戶在搜索框輸入了內容的時候，搜索按鈕自動啟用，可以用信號槽connect一下實現（信號槽這里不贅述，此系列文章全都是講實用，就像李小龍說的：一位老師從來就不是真理的施舍者，而是帶領你讓你自己去領悟真理。）

在init方法里searchButton實例化之后加一行：

//剛開始先禁用搜索按鈕，等輸入了搜索內容才啟用
searchButton->setEnabled(false);
connect(searchLineEdit, SIGNAL(textChanged(const QString &)), this, SLOT(enableSearchButton(const QString &)));

在dialog.cpp定義開啟搜索按鈕的方法：

void FindDialog::enableSearchButton(const QString &text){
    searchButton->setEnabled(!text.isEmpty());//判斷是當文本不為空的時候啟用
}

此時我們點擊運行，搜索按鈕是灰色的，這代表他不可用，我們輸入內容，他變色了（額，別想歪了），好，功能1搞定。下面進入功能2：

 

2.1 打開dialog.pro下面加一行：TRANSLATIONS+=china.ts ，這個ts文件就是等下我們要去寫中文的。

2.2 打開qt的命令行工具（一般在開始菜單里面可找到），進入項目目錄，執行lupdate。下面是我本機的命令，請大家按照自己的環境改一下：

f:
cd Qt/dialog
lupdate dialog.pro

執行完之后他生成了一個china.ts, 並且會告訴你有多少個新詞是沒有翻譯過的。你可以用記事本打開這個ts文件看一下，哦，原來是xml。

可以看到會有這種語句：<translation type="unfinished"></translation>，乍一看，這應該就是要填寫中文的地方吧。我們先試試看行不行：

<source>&amp;Search</source>
<translation type="unfinished">搜索</translation>

保存，運行。沒用，那該怎么整？呵呵，Qt給我們提供了一個工具，Qt Linguist，聽說用他來打開ts文件再修改會簡單點呢!

我們在開始菜單找到這個工具運行，把剛才的ts文件直接拖進去。彈出一個窗口，自行調節一下選項，一般默認就好了。

 

打開之后我們的中文注釋亂碼了，先不管：

 

在左邊他會自動給你列出哪些是要翻譯的。

 

點一下，然后在下面寫入相應的翻譯。

完了點擊文件-發布。這時候我們再去dialog項目發現多了一個china.qm，我們用notepad打開china.qm文件看下，亂碼，點擊格式出來是ANSI碼，這個先不管。

 

做完了翻譯，我們還要在main.cpp里裝入qm文件才行：

#include <QtGui/QApplication>
#include <QTranslator>
#include "finddialog.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    //載入翻譯文件
    QTranslator t;
    t.load("china.qm");
    a.installTranslator(&t);

    FindDialog w;
    w.show();
    
    return a.exec();
}

這時我們點擊綠色播放按鈕看看，果然成功了呢!嘿嘿

不過，標題怎么翻譯呢？等等，我們好像還沒有指定標題呢。。。我們在FindDialog.cpp的構造函數里加入一行設置窗口的標題吧：

FindDialog::FindDialog(QWidget *parent)
    : QDialog(parent)//構造函數
{
    setWindowTitle(tr("Qt demo1-FindDialog"));
    init();//初始化
}

然后怎么做？想想應該到命令行lupdate一下咯，完了他告訴你有1個新詞，再回到Qt Linguist發現他沒有自動幫我們更新文件，我們關了重新打開，看到多了一個標題可以翻譯，翻譯之后發布。可以看到china.qm的修改時間變成剛剛了。我們點擊綠色播放按鈕看看，標題也是中文的了：

 我們回頭看看china.ts到底是變成啥樣了：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE TS>
<TS version="2.0" language="zh_CN">
<context>
    <name>FindDialog</name>
    <message>
        <location filename="finddialog.cpp" line="13"/>
        <source>Qt demo1-FindDialog</source>
        <translation type="unfinished">Qt實例1-查找框</translation>
    </message>
    <message>
        <location filename="finddialog.cpp" line="24"/>
        <source>&amp;Find what?</source>
        <translatorcomment>在這里輸入你要搜索的內容吧</translatorcomment>
        <translation type="unfinished">你要查什么?</translation>
    </message>
    <message>
        <location filename="finddialog.cpp" line="33"/>
        <source>&amp;Search</source>
        <translatorcomment>點擊搜索，我們將快速為你匹配符合的內容。</translatorcomment>
        <translation type="unfinished">搜索</translation>
    </message>
</context>
</TS>

 

notice:假如內容是變量的情況下。下面的代碼說明如何才能更好地實現國際化：

#include <QLabel>
#include <QApplication>

int main(int argc, char *argv[]){
    QApplication a(argc, argv);
    QString var1 = "111";
    QString var2 = "222";

    //如果遇到字符是變量，下面這樣將不能用於國際化
    //QLabel *myLabel = new QLabel("a is "+var1+" and b is "+var2);

    //要用%連起來然后再arg
    QLabel *myLabel = new QLabel(QObject::tr("a is %1 and b is %2").arg(var1).arg(var2));


    myLabel->show();
    return a.exec();
}

 

3.為了實現真正地實現文本查找，要先做個文本編輯器，然后把這個查找框放到工具欄里。那么這些內容交給下一節吧。

代碼下載地址：https://qt-example.googlecode.com/svn/trunk