Qt图形界面编程入门（基本窗口及控件）

基本窗口类QWidget

QWidget是所有窗体部件的基类，例如对话框类，主窗体类，以及其他诸如按钮，编辑框，标签等等都是由QWidget派生得到，QWidget拥有的方法往往都可以在其他子类中使用。

窗体的几何尺寸分为包含边框和标题、不包含边框和标题两种。

以下是常用函数

（1）包括窗框（即整个窗口）的函数。

x()，y()，pos()：获取左上角坐标

frameGeometry()：获取窗体尺寸（返回一个矩形QRect）

move()：移动窗体到某个位置。

（2）不包括窗体（即客户区域）（返回一个矩形QRect）

width()，heigh()：获取客户区宽度、高度

setGeometry()：设置窗体在屏幕中的位置。

窗体几何尺寸的设置和获取

首先我们建立一个基于QWidget的无UI设计界面的Qt Widgets Application应用。

在main.cpp头部文件添加

#include<QDebug>

然后，修改主函数main.cpp文件如下

#include "widget.h"
#include <QApplication>
#include<QDebug>
int main(int argc, char *argv[])
{QApplication a(argc, argv);Widget w;w.show();w.setGeometry(50,50,200,200);qDebug() << w.x() << " " << w.y();qDebug() << w.geometry().width() << " " << w.frameGeometry().width();qDebug() << w.geometry().height() << " " << w.frameGeometry().height();return a.exec();
}

保存后运行

运行上面的程序会显示一个窗口，如图

它的客户区左上角距离屏幕左上角边界均为50，客户区的长和宽均为200

这里的（41,12）是窗体框架左上角的坐标，它在客户区的左上角（50,50）的左上方。而显示器左上角是原点。

setGeometry函数设置客户区在屏幕上的位置及其宽度、高度。

窗口标题及大小控制

首先建立一个基于QWidget的有UI设计界面的Qt Widgets Application应用。

然后修改Widget.cpp文件的构造函数如下：

窗口控件类概览

#include "widget.h"
#include <QApplication>
#include <QLabel>
#include <QImage>
int main(int argc, char *argv[])
{QApplication a(argc, argv);Widget w;QLabel *pTag = new QLabel(&w);//路径不同，图片属性不同，请自行修改路径和属性//QImage image("e:/img.png");pTag->setPixmap(QPixmap::fromImage(image));pTag->setGeometry(0,0,image.width(),image.height());w.show();return a.exec();

这个例子用QImage对象载入E盘根目录下的png文件，再利用QPixmap::formImage静态函数将png格式转换为xpm格式，然后用setPixmap函数设置标签位图。

按钮

对于普通按钮而言，可设置图标，文字，显示状态等。

按钮的使用

第一步，建立一个基类为QDialog的应用，在创建过程中取消UI界面设计文件。

第二步，修改dialog.h文件如下

第三步，打开“新建”菜单，选择Qt ->“Qt资源文件”，在工程项目中添加资源文件，可任意命名

第四步，在工程目录中添加文件夹rc，然后将两个图标文件放入其中(在线制作ico图标 http://www.bitbug.net/ )

第五步，在button.qrc项目上右击，在弹出的菜单选择“添加现有文件”，将rc目录下的图标分别添加到工程项目中。

第六步，修改dialog.cpp文件的Dialog类构造函数：

    resize(150,150);  //设置主窗体大小pushButton1 = new QPushButton(this);  // 新建按钮QIcon icon1(":/rc/bitbug_favicon.ico");  // 定义图标对象pushButton1->setIcon(icon1);  //  设置按钮图标pushButton1->setGeometry(20,20,70,40);pushButton2 = new QPushButton(this);QIcon icon2(":bitbug_favicon(1).ico");pushButton2->setIcon(icon2);pushButton2->setFlat(true); //  将按钮设置为平面显示pushButton2->setText("Open");  //  设置按钮的文本信息pushButton2->setGeometry(20,70,70,40);

点击运行后

单选按钮、复选框

单选按钮用于在众多选项中选择一项，复选框用于在众多选项中同时选择多项

单选按钮，复选框的使用

第一步，建立一个基于QWidget类的有UI设计界面的应用程序。

第二步，在UI设计器中放入两个复选框，两个标签，两个单选按钮

在本例中，修改单选按钮和复选框的objectName和text属性如下：

两个单选按钮的objectName改为RadioBtn1，RadioBtn2

两个单选按钮的文本test改为男，女

两个复选框的objectName改为CheckBox1，CheckBox2

两个复选框的文本test改为教师，学生

两个标签的objectName改为label，label_2

void Widget::on_RadioBtn1_clicked()
{   // "男"单选按钮为选中状态ui->RadioBtn1->setChecked(true);//label标签显示相应的内容ui->label->setText("你选中了男生");
}void Widget::on_RadioBtn2_clicked()
{// "女"单选按钮为选中状态ui->RadioBtn2->setChecked(true);//label标签显示相应的内容ui->label->setText("你选中了女生");
}void Widget::displayCheckBox()
{QString str; //定义字符串//使用条件语句判断if(ui->CheckBox1->isChecked() && ui->CheckBox2->isChecked()){str = "你选中了教师！\n你选中了学生！";}else if(ui->CheckBox1->isChecked()){str +="你选中了教师！" ;}else if(ui->CheckBox2->isChecked()){str +="你选中了学生！";}//将str显示到label_2标签ui->label_2->setText(str);
}void Widget::on_CheckBox1_clicked()
{//调用自定义公有成员函数this->displayCheckBox();
}void Widget::on_CheckBox2_clicked()
{this->displayCheckBox();
}