QT学习笔记----day03

如果是初学者，有一点点基础，请先看前面两篇，链接如下：
day01

day02

四、实例四

实例完成最终的效果如下：

点击右边的图片按键，会出现对应的选项对话框，具体请看程序运行效果。

一样，我们先上代码：
main.cpp

#include "tablegui.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    TableGui w;
    w.show();

    return a.exec();
}

InputDialogGui.h

#ifndef INPUTDIALOGGUI_H
#define INPUTDIALOGGUI_H

#include <QDialog>
#include <QLabel>
#include <QPushButton>
#include <QGridLayout>
#include <QInputDialog> //标准输入框

class InputDialogGui : public QDialog
{
    Q_OBJECT

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

    QLabel *name_label;
    QLabel *sex_label;
    QLabel *age_label;
    QLabel *height_label;

public slots:
    void slotGetName();
    void slotGetSex();
    void slotGetAge();
    void slotGetHeight();
};

#endif // INPUTDIALOGGUI_H

InputDialogGui.cpp

#include "inputdialoggui.h"

InputDialogGui::InputDialogGui(QWidget *parent)
    : QDialog(parent)
{
    this->setWindowTitle("标准输入对话框示例");

    QLabel *label_1 = new QLabel("姓　名");
    QLabel *label_2 = new QLabel("性　别");
    QLabel *label_3 = new QLabel("年　龄");
    QLabel *label_4 = new QLabel("身　高");

    name_label = new QLabel;
    name_label->setAlignment(Qt::AlignCenter);  //设置对齐方式
    name_label->setFrameStyle(QFrame::Panel | QFrame::Sunken);  //设置标签的样式
//    name_label->setFixedWidth(150);   //设置组件的固定宽度
    sex_label = new QLabel;
    sex_label->setFrameStyle(QFrame::Panel | QFrame::Sunken);
    age_label = new QLabel;
    age_label->setFrameStyle(QFrame::Panel | QFrame::Sunken);
    height_label = new QLabel;
    height_label->setFrameStyle(QFrame::Panel | QFrame::Sunken);

    QPushButton *name_button = new QPushButton;
    name_button->setIcon(QIcon(":/images/btn.png"));    //将按钮设置为图片按钮
    QPushButton *sex_button = new QPushButton;
    sex_button->setIcon(QIcon(":/images/btn.png"));
    QPushButton *age_button = new QPushButton;
    age_button->setIcon(QIcon(":/images/btn.png"));
    QPushButton *height_button = new QPushButton;
    height_button->setIcon(QIcon(":/images/btn.png"));

    QGridLayout *glayout = new QGridLayout(this);
    glayout->setColumnMinimumWidth(1,150);  //设置列的最小宽度
    glayout->addWidget(label_1,0,0);
    glayout->addWidget(name_label,0,1);
    glayout->addWidget(name_button,0,2);

    glayout->addWidget(label_2,1,0);
    glayout->addWidget(sex_label,1,1);
    glayout->addWidget(sex_button,1,2);

    glayout->addWidget(label_3,2,0);
    glayout->addWidget(age_label,2,1);
    glayout->addWidget(age_button,2,2);

    glayout->addWidget(label_4,3,0);
    glayout->addWidget(height_label,3,1);
    glayout->addWidget(height_button,3,2);

    this->connect(name_button,SIGNAL(clicked(bool)),this,SLOT(slotGetName()));
    this->connect(sex_button,SIGNAL(clicked(bool)),this,SLOT(slotGetSex()));
    this->connect(age_button,SIGNAL(clicked(bool)),this,SLOT(slotGetAge()));
    this->connect(height_button,SIGNAL(clicked(bool)),this,SLOT(slotGetHeight()));
}

void InputDialogGui::slotGetName()
{
    bool ok;
    QString name = QInputDialog::getText(this,"文本输入框","请输入姓名:",QLineEdit::Normal,"张　三",&ok);    //打开标准文本输入框
    if(ok && !name.trimmed().isEmpty())
        name_label->setText(name);
}

