QML Popup详解
1.简介
弹出式用户界面控件，它可以与Window或ApplicationWindow一起使用，默认不可见。
常用属性介绍，一些公用的基础属性就不作介绍，可以查看我前面写的文章。
closePolicy : enumeration ：此属性决定弹出窗口关闭的情况
- Popup.NoAutoClose： Popup 只会在手动指示时关闭。
- Popup.CloseOnPressOutside：当鼠标在其外部按下时， Popup 将关闭。
- Popup.CloseOnPressOutsideParent：当鼠标在其父级之外按下时， Popup 将关闭。
- Popup.CloseOnReleaseOutside：当鼠标离开 Popup 时， Popup 将关闭。
- Popup.CloseOnReleaseOutsideParent：当鼠标在其父级之外释放时， Popup 将关闭。
- Popup.CloseOnEscape：当 Popup 具有活动焦点时按下退出键， Popup 将关闭。
modal : bool：确定弹出窗口是否是模态的
dim : bool：显示弹出窗口是否使背景变暗
Overlay：弹出窗口覆盖
下图就是一些内边距、外边距等的一些属性。
常用方法：
- void close()：关闭弹窗
- void open() ：打开弹窗
2.示例
示例1：打开一个模态框，按ESC键关闭。
Window {visible: truewidth: 700height: 700title: qsTr("Hello World")Button {text: "Open"onClicked: popup.open()}Popup {id: popupx: 100y: 100width: 200height: 300modal: truefocus: trueclosePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent}
}示例2：带动画的打开关闭popup
Window {visible: truewidth: 700height: 700title: qsTr("Hello World")Button {text: "Open"onClicked: popup.open()}Popup {id: popupx: 100y: 100width: 200height: 300modal: truefocus: trueclosePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParententer: Transition {NumberAnimation {property: "opacity"from: 0.0to: 1.0duration: 2000}}exit: Transition {NumberAnimation {property: "opacity"from: 1.0to: 0.0duration: 2000}}}
}示例3：Overlay的简单使用
Overlay.modal 要生效，使用modal：true
Overlay.modeless要生效，使用modal：false 并且置dim：true
Window {visible: truewidth: 700height: 700title: qsTr("Hello World")Popup {id: popupx: 100y: 100visible: truewidth: 200height: 300modal: falsefocus: true//dim:trueclosePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent//modal设置了除模态对话框以外的区域Overlay.modal: Rectangle{anchors.fill: parentcolor: "red"}//modal设置了除非模态对话框以外的区域，要设置dim：true才可以Overlay.modeless: Rectangle{anchors.fill: parentcolor: "green"}}
}