Question

我正在尝试使用paperjs在画布上添加点文本。我能够在画布上创建点文本，但需要处理文本的拖动和调整大小。

scope.drawText = function () {
               var pointTextLocation = new p.Point(100,100);
                var myText = new p.PointText(pointTextLocation);
                myText.fillColor = 'red';
                myText.fontSize= 25;
                myText.content = 'Sample Text';
            };

是否可以使用paperjs在屏幕下方进行操作。

我在Google上找不到任何地方。请建议如何做？

Answer 1

可以（使用Item.scaling），但是您必须自己编写缩放框的代码（通过使用与鼠标和键盘事件交互的常规形状进行绘制）。这个手工缩放框将控制您的PointText.scaling和PointText.rotation属性。

缩放框的编码并不简单，也不难，而且我很遗憾地注意到，这经常是一个非常常见的问题，尚无标准解决方案（实现这种缩放框的解决方案太多）），据我所知，尚没有可依赖的良好代码段。

Answer 2

我已经更新了代码。我能够创建点文本并将其拖到画布中的其他任何位置。 check here

但是当我双击我必须编辑文本时。怎么做？

var pointTextLocation = new p.Point(x,y);

                var myText = new p.PointText(pointTextLocation);
                myText.fillColor = 'red';
                myText.fontSize= 25;
                myText.content = 'Sample Text';

                myText.onDoubleClick = function(event) {
                    this.fontSize= 50;
                }
                myText.onClick = function(event) {
                    if(this.selected){
                        this.selected= false;
                    }else{
                     this.selected= true;   
                    }

                }
                 myText.onMouseDrag = function(event) {
                    myText.position=event.point;
                }

paperjs pointtext onhover选择并调整大小

2 个答案: