leafer-ui icon indicating copy to clipboard operation
leafer-ui copied to clipboard

手机端拖拽Group、Box等元素会有紫色选择框

Open zhaoweihan opened this issue 9 months ago • 3 comments

手机端拖拽Group、Box等元素,第一次会出现紫色选择框,无法去掉。 hitChildren在pc端有效,但在手机端无效。

第一次拖拽没有触发DragEvent.DRAG事件,出现了选择框,后面再次拖拽可以触发事件,不会出现选择框了。

new Box({
      x: (width - 2) / 2,
      y: 0,
      width: 2,
      height,
      zIndex: 10,
      draggable: 'x',
      hitChildren: false,
      dragBounds: {
        x: MIN_DRAG_WIDTH,
        y: 0,
        width: width - MIN_DRAG_WIDTH * 2,
        height,
      },
     event: {
        [DragEvent.DRAG]: () => {
       
        },
      },
    });

zhaoweihan avatar Apr 28 '25 11:04 zhaoweihan

请提供可以直接运行的复现代码

leaferjs avatar Apr 29 '25 00:04 leaferjs

请提供可以直接运行的复现代码 https://codepen.io/zhaoweihan/pen/PwwJdKg 这是可复现的代码。最开始view的dom元素宽高设置为0。等图片加载出来后重写宽高。最外层父元素是flex布局。在手机端第一次拖拽中间的元素就会出现紫色选择框,后面再拖拽就没有了。 ps.安卓手机好像因为页面内嵌iframe的问题,拖拽有卡顿,ios没有。可以使用ios复现。

zhaoweihan avatar Apr 30 '25 09:04 zhaoweihan

app = new App({
        view: 'canvas-leafer',
        fill: '#ffffff',
        editor: {
            editBox: false,
            select: false,
            boxSelect: false, // 是否启用框选功能, 拖动动作框
        },
        grow: true,
        pixelRatio: 3,
        touch: {
            preventDefault: true,
        },
    });

上面的代码里的boxSelect是否就是你要关闭的功能

shenxinbo avatar May 28 '25 08:05 shenxinbo