前言
在实际项目开发中,对于漂亮美观的UI界面大多数都是采用样式表来实现的,但是实际上即使是样式表很少也能实现比较带科技炫酷的风格,本篇介绍的是模仿谷歌Material风格的UI界面,基于大牛的第三方开源控件库,界面效果大致如下
正文
我对接口进行了封装,关键代码献上:
头文件:
1 #ifndef FORM_H
2 #define FORM_H
3
4 #include <QWidget>
5 #include <QDebug>
6 #include <QThread>
7 #include <QLabel>
8 #include <QHBoxLayout>
9
10 namespace Ui {
11 class Form;
12 }
13
14 class QtMaterialRaisedButton;
15 class QtMaterialFlatButton;
16 class QtMaterialDialog;
17
18 class Form : public QWidget
19 {
20 Q_OBJECT
21
22 public:
23 explicit Form(QWidget *parent = 0);
24 ~Form();
25 void InitQtMaterialDialog();
26 void ShowQtMaterialDialog(const QString &text,bool haveCancle = false);
27 private slots:
28
29
30
31 private:
32 Ui::Form *ui;
33 /********关于Material风格的弹出对话框需要定义的变量属性*******/
34 QtMaterialDialog * m_dialog = Q_NULLPTR;
35 QtMaterialFlatButton * yesButton = Q_NULLPTR;
36 QtMaterialFlatButton * cancleButton = Q_NULLPTR;
37 QHBoxLayout *hButtonLayout = Q_NULLPTR;
38 QLabel * label = Q_NULLPTR;
39 /********关于Material风格的弹出对话框需要定义的变量属性*******/
40 };
41
42 #endif // FORM_H
cpp文件:
两个关键函数,初始化窗口函数以及显示窗口函数
1 void Form::InitQtMaterialDialog()
2 {
3 if(m_dialog == Q_NULLPTR)
4 {
5 m_dialog = new QtMaterialDialog(this);
6
7 QWidget *dialogWidget = new QWidget;
8 QVBoxLayout *dialogWidgetLayout = new QVBoxLayout;
9 dialogWidget->setLayout(dialogWidgetLayout);
10 label = new QLabel("");
11 label->setAlignment(Qt::AlignCenter);
12 dialogWidgetLayout->addWidget(label,4);
13 hButtonLayout = new QHBoxLayout;
14 yesButton = new QtMaterialFlatButton("确定"); //QtMaterialFlatButton
15 cancleButton = new QtMaterialFlatButton("取消");
16 hButtonLayout->addWidget(yesButton,1);
17 hButtonLayout->addWidget(cancleButton,1);
18 dialogWidgetLayout->addLayout(hButtonLayout,1);
19
20 cancleButton->setMaximumWidth(150);
21 yesButton->setMaximumWidth(150);
22
23 QVBoxLayout *dialogLayout = new QVBoxLayout;
24 m_dialog->setWindowLayout(dialogLayout);
25
26 dialogWidget->setMinimumHeight(300);
27
28 dialogLayout->addWidget(dialogWidget);
29 connect(cancleButton,&QtMaterialFlatButton::pressed,[this](){
30 qDebug() << "按下取消" << endl;
31 m_dialog->hideDialog();
32 });
33 connect(yesButton,&QtMaterialFlatButton::pressed,[this](){
34 qDebug() << "按下确定" << endl;
35 m_dialog->hideDialog();
36 });
37 }
38
39 }
40
41 void Form::ShowQtMaterialDialog(const QString &text, bool haveCancle)
42 {
43 if(m_dialog)
44 {
45 label->setText(text);
46 if(haveCancle && hButtonLayout->indexOf(cancleButton) == -1)
47 {
48 if(cancleButton == Q_NULLPTR)
49 {
50 cancleButton = new QtMaterialFlatButton("取消");
51 connect(cancleButton,&QtMaterialFlatButton::pressed,[this](){
52 qDebug() << "按下取消" << endl;
53 m_dialog->hideDialog();
54 });
55 }
56 hButtonLayout->addWidget(cancleButton);
57 hButtonLayout->setStretch(0,1);
58 hButtonLayout->setStretch(1,1);
59 }
60 if(!haveCancle && hButtonLayout->indexOf(cancleButton) != -1)
61 {
62 hButtonLayout->removeWidget(cancleButton);
63 delete cancleButton;
64 cancleButton = Q_NULLPTR;
65 }
66 m_dialog->showDialog();
67 }
68 }