void InputDialogGui::slotGetSex()
{
    bool ok;
    QStringList sexlist;
    sexlist << "男";
    sexlist << "女";
    sexlist << "人妖";

    QString sex = QInputDialog::getItem(this,"选项输入框","请输入性别:",sexlist,1,false,&ok);     //打开标准选项输入框
    if(ok)
        sex_label->setText(sex);
}


void InputDialogGui::slotGetAge()
{
    bool ok;
    QString agestr = "";
    int age = QInputDialog::getInt(this,"整型输入框","请输入年龄",23,0,200,2,&ok);    //打开标准整型输入框
    if(ok)
        age_label->setText(agestr.setNum(age));
}

void InputDialogGui::slotGetHeight()
{
    bool ok;
    double height = QInputDialog::getDouble(this,"浮点型输入框","请输入身高:",160,0,300,2,&ok);    //打开标准浮点型输入框
    if(ok)
        height_label->setText(QString::number(height));
}

InputDialogGui::~InputDialogGui()
{

}

实例四笔记总结：
要设置QPushButton类的命令按钮为图片按钮，方法如下：

void setIcon(const QIcon &icon);      //设置命令按钮为图片按钮

这里就引出了QIcon类：

QIcon(const QString &fileName);  
//使用图片的路径构造图片“:”表示当前项目的根目录

那么我们想要一个图片作为按钮，代码可以这么写：

