• 起源

介面可能是每一個90後對於電腦的第一印象，透過螢幕看到多姿多彩的世界，從一個小小的視窗去觸碰天空的邊界，穿過介面到達夢想的彼岸。每一個程式設計師進入計算機的世界的理由各不相同，有人嚮往黑客世界中快速飛過的程式碼，有人則嚮往開發絢爛多彩的介面程式。作為一個從Windows來接觸計算機的程式設計師，也有一顆做出一個功能強大、介面漂亮的程式的初心。

介面開發的程式有很多，作為一個C程式設計師，功能做強大的選擇有：VS的MFC和Qt；但是和Visual C++相比，Qt方便簡單、功能完善、跨平臺、擴充套件能力強，可以用於嵌入式開發。所以，在開發元件方面，我選擇的是Qt。

從今天起，重新學習Qt的程式設計開發，主要參考的書籍為《Qt5開發及例項》，堅持每一個階段都更新一篇部落格，部落格中會附上對於此階段的知識總結和例項程式碼，如果有興趣的同學可以共同學習、共同進步。

• Qt概述

Qt是一個跨平臺的C++圖形使用者介面應用程式框架。它為應用程式開發者提供建立藝術級圖形介面所需的所有功能。它是完全面向物件的，很容易擴充套件，並且允許真正的元件程式設計。

Qt的優勢：跨平臺，幾乎支援所有的平臺；介面簡單，容易上手，學習QT框架對學習其他框架有參考意義；一定程度上簡化了記憶體回收機制 ；開發效率高，能夠快速的構建應用程式；有很好的社群氛圍，市場份額在緩慢上升；可以進行嵌入式開發。

• Qt下載

• 開發環境簡介

安裝完畢之後，開啟 Qt Creater 可看到操作專案的一系列功能按鈕：

1、“歡迎”：即此時展示的介面，可以選擇自帶的演示例子，也可以建立新的工程或者開啟最近的一些專案；
2、“編輯”：在此處寫程式碼進行程式設計；
3、“設計”：這裡對ui介面進行設計、部件屬性、訊號和槽、佈局等的設定；
4、“Debug”：對程式進行除錯，觀察程式執行情況；
5、“專案”：對開發環境進行相關的配置；
6、“幫助”：可以在此處輸入關鍵字，檢索相關資訊。

• 配置Qt環境變數

可能有的小夥伴安裝好Qt後迫不及待的寫了一個“Hello world”來慶祝一下，猛然發現程式編譯不過，因為安裝之後要對系統的環境變數進行配置。

首先開啟系統環境變數，找到“path”；然後在“path”中新增Qt目錄下“bin”所在的目錄，我的是：

C:\Qt\Qt5.9.1\5.9\mingw53_32\bin;
C:\Qt\Qt5.9.1\Tools\mingw530_32\bin;

• 第一個Qt程式

實現的功能：輸入一個十進位制數，轉換並顯示對應的二進位制數。
1）建立新工程：模板選擇 Application 下的 Qt Widgets Application

QLabel：QT介面中的標籤類，是一個操作非常方便的控制元件，可以在標籤上插入文字、圖片等；
QLineEdit：文字輸入框類；
QPushButton：Qt中的普通按鈕類；
QGridLayout：網格佈局類，用於規劃介面中沒個控制元件的佈局的。

3）直接貼上程式碼，在程式碼中寫入註釋
first.h:

#include <QDialog>
#include <QLabel>
#include <QPushButton>
#include <QGridLayout>
#include <QLineEdit>

class first : public QDialog
{
    Q_OBJECT

public:
    first(QWidget *parent = 0);
    ~first();

private:
    QLabel *label1, *label2;
    QPushButton *button;
    QLineEdit *lineEdit;

private slots:
    void ShowHex();

};

first.cpp:

#include "first.h"

first::first(QWidget *parent)
    : QDialog(parent)
{
    this->resize(200, 200);// 設定介面大小

    label1 = new QLabel(this);
    label1->setText(tr("請輸入一個十進位制數："));// 第一個標籤，提示輸入一個十進位制數
    label2 = new QLabel(this);
    label2->setText(tr("十六進位制數為："));// 第二個標籤，用於顯示16進位制數

    button = new QPushButton(this);
    button->setText(tr("轉換"));// 轉換按鈕

    lineEdit = new QLineEdit(this);// 用於接收輸入的十進位制數

    // 設定佈局，使用addWidget函式，向佈局對應位置新增控制元件
    QGridLayout *mainLayout = new QGridLayout(this);
    mainLayout->addWidget(label1, 0, 0);
    mainLayout->addWidget(lineEdit, 0, 1);
    mainLayout->addWidget(label2, 1, 0);
    mainLayout->addWidget(button, 1, 1);

    // 點選按鈕傳送訊號，觸發槽函式
    connect(button, &QPushButton::clicked, this, &first::ShowHex);

}

first::~first()
{

}

// 槽函式
void first::ShowHex()
{
    bool ok;

    QString tmp;
    QString value = lineEdit->text();// 獲取輸入框的資料

    int valueHex = value.toInt(&ok, 10);// 將獲取的資料轉成int型別
    tmp.sprintf("十六進位制數為：%x", valueHex);// 將十進位制數轉成十六進位制數的QString型別
    label2->setText(tmp);// 第二個標籤顯示轉換完成的十六進位制數
}