QT布局之水平垂直加Qss样式布局

工作日志

对于qt的开发，自我认为，要想开发华丽的界面要对qss样式表进行熟练地掌握，

这样才能更高效，更简洁的实现qt界面的开发！

今天的工作是修改了，两个主窗口：对比图如下：

修改之前：

修改之后：

部分实现代码：

CPExportOptionDialog::CPExportOptionDialog(QWidget* parent)
: CPDialog(parent),
_calcMd5Box(new QCheckBox(this)),
_keepDirectoryBox(new QCheckBox(this)),
_selectPathWidget(new CPPathSelectWidget(this))
{
setWindowTitle(tr("export options"));
setTitleIconHidden(true);
resize(400, 150);


QWidget* container = new QWidget(this);
container->setObjectName("export_option_dialog_centent");  //Qt样式表文件名
container->setStyleSheet(".QWidget#export_option_dialog_centent{background-color: white;}");


QLabel *savePathLabel = new QLabel();   //标签一
savePathLabel->setText(tr("SavePathLabel:"));  //add a option label using VBoxlayout style


QLabel *optionLabel = new QLabel();      //标签二
optionLabel->setText(tr("option:"));  //add a option label using VBoxlayout styl


QVBoxLayout* layout = new QVBoxLayout();     //添加一个垂直布局块
layout->setContentsMargins(20, 20, 20, 11);    //对布局块整体移动，主要是边框调整
_calcMd5Box->setText(tr("calc md5"));   //有两个标签在里面
_calcMd5Box->setChecked(true);


_keepDirectoryBox->setText(tr("keep directory"));
_keepDirectoryBox->setChecked(true);


//添加垂直布局
QVBoxLayout* optionBoxLayout = new QVBoxLayout();
optionBoxLayout->setContentsMargins(17, 0, 0, 0);
optionBoxLayout->addWidget(_calcMd5Box);
optionBoxLayout->addWidget(_keepDirectoryBox);


//添加垂直布局控件
layout->addWidget(optionLabel);
layout->addLayout(optionBoxLayout);
layout->addWidget(savePathLabel);


QHBoxLayout*  pathEditLayout = new QHBoxLayout();
pathEditLayout->addSpacing(17);   //可以调节每个控件的距离
pathEditLayout->addWidget(_selectPathWidget);
layout->addLayout(pathEditLayout);    
container->setLayout(layout);     //把每一块的布局添加到layout中
this->setContentWidget(container);
}