QPushButton *push_button = new QPushButton;
push_button->setIcon(QIcon(“://images/btn.png”));

有关于***QLabel***类，在前面的笔记中已经有个大概的讲解，在本例中，主要涉及到下面的函数用法：
void setFrameStyle(int); //设置框架的样式
在QFrame类中，有以下两个枚举类型：

enum Shape {
        NoFrame  = 0, // no frame没有框架
        Box = 0x0001, // rectangular box长方形
        Panel = 0x0002, // rectangular panel矩形面板，使面板内容看起来凸起或者凹陷
        WinPanel = 0x0003, // rectangular panel (Windows)
        HLine = 0x0004, // horizontal line
        VLine = 0x0005, // vertical line
        StyledPanel = 0x0006 // rectangular panel depending on the GUI style
};

enum Shadow {
        Plain = 0x0010, // plain line
        Raised = 0x0020, // raised shadow effect
        Sunken = 0x0030 // sunken shadow effect凹陷的阴影效应
};

所以，在上面的例子中，设置图像按钮看起来阴影凸起或者凹陷的效果，我们可以这样做：

QLabel *sex_label = new QLabel;
sex_label->setFrameStyle(QFrame::Panel | QFrame::Sunken);

QInputDialog类：
QInputDialog是QDialog标准对话框的一部分，由一个文本框和两个按钮（OK按钮和Cancle按钮）组成。当用户单击OK按钮或按Enter键后，在父窗口可以收集通过QInputDialog控件输入的信息。QInputDialog是QDialog标准对话框的一部分。

在QInputDialog控件中可以输入数字/字符串或列表中的选项。标签用于提示必要的信息。

常用函数：
static QString getText(QWidget *parent, const QString &title, const QString &label, QLineEdit::EchoMode echo, const QString &text, bool *ok)Parent为父类对象，title为窗口标题,label窗口的提示语句，echo为文本框的模式(Normal为普通模式),text为文本框的初始化内容，如果ok参数为非零，则如果用户点击OK，*ok被设置为真，并且如果用户点击Cancel，就被设置为假

static QString getItem(QWidget *parent, const QString &title, const QString &label, const QStringList &items, int current = 0, bool editable = true, bool *ok = 0, Qt::WindowFlags flags = 0);Parent为父类对象，title为窗口标题,label窗口的提示语句, itemst选项列表 , current为当前选项值， editable是否可编辑选项，如果ok参数为非零，则如果用户点击OK，*ok被设置为真，并且如果用户点击Cancel，就被设置为假

static int getInteger(QWidget *parent, const QString &title, const QString &label, int value = 0, int minValue = -2147483647, int maxValue = 2147483647, int step = 1, bool *ok = 0, Qt::WindowFlags flags = 0);
parent为父类对象，title为窗口标题,label窗口的提示语句, value当前值， minValue为最小值， maxValue最大值， step步长，如果ok参数为非零，则如果用户点击OK，*ok被设置为真，并且如果用户点击Cancel，就被设置为假

static double getDouble(QWidget *parent, const QString &title, const QString &label, double value = 0, double minValue = -2147483647, double maxValue = 2147483647, int decimals = 1, bool *ok = 0, Qt::WindowFlags flags = 0);
parent为父类对象，title为窗口标题,label窗口的提示语句, value当前值， minValue为最小值， maxValue最大值， decimals步长，如果ok参数为非零，则如果用户点击OK，*ok被设置为真，并且如果用户点击Cancel，就被设置为假

使用：例程请看实例

通过上述实例我们应该掌握：
1.QInputDialog的使用
2.添加资源文件的步骤
3.图片格式要求包括.png,TIFF、MNG、TGA 和 WBMP,不能直接支持.gif,*.jpeg，必须使用qgif4.dll，qjpeg4.dll
4.Qt程序调试:1.设置断点 2.F5 3.F10 F11,查看变量值窗口 4.a.exec() 5.继续 5.shift+F5**

五、实例五

完成效果如下：
按下question按钮，弹出question message box对话框，以此类推。

直接上代码：
main.cpp

#include "messagegui.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MessageGui w;
    w.show();

    return a.exec();
}

MessageBoxGui.h

#ifndef MESSAGEGUI_H
#define MESSAGEGUI_H

#include <QDialog>
#include <QLabel>
#include <QPushButton>
#include <QGridLayout>
#include <QVBoxLayout>  //竖直布局
#include <QMessageBox>  //标准消息对话框

class MessageGui : public QDialog
{
    Q_OBJECT

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

    QLabel *message_label;

public slots:
    void slotQeistion();
    void slotWarning();
    void slotCritical();
    void slotConstum();
};

#endif // MESSAGEGUI_H

MessageBoxGui.cpp

#include "messagegui.h"

MessageGui::MessageGui(QWidget *parent)
    : QDialog(parent)
{
    this->setWindowTitle(tr("messageBox demo"));

    message_label = new QLabel(tr("message"));
    message_label->setAlignment(Qt::AlignCenter);

    QPushButton *question_button = new QPushButton(tr("question"));
    QPushButton *warning_button = new QPushButton(tr("warning"));
    QPushButton *critical_button = new QPushButton(tr("critical"));
    QPushButton *constum_button = new QPushButton(tr("constum"));

    QGridLayout *glayout = new QGridLayout;     //不是主布局，不能用this
    glayout->addWidget(question_button,0,0);
    glayout->addWidget(warning_button,0,1);
    glayout->addWidget(critical_button,1,0);
    glayout->addWidget(constum_button,1,1);

    QVBoxLayout *vlayout = new  QVBoxLayout(this);  //主布局
//    vlayout->setAlignment(Qt::AlignCenter);
    vlayout->addWidget(message_label);
    vlayout->addLayout(glayout);

    this->connect(question_button,SIGNAL(clicked(bool)),this,SLOT(slotQeistion()));
    this->connect(warning_button,SIGNAL(clicked(bool)),this,SLOT(slotWarning()));
    this->connect(critical_button,SIGNAL(clicked(bool)),this,SLOT(slotCritical()));
    this->connect(constum_button,SIGNAL(clicked(bool)),this,SLOT(slotConstum()));
}

void MessageGui::slotQeistion()
{
    int button = QMessageBox::question(this,tr("question message box"),tr("this is question message box"),QMessageBox::Ok | QMessageBox::Cancel);
    if(button == QMessageBox::Ok)
        message_label->setText(tr("clicked question / OK"));
    else if(button == QMessageBox::Cancel)
        message_label->setText(tr("clicked question / CANCEL"));
}

void MessageGui::slotWarning()
{
    int button = QMessageBox::warning(this,tr("warning message box"),tr("this is warning message box"),QMessageBox::Ok | QMessageBox::Discard | QMessageBox::Cancel);
    if(button == QMessageBox::Ok)
        message_label->setText(tr("clicked warning / OK"));
    else if(button == QMessageBox::Discard)
        message_label->setText(tr("clicked warning / Discard"));
    else if(button == QMessageBox::Cancel)
        message_label->setText(tr("clicked warning / Cancel"));
}

void MessageGui::slotCritical()
{
    int button = QMessageBox::critical(this,tr("critical message box"),tr("this is critical message"),QMessageBox::Ok);
    if(button == QMessageBox::Ok)
        message_label->setText(tr("clicked critical / OK"));
}

void MessageGui::slotConstum()
{
    //自定义消息对话框，创建对象，设置属性值，添加按钮，判断用户点击的按钮
    QMessageBox constum;
    constum.setWindowTitle(tr("constum message box"));
    constum.setText(tr("this is constum message box"));
    constum.setIconPixmap(QPixmap(":/images/linuxredhat.png"));
    QPushButton * lock_button = constum.addButton(tr("lock"),QMessageBox::ActionRole);
    QPushButton * unlock_button = constum.addButton(tr("unlock"),QMessageBox::ActionRole);
    QPushButton * ok_button = constum.addButton(QMessageBox::Ok);
    constum.exec();

    QAbstractButton *cbutton = constum.clickedButton();     //获取用户点击的按钮
    if(cbutton == lock_button)  //用户点击lock_button
        message_label->setText(tr("clicked constum / lock"));
    else if(cbutton == unlock_button)
        message_label->setText(tr("clicked constum / unlock"));
    else if(cbutton == ok_button)
        message_label->setText(tr("clicked constum / OK"));
}

MessageGui::~MessageGui()
{

}

实例五笔记：
QMessageBox类:
提供了一个有一条简短消息、一个图标和一些按钮的模式对话框。
构造函数：
QMessageBox(QWidget *parent = 0); //无参构造
QMessageBox(Icon icon, const QString &title, const QString &text, StandardButtons buttons = NoButton, QWidget *parent = 0, Qt::WindowFlags flags = Qt::Dialog | Qt::MSWindowsFixedSizeDialogHint); //有参构造

常用函数：
static int question(QWidget *parent, const QString &title, const QString& text, int button0, int button1 = 0, int button2 = 0);
此函数用于打开一个问题消息框，parent为父类对象,title为消息框的标题， text为消息框的问题，button0为要显示的按钮,button1为默认选中的按钮，返回按钮选中的按钮常量值

static int information(QWidget *parent, const QString &title, const QString& text, int button0, int button1 = 0, int button2 = 0);
此函数用于打开一个信息框，parent为父类对象,title为窗口标题，text为要显示的信息，button0为要显示的按钮,button1为默认选中的按钮，返回按钮选中的按钮常量值

static int warning(QWidget *parent, const QString &title, const QString& text, int button0, int button1, int button2 = 0);
此函数用于打开一个警告框，parent为父类对象，title为窗口标题, text为要显示的信息，button0为要显示的按钮,button1为默认选中的按钮，返回按钮选中的按钮常量值

QPushButton *addButton(const QString &text, ButtonRole role);
其中QMessageBox 类中ButtonRole枚举中有：
AcceptRole, RejectRole, DestructiveRole, ActionRole, HelpRole, YesRole, NoRole, ResetRole, ApplyRole常量等

QPushButton *addButton(StandardButton button); //在消息框上添加按钮
void removeButton(QAbstractButton *button) //删除消息框上的按钮
void setIconPixmap(const QPixmap &pixmap); //设置消息框的图片
void setText(const QString &text); //设置消息框的文本
int exec(); //使消息框运行

QAbstractButton *clickedButton() const; //获取消息框上用户点击的按钮

通过上述实例我们需要掌握：
1.QMessageBox的使用
2.QVBoxLayout的使用,布局管理器嵌套
3.自定义消息框等的使用
4.国际化

六、实例六：QQ界面

实现效果如下：

一样的先上代码;
main.cpp

#include "myqq.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MyQQ w;
    w.show();

    return a.exec();
}

