qt开发-11_Dialog 仿苹果支付界面

QDialog 是 Qt 框架中用于创建对话框的一个基类。对话框是一种特殊类型的窗口，通常用于短暂的交互和信息交换，如接收用户输入、显示消息、询问用户决定等。QDialog 提供了一种方便的方式来实现这些功能，并能够控制用户与其他窗口的交互性（例如，通过模态和非模态对话框）。

QDialog 提供了一种标准化的方法来快速创建用户界面中常见的交互式窗口。通过定制对话框中的控件和布局，开发者可以构建出符合具体需求的对话框，从而提升用户体验和应用程序的功能性。

在生活中，我们扫码支付时，一扫这个码，他就是弹出这个支付界面，要你输入密码。那我们就来做一个支付界面。

这次我们再创建项目的时候略有不同，我们不要选 QWidget ， 我们要选择 QDialog  。

其他没有什么变化。

我们进入 UI 界面调整一下主界面大小。改成 400 210 注 是 210 后来有点小问题的加长一点

我们先做一下主要支付界面：

label  输入 请输入支付密码  调整大小为 400 22 字体大小  14 粗体

属性 选择居中对齐：

添加 输入框 lineedit 

调整高度为 30， 添加显示文本为 请输入支付密码 。

添加两个按钮：调整高度为 50；文字为 取消 和 确定 改为蓝色。

把按钮组成水平布局，间距调整为 0.

在 lineedit 两边加两个弹簧， 调整弹簧的宽度为 20.改为固定值 个人标注：先把东西拖入到 frame 里面，然后再进行弹簧布局最好。

然后组成水平布局。

在控件间添加垂直弹簧，组成垂直布局。然后添加一个 frame 布局，调整为400 200， 坐标 0 0 。将组成好的 整体布局拖入其中。如果不好放就调整一下弹簧大小，布局好了再调回来。

整体结构：

我们运行一下看看效果

还是不太像。将 frame 调整为 白色 圆角， 边框 线体如下：

QFrame{border-radius: 25px;
	background-color: #ffffff;
	border:2px solid gray
}

我们看到这个 label 还有边框给去掉。

这样不行，我们会把 框架的 边框给去掉。所以我们去掉。不这么用，我们再 frame 的样式前加一个  .  表示当前控件的样式表只作用于他自己。

效果

这个 按钮的样式不太对，我们也要改一改。将他分别设置为，字体改为 14 粗体

//左边的按钮
QPushButton{
	color: #1e90ff;
	border-top: 1px;
	border-right: 1px;
	border-style: solid;
	border-color: #000000;
}
//右边的按钮
QPushButton{color:#1e90ff;
	border-top:1px;
	border-style:solid;
	border-color:#000000;
}

但是点击的时候没有反馈，我们加上

//左
QPushButton:pressed{background-color: #aaaaaa;border-bottom-left-radius: 25px}
//右
QPushButton:pressed{background-color: #aaaaaa;border-bottom-right-radius: 25px}

效果：

我们把 标题去掉：

看看效果， 没问题的：

我们给按钮加一下功能，右键按钮点击转到槽，选择点击事件：

加个关闭功能：

这样点击就可以关闭了。