Konva在图层之间传播事件

Konva在图层之间传播事件

本文介绍了Konva在图层之间传播事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

限时删除!!

我在形状层的顶部有一个透明的拖动层.可以很好地使交互变得独特,因此我可以切换拖动的功能(在滚动视图或编辑形状位置之间).但是,除非我关闭拖动模式(通过隐藏中间的透明Rect),否则其他鼠标悬停事件都不会触发其下方的形状层.我需要将非拖动鼠标事件传播到它下面的层.鼠标悬停事件有很多形状.

I have a transparent drag layer on top of a shape layer. Works great to make interaction distinct so I can toggle what dragging does (between scrolling the view or editing the shape positions). However, unless I turn off drag mode (by hiding the intervening transparent Rect), none of the other mouseover events fire on the shape layer beneath it. I need to propogate the non-drag mouse events to the layer below it. There are A LOT of shapes with mouse over events.

是否有一种简便的方法将鼠标悬停在事件下方的层上,还是需要编写一个自定义处理程序来触发每种形状的事件?

Is there an easy way to propogate the mouse over events to the layer beneath it or do I need to write a custom handler to fire events for every shape?

推荐答案

我设法解决了这一问题,而不必在层之间传播事件.仅当未单击形状时,才在形状图层上的形状后面放置可拖动的表面.然后,在形状dragstart事件上,如果设置了layerdraggable标志,则要覆盖是否单击了形状,我将在形状上执行stopDrag(),在层上执行startDrag().这使我可以使用简单的标志切换,是要拖动整个图层还是仅拖动形状.

I managed to solve this without having to propagate events between layers. I put a draggable surface behind the shapes on the shape layer only if a shape isn't clicked. Then to cover if a shape is clicked, on the shape dragstart event, if a layerdraggable flag is set, I do a stopDrag() on the shape and a startDrag() on the layer. This allowed me to toggle with a simple flag whether I want the whole layer dragging, or just the shape.

我必须在dragend事件中清理一下形状的位置,但是您也可以在形状的拖拽中做到这一点.

I had to clean up a little of the shape position on the dragend event, but alternatively you can do that with a dragbounds on the shape.

shape.on('dragstart', function () {
    if (layerDraggable) {
        shape.stopDrag();
        shapeLayer.startDrag();
    }
}

这篇关于Konva在图层之间传播事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

1403页,肝出来的..

09-06 10:43