myqq.h

#ifndef MYQQ_H
#define MYQQ_H

#include <QWidget>
#include <QToolBox>     //工具盒
#include <QGroupBox>    //组盒
#include <QVBoxLayout>
#include <QToolButton>  //工具按钮

class MyQQ : public QToolBox
{
    Q_OBJECT

public:
    enum iconSize_t{ICONWIDTH = 40,ICONHEIGHT = 40};      //图片宽度，高度枚举
    MyQQ(QWidget *parent = 0);
    ~MyQQ();

    QToolButton *addmybutton(const QString &name,const QString &path);   //创建按钮

public slots:
    void slotOpenMessage();     //显示聊天窗口的槽函数
};

#endif // MYQQ_H

myqq.cpp

#include "myqq.h"

MyQQ::MyQQ(QWidget *parent)
    : QToolBox(parent)
{
    this->setWindowTitle("我的QQ");
    this->setWindowIcon(QIcon("://images/1.png"));      //设置应用程序图片

    QGroupBox *group_1 = new QGroupBox;
    QVBoxLayout *vlayout_1 = new QVBoxLayout(group_1);
    vlayout_1->setAlignment(Qt::AlignCenter);       //设置对齐方式
//    group_1->setLayout(vlayout_1);

    QToolButton *button_1_1 = this->addmybutton("贝 贝","://images/bb.png");
    QToolButton *button_1_2 = this->addmybutton("京 京","://images/jj.png");
    QToolButton *button_1_3 = this->addmybutton("欢 欢","://images/hh.png");

    vlayout_1->addWidget(button_1_1);
    vlayout_1->addWidget(button_1_2);
    vlayout_1->addWidget(button_1_3);
    vlayout_1->addStretch();    //设置自动填充

    this->addItem(group_1,"我的好友");

    QGroupBox *group_2 = new QGroupBox;
    QVBoxLayout *vlayout_2 = new QVBoxLayout(group_2);
    QToolButton *button_2_1 = this->addmybutton("陌生1","://images/1.png");
    QToolButton *button_2_2 = this->addmybutton("路人甲","://images/2.png");
    vlayout_2->setAlignment(Qt::AlignCenter);
    vlayout_2->addWidget(button_2_1);
    vlayout_2->addWidget(button_2_2);
    vlayout_2->addStretch();

    this->addItem(group_2,"陌生人");

    QGroupBox *group_3 = new QGroupBox;
    QVBoxLayout *vlayout_3 = new QVBoxLayout(group_3);
    QToolButton *button_3_1 = this->addmybutton("坏人1","://images/3.png");
    QToolButton *button_3_2 = this->addmybutton("坏人2","://images/4.png");
    vlayout_3->setAlignment(Qt::AlignCenter);
    vlayout_3->addWidget(button_3_1);
    vlayout_3->addWidget(button_3_2);
    vlayout_3->addStretch();

    this->addItem(group_3,"黑名单");
    this->resize(100,600);
}

