使用 TouchArea 来控制当其覆盖的区域被触摸或使用鼠标交互时会发生什么。
不属于布局时,其宽度或高度默认为父元素的100%。
export component Example inherits Window { width:200px; height:100px; area := TouchArea { width: parent.width; height: parent.height; clicked => { rect2.background = #ff0; } } Rectangle { x:0; width: parent.width /2; height: parent.height; background: area.pressed ? blue: red; } rect2 := Rectangle { x: parent.width /2; width: parent.width /2; height: parent.height; }}##属性
enabled
布尔值 默认:true
禁用时,TouchArea不会识别任何触摸或鼠标事件,它们会被传递到下面的元素。
import { Button, CheckBox } from "std-widgets.slint";
export component Example inherits Window { width:200px; height:100px;
VerticalLayout { Rectangle { Button { text: "Try to press me"; } TouchArea { enabled: event-blocker.checked; } } event-blocker := CheckBox { text: "Block Access"; } }}
注意
当 enabled 在 TouchArea 被按下时设置为 false,将使用 PointerEventKind.Cancel 调用 pointer-event,并且 pressed 和 has-hover 属性将重置为 false。
has-hover
布尔值 (out) 默认:false
当鼠标在 TouchArea区域上方时设置为 true。
mouse-cursor
枚举 MouseCursor 默认:第一个枚举值
鼠标悬停在 TouchArea 上时的鼠标光标类型。
MouseCursor
此枚举表示不同类型的鼠标光标。它是 CSS 中可用的鼠标光标的子集。 有关详细信息和图标,请参阅 MDN文档中的 cursor。 根据后端和使用的操作系统,单向调整大小的光标可能会被双向调整大小的光标替换。
default:系统的默认光标。none:不显示光标。help:表示帮助信息的光标。pointer:表示链接的指着手。progress:程序忙但仍可交互。wait:程序忙。crosshair:十字准线。text:表示可选文本的光标。alias:正在创建别名或快捷方式。copy:正在创建副本。move:要移动某些内容。no-drop:此处不能放置某些内容。not-allowed:不允许操作grab:某些内容可抓取。grabbing:某些内容正在被抓取。col-resize:表示列可以水平调整大小。row-resize:表示行可以垂直调整大小。n-resize:单向向北调整大小。e-resize:单向向东调整大小。s-resize:单向向南调整大小。w-resize:单向向西调整大小。ne-resize:单向东北调整大小。nw-resize:单向西北调整大小。se-resize:单向东南调整大小。sw-resize:单向西南调整大小。- **
ew-resize*:双向东西调整大小。 ns-resize:双向南北调整大小。nesw-resize:双向东北-西南调整大小。nwse-resize:双向西北-东南调整大小。
mouse-x
长度 (out) 默认:0px
由 TouchArea 设置为鼠标在其内的位置。
mouse-y
长度 (out) 默认:0px
由 TouchArea 设置为鼠标在其内的位置。
pressed-x
长度 (out) 默认:0px
由 TouchArea 设置为鼠标最后一次按下时的位置。
pressed-y
长度 (out) 默认:0px
由 TouchArea 设置为鼠标最后一次按下时的位置。
pressed
布尔值 (out) 默认:false
当鼠标在其上按下时由 TouchArea 设置为 true。
##回调
clicked()
单击时调用:在该元素上按下然后释放手指或鼠标左键。
double-clicked()
双击时调用。在该元素上短时间内按下并释放鼠标左键两次,或用手指完成相同的操作。clicked()回调将在 double-clicked()回调触发之前触发。
moved()
鼠标或手指已移动。仅当鼠标也被按下或手指继续触摸显示屏时才会调用。另请参阅 pointer-event(PointerEvent)。
pointer-event(event: PointerEvent)
PointerEvent
表示由窗口系统发送的指针事件。 此结构传递给 TouchArea元素的 pointer-event回调。
button(PointerEventButton):被按下或释放的按钮kind(PointerEventKind):事件的种类modifiers(KeyboardModifiers):事件期间按下的键盘修饰键
scroll-event(event: PointerScrollEvent) -> EventResult
当鼠标滚轮旋转或发生其他滚动手势时调用。 PointerScrollEvent 参数包含有关在哪个方向上滚动多少的信息。
PointerScrollEvent
表示由窗口系统发送的指针滚动(或滚轮)事件。 此结构传递给 TouchArea元素的 scroll-event回调。
delta_x(长度):水平方向的像素数delta_y(长度):垂直方向的像素数modifiers(KeyboardModifiers):事件期间按下的键盘修饰键
返回的 EventResult指示是接受还是忽略事件。被忽略的事件会转发给父元素。
EventResult
此枚举描述事件是被事件处理程序拒绝还是接受。
reject:事件被此事件处理程序拒绝,然后可能由父项处理accept:事件被接受,不会被进一步处理