网站空间多大,不建立网站建设的利弊,东莞网站seo技术,医疗设计网站一、UI编辑器
注意#xff1a;创建工程时#xff0c;要勾上界面按钮 UI设计师界面的模块 UI编辑器会在项目构建目录中自动生成一个ui_xxx.h#xff08;构建一次才能生成代码#xff09;#xff0c;来表示ui编辑器界面的代码#xff0c;属于自动生成的#xff0c;一定不…一、UI编辑器
注意创建工程时要勾上界面按钮 UI设计师界面的模块 UI编辑器会在项目构建目录中自动生成一个ui_xxx.h构建一次才能生成代码来表示ui编辑器界面的代码属于自动生成的一定不要修改。修改界面属性只能通过ui编辑器来做。
二、信号与槽
在ui设计师界面右键相应的组件选择“转到槽”选项会自动跳转到槽函数
这种方法不会有connect的体现遵循的是qt内部匹配规则。
匹配规则on_AAA_BBB:代表连接AAA对象的BBB信号到此槽。
比如响应对象myBtn的clicked信号就会生成on_myBtn_clicked的槽。
过多使用此方法会导致信号与槽对应关系不明确项目开发中不建议使用。
代码中取界面组件使用ui-取部件即可。
三、常用控件
QPushButton按钮
QRadioButton单选框
QCheckBox多选框
QListWidget:列表部件
QTableWidget表格组件
QGroupBox: 组框
QStackedWidget堆栈窗体
QWidget:基础窗口部件
QComboBox组合框
QLineEdit单行文本框
QTextEdit多行文本框
QTimeEdit时间编辑框
QSpinBox微调框
QSlider滑动条
QLabel标签
QProgressBar进度条 四、资源文件
1. 作用 提供了和路径无关的资源管理将资源编译到二进制文件中。 PS: 图片资源的获取可以从阿里巴巴矢量图库找。 2. 创建方法步骤
1) 新建文件 -- QT --QT资源文件
2) 添加前缀
3) 添加文件 注意需要提前在工程的源文件中创建目录然后把图片添加进去 3. 编程实例 问题界面内容为进度条、两个按钮/- 功能点击/-按钮后实现进度条变化并显示当前进度值全部用代码实现。 补充增加图片借助qt的资源文件资源文件提供管理资源的方法并且把资源编译到可执行文件中和路径无关。 方法新建--QT--QT资源文件提供图片资源。 五、布局管理器
1. 界面布局的方法 手工布局(绝对定位): (适用于测试某个小功能)。 UI布局: 简单快捷但不能做到自适应窗口需要自己计算窗口位置和大小 2. 布局管理器布局(适用于真正项目开发): 1) 子部件的定位 2) 窗口的 合理默认空间 3) 窗口的合理最小空间 4) 窗口自适应管理 5) 字体大小或者内容变化
详见帮助文档Layout Management 3. 布局相关类的继承关系 4. 布局中的一些概念 margin页边空白布局和外围窗体之间的间隔
left top right bottom
spacing代表布局内部件之间的间隔
stretch代表布局内部件所占的比例 5. 布局相关的方法
QHBoxLayout(QWidget * parent)
在parent部件上增加QHBoxLayout布局void addWidget(QWidget *widget, int stretch 0, Qt::Alignment alignment 0)
布局上加部件void addLayout(QLayout *layout, int stretch 0)
布局上加布局void QBoxLayout::addStretch(int stretch 0)
在布局中增加指定比例的空白void QBoxLayout::setStretch(int index, int stretch)
设置部件的比例void QBoxLayout::setSpacing(int spacing)
设置部件之间的空白距离void QBoxLayout::setMargin(int margin)void QLayout::setContentsMargins(int left, int top, int right, int bottom)
设置布局和外围窗体之间的空白距离
如果定义布局对象时没有指定父对象可以用如下方法显示的设置
//此方法属于QWidget
void QWidget::setLayout(QLayout * layout) 1) 水平布局 案例需求窗体上放置两个文本输入框 QTextEdit 横向均分两个文本输入框。使用代码来实现上述功能。需要自适应。 使用代码实现两个文本框的横向占比为1:2中间再增加一份占比为1的空白设置margin为5设置spacing为10。 问题根据设计图完成双向进度条显示部件要求界面可自适应界面基础大小为300*50总体使用横向布局。图中数字为比例关系 进度条无法自适应高度请参考sizePolicy属性帮助文档解决。
//进度条样式参考
#define PROGRESS_LEFT_STYLE (QString(\QProgressBar {\background-color: #dbdee0;\border-right:1px solid #00ff00\\}\QProgressBar::chunk {\background-color: #FF5500 }))#define PROGRESS_RIGHT_STYLE (QString(\QProgressBar {\background-color: #dbdee0;\border-left:1px solid #00ff00\\}\QProgressBar::chunk {\background-color: #FF5500 })) 代码
widget.h
#ifndef WIDGET_H
#define WIDGET_H#include QWidget
#include QtWidgets
namespace Ui {
class Widget;
}class Widget : public QWidget
{Q_OBJECTpublic:explicit Widget(QWidget *parent nullptr);~Widget();private:Ui::Widget *ui;
};#endif // WIDGET_H
widget.cpp
#include widget.h
#include ui_widget.hWidget::Widget(QWidget *parent) :QWidget(parent),ui(new Ui::Widget)
{ui-setupUi(this);this-resize(300,50);QProgressBar *left_bar new QProgressBar(this);left_bar-setValue(50);left_bar-setInvertedAppearance(true); // 反转left_bar-setTextVisible(false); // 隐藏textleft_bar-setSizePolicy(QSizePolicy::Preferred,QSizePolicy::Preferred); // 调整策略QProgressBar *right_bar new QProgressBar(this);right_bar-setTextVisible(false);right_bar-setValue(30);right_bar-setSizePolicy(QSizePolicy::Preferred,QSizePolicy::Preferred);QHBoxLayout *hlayout new QHBoxLayout; // 水平布局hlayout-addStretch(1);hlayout-addWidget(left_bar,14);hlayout-addWidget(right_bar,14);hlayout-addStretch(1);hlayout-insertSpacing(2,2);QVBoxLayout *vlayout new QVBoxLayout(this); // 垂直布局vlayout-addStretch(1);vlayout-addLayout(hlayout,5);vlayout-addStretch(1);
}Widget::~Widget()
{delete ui;
}
main.cpp
#include widget.h
#include QApplicationint main(int argc, char *argv[])
{QApplication a(argc, argv);Widget w;w.show();return a.exec();
} 输出 2) 网格表格
相关方法
//构造函数
QGridLayout()
QGridLayout(QWidget *parent)//添加布局
void addLayout(QLayout *layout, int row, int column, int rowSpan, int columnSpan, Qt::Alignment alignment Qt::Alignment())//添加控件
void addWidget(QWidget *widget, int fromRow, int fromColumn, int rowSpan, int columnSpan, Qt::Alignment alignment Qt::Alignment())//设置行比例
void setRowStretch(int row, int stretch)//设置列比例
void setColumnStretch(int column, int stretch)案例需求6个按钮按照两行三列布局设置上下行按钮比例为1 : 2。 代码
widget.cpp
#include widget.h
#include ui_widget.hWidget::Widget(QWidget *parent) :QWidget(parent),ui(new Ui::Widget)
{ui-setupUi(this);QPushButton *b1 new QPushButton;b1-setText(1);b1-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QPushButton *b2 new QPushButton;b2-setText(2);b2-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QPushButton *b3 new QPushButton;b3-setText(3);b3-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QPushButton *b4 new QPushButton;b4-setText(4);b4-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QPushButton *b5 new QPushButton;b5-setText(5);b5-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QPushButton *b6 new QPushButton;b6-setText(6);b6-setSizePolicy(QSizePolicy::Expanding,QSizePolicy::Expanding);QGridLayout *layout new QGridLayout; // 网格布局this-setLayout(layout); // 将布局加入界面layout-addWidget(b1,0,0,1,1); // 将部件加入布局layout-addWidget(b2,0,1,1,1);layout-addWidget(b3,0,2,1,1);layout-addWidget(b4,1,0,1,1);layout-addWidget(b5,1,1,1,1);layout-addWidget(b6,1,2,1,1);layout-setMargin(0); // 设置边距layout-setSpacing(0); // 设置各部件之间的间距layout-setRowStretch(0,1); // 设置某一行的伸缩比例layout-setRowStretch(1,2);
}Widget::~Widget()
{delete ui;
} 输出
