Quick的鼠标与键盘事件、锚布局
一:鼠标事件
MosuseArea的事件有
acceptedButtons
clicked
doubleClicked
pressed
released
实例:本实例,主要演示鼠标的事件处理
当鼠标有不同的操作时,文本内容会显示出不同的提示信息
Text //定义一个文本对象
{
x:50; //设置文本对象的位置
y:50;
id:txt; //文本对象的id
font.pointSize: 16; //设置文本的字体大小
text:"hello!"; //设置文本显示的内容
}
MouseArea //定义鼠标的处理对象
{
anchors.fill: parent; //鼠标可以在整个窗口中处理
acceptedButtons: Qt.LeftButton|Qt.RightButton; //定义接收鼠标的左键和右键事件
onClicked: //单击事件处理
{
if(mouse.button==Qt.LeftButton)
{
txt.text="hello LeftButton"; //改变文本的内容,提示信息
}
else if(mouse.button==Qt.RightButton)
{
txt.text="hello RightButton"; //改变文本的内容,提示信息
}
}
onDoubleClicked:
{
if(mouse.button==Qt.LeftButton)
{
txt.text="hello LeftButton Double"; //改变文本的内容,提示信息
}
else if(mouse.button==Qt.RightButton)
{
txt.text="hello RightButton Double"; //改变文本的内容,提示信息
}
}
}
二:键盘处理事件
按键属性是附加属性
实例:按下键盘上不同的方向键,文本会向不同的方向移动
Text //定义一个文本对象
{
x:50; //设置文本对象的位置
y:50;
id:txt; //文本对象的id
focus:true; //使文本获得焦点
font.pointSize: 16; //设置文本的字体大小
text:"hello!"; //设置文本显示的内容
Keys.onLeftPressed:x-=10; //根据按下的不同的按键,将文本移动到不同的位置
Keys.onRightPressed:x+=10;
Keys.onUpPressed:y-=10;
Keys.onDownPressed:y+=10;
}
三:锚布局
baseline:文本显示基线
实例代码:实现效果
矩形一 矩形的右边和父窗口的右锚线对齐 顶部和父窗口的顶部锚线对齐
矩形二 始终在父窗口的心锚线位置
矩形三 顶部与中心矩形的底部对齐 右锚线和中心矩形的左锚线对齐 并留4个像素的空
Window
{
visible: true; //设置窗口为可见的
width:480; //设置窗口的宽和高
height:320;
Rectangle //矩形1 矩形的右边和父窗口的右锚线对齐 顶部和父窗口的顶部锚线对齐
{
anchors.left: parent.Left; //右边与父窗口的右边对齐
anchors.top:parent.top; //顶部和父窗口的顶部对齐
width:50; //设置宽度和高度
height:30;
color:"red"; //设置颜色为红色
}
Rectangle //矩形二 始终在父窗口的心锚线位置
{
id:centerRect;
anchors.centerIn: parent;
width:80;
height:80;
color:"blue";
}
Rectangle //矩形三 顶部与中心矩形的底部对齐 右锚线和中心矩形的左锚线对齐 并留4个像素的空白
{
anchors.top:centerRect.bottom; //对齐中心矩形的底部锚线
anchors.right:centerRect.left; //对齐中心矩形的左边锚线
anchors.margins: 4; //四周留4个像素的空白
width:80; //设置宽度和高度
height:80;
color:"green"; //设置颜色
}
}
博文索引 持续更新中。。。