import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.5
Window {
width: 640
height: 480
color: "white"
title: qsTr("My QML")
visible: true
Button{
width: 50
height: 50
onClicked: {
//关闭popup使得popup的visible为false
popup.close()
//反之打开popup使得popup的visible为true
//popup.open()
}
}
//类似Rectangle
Popup{
id: popup
x: 100
y:100
width: 200
height: 300
visible: true
}
}
//Rectangle 与 Popup 区别是自己的visible显示独立于父窗口
Rectangle{
width: 200
height: 100
color: "black"
visible: false
//Rectangle的子Rectangle
//这个不会显示
Rectangle{
width: 50
height: 50
color: "red"
}
}
Rectangle{
x:200
y:100
width: 100
height: 100
color: "black"
visible: false
//Rectangle的子Popup
//这个会显示
Popup{
width: 50
height: 50
visible: true
}
}
//z高Rectangle
Rectangle{
z:999
width: 200
height: 100
color: "black"
}
//z低Rectangle
Rectangle{
x:100
z:0
width: 200
height: 100
color: "red"
}
//z永远大于Rectangle,Popup永远能覆盖Rectangle但是Popup之间可以被相互覆盖
Popup{
x:100
z:-9999
width: 100
height: 100
visible: true
}
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.5
Popup {
width: 640
height: 480
visible: true
Button{
width: 50
height: 50
onClicked: {
popup.close()
}
}
Popup {
id:popup
x:100
y:100
z:0
width: 500
height: 400
visible: true
//不会自动关闭
// closePolicy: Popup.NoAutoClose
//默认关闭策略 点击空白或点击esc键
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
//模态true 非模态false
modal: false
//非模态对话框的背景是否需要设置 false无效果 true 浅色
dim:true
//open时淡入
enter: Transition {
NumberAnimation {
property: "opacity"
from: 0.0;
to: 1.0;
duration:1000;
}
}
//close时淡出
exit: Transition{
NumberAnimation {
property: "opacity"
from: 1.0;
to: 0.0;
duration:1000;
}
}
//覆盖背景和文本,带淡入淡出属性
contentItem: Rectangle{
anchors.fill: parent
//背景
color: "grey"
Text {
id: name
anchors.fill:parent
text:qsTr("Message Box Area!!!!!!!!!")
font.pixelSize: 26
wrapMode: Text.WordWrap
}
}
Button{
anchors.bottom: parent.bottom
anchors.bottomMargin: 30
anchors.right: parent.right
anchors.rightMargin: 30
text: "cancel"
}
}
//模态除了Popup外的颜色
Overlay.modal:Rectangle{
anchors.fill: parent
color: "#33000000"
}
//非模态除了Popup外的颜色
Overlay.modeless:Rectangle{
anchors.fill: parent
color: "blue"
}
}