QToolButton *MyQQ::addmybutton(const QString &name,const QString &path)
{
    QToolButton *button_1_1 = new QToolButton;
    button_1_1->setText(name);
    button_1_1->setIcon(QIcon(path));       //设置按钮图片
    button_1_1->setIconSize(QSize(ICONWIDTH,ICONHEIGHT));  //设置按钮图片大小
    button_1_1->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);    //设置图片样式
    button_1_1->setAutoRaise(true);
    this->connect(button_1_1,SIGNAL(clicked(bool)),this,SLOT(slotOpenMessage()));   //连接信号到打聊天消息窗口的槽
    return button_1_1;
}

void MyQQ::slotOpenMessage()
{

}

MyQQ::~MyQQ()
{

}

实例六笔记：
QToolBox类：
toolBox工具箱是一个容器部件，对应类为QToolBox，在其内有一列从上到下顺序排列的标签部件项（tabbed widget item），每个标签部件项都有一个索引位置，位置索引是从上到下从0开始的顺序数字。每个标签部件项同时对应一个QWidget或其派生的部件，当对应标签部件项被选中时，就在该每个标签部件项下显示该每个标签部件项对应的部件即标签部件。

构造函数：
QToolBox(QWidget *parent = 0, Qt::WindowFlags f = 0);

