Closed cbly666 closed 1 week ago
如下图,我新增加了一个Box内包含的Text,主要想实现Text外有边框或矩形框内有文本功能,代码如下: const item = new Box({ stroke: 'black', button: true, children: [ { tag: 'Text', width: 100, height: 25, text: '我是文本框', fill: 'black', padding: [5, 5], textAlign: 'center', verticalAlign: 'middle' } ] }) 效果如下:
const item = new Box({ stroke: 'black', button: true, children: [ { tag: 'Text', width: 100, height: 25, text: '我是文本框', fill: 'black', padding: [5, 5], textAlign: 'center', verticalAlign: 'middle' } ] })
但是在拖拽这个item时,比较大的概率会出现下面这种情况,即文本与边框分开了,只拖动了Box,Text未跟着一起移动位置。
我好像找到问题了,是我拖拽结束时,鼠标位置在Text上拖拽时,不应该使用e.target.dropTo方法, 应使用e.current.dropTo方法。 因为e.target对像是Text,而e.current对象是整个Box。
如下图,我新增加了一个Box内包含的Text,主要想实现Text外有边框或矩形框内有文本功能,代码如下:
const item = new Box({ stroke: 'black', button: true, children: [ { tag: 'Text', width: 100, height: 25, text: '我是文本框', fill: 'black', padding: [5, 5], textAlign: 'center', verticalAlign: 'middle' } ] })
效果如下:但是在拖拽这个item时,比较大的概率会出现下面这种情况,即文本与边框分开了,只拖动了Box,Text未跟着一起移动位置。