Paper.js - 从 selectedItems 中获取第一个“选定项目”

Question

我正在尝试使用 Paper.js

构建图形编辑器

我想选择使用选择工具（Shift+单击或拖动一个选择框）。直接点击检测通过hit-testing完成，选择框通过getIntersection完成

• 如果是 Shift+Click，则它是第一个选定元素。使用HitResult 找到点击了哪个元素
• 如果它的selectionBox，选择框的first intersection?结果。

这个有可能吗？

我执行了一个 FOR 循环来获取 Paper.js selectedItems 数组中的所有元素，该数组返回画布上的所有选定项目。

我试过了：

var selected = paper.project.selectedItems;
var firstSelected = selected[0];

但这并没有返回我需要的东西。

上面的代码 sn-p 获取一个 array，它与首先选择哪个元素无关。 它只是从“最旧的绘制路径”开始对数组中的selectedItems 进行排序。

我需要的是找出第一个被选中的元素的方法。

• 第一个得到''touched(intersected)''的选择 矩形
• 或在Shift+Click 中单击的第一个 功能（通过点击选择多个元素）。

这样做的原因是我想在我的编辑器中添加 align-relative-to 功能。

为了获得正确的用户体验，用户必须能够将一个元素相对于他设置为“参考项”的另一个元素对齐。因此，我需要知道相对于其他元素选择的第一个元素，以便将其用作“参考项目”。

有什么想法吗？

Answer 1

Here 是我理解您想要为选择实现的工作示例（没有 align-relative-to 功能）。 这是代码（在 SelectPaperJS 下）https://c9.io/arthursw/oiio/

在Stylii 上制作类似的东西应该不会太难（因为你正在使用它）。

您可以有一个数组来跟踪您的项目的选择顺序。例如，在直接选择工具的 mousedown 函数中（来自 editor.js 的第 789 行），您可以将新选择的元素添加到此数组中（第 800 行）。使用矩形选择工具进行选择时也是如此。