常用函数：
int addItem(QWidget *widget, const QString &text);
int addItem(QWidget *widget, const QIcon &icon, const QString &text);
int insertItem(int index, QWidget *widget, const QString &text);
int insertItem(int index, QWidget *widget, const QIcon &icon, const QString &text);
void removeItem(int index);
void setItemText(int index, const QString &text);
QString itemText(int index) const;
void setItemIcon(int index, const QIcon &icon);
QIcon itemIcon(int index) const;

使用：
this->addItem(group_1,“我的好友”);
this->addItem(group_2,“陌生人”);
this->addItem(group_3,“黑名单”);

QToolButton类：
提供了用于命令或选项可以快速访问的按钮,通常可以用在QToolBar里面。工具按钮和普通的命令按钮不同,通常不显示文本,而显示图标。
构造函数：
QToolButton(QWidget * parent=0);

常用函数：
void setText(const QString &text); //设置工具按钮上的文本
void setIcon(const QIcon &icon); //设置工具按钮上的图片
void setIconSize(const QSize &size); //设置图片的大小
void setAutoRaise(bool enable); //设置工具按钮是否凸起
void setToolButtonStyle(Qt::ToolButtonStyle style); //设置工具按钮的样式
其中，
Qt中有enum ToolButtonStyle定义

enum ToolButtonStyle { 
ToolButtonIconOnly, 
ToolButtonTextOnly, 
ToolButtonTextBesideIcon, 
ToolButtonTextUnderIcon, 
ToolButtonFollowStyle 
};

QGroupBox类：
QGroupBox窗口部件提供了一个有标题的组合框。
组合框提供一个框架、一个标题和一个键盘快捷键，并且显示在它里面地其它不同窗口部件。标题在上面，键盘快捷键移动键盘焦点到组合框的一个子窗口部件，并且子窗口部件将会排列在这个框架中地一个数组中。

使用它的最简单方式是创建一个为你所想要的列数（或者行数）和方向的组合框，并且然后创建其它窗口部件时，把这个组合框作为父对象。
构造函数：
QGroupBox(const QString &title, QWidget* parent=0);
用法：

QGroupBox *group_2 = new QGroupBox;  //初始化一个组合框
QVBoxLayout *vlayout_2 = new QVBoxLayout(group_2); //垂直布局，组合框下可以用其他组件
QToolButton *button_2_1 = this->addmybutton("陌生1","://images/1.png");
QToolButton *button_2_2 = this->addmybutton("路人甲","://images/2.png");
vlayout_2->setAlignment(Qt::AlignCenter);
vlayout_2->addWidget(button_2_1);
vlayout_2->addWidget(button_2_2);
vlayout_2->addStretch();
this->addItem(group_2,"陌生人");  //设置组合框的名称：“陌生人”

这里要实现的效果如下：（陌生人一栏）

要看懂上面的用法，我们先来看看下面说明：
QVBoxLayout类：垂直布局
void QVBoxLayout::setAlignment(Qt::Alignment a); 设置自动成直线
void addStretch(int stretch = 0); 自动扩充

可视化组件重新设定大小：
void QWidget::resize(int w, int h)

通过上述实例我们需要掌握：
1.QToolBox,QGroupBox,QToolButton的使用
2.封装函数
3.定义和使用枚举