it-swarm.cn

复制子树的交互设计

假设我们在UI中沿这两行显示了两个数据树A和B:

enter image description here

用户想要将突出显示的子树节点从A复制到B。这两个树具有一些共享节点,如ID所示。

您将如何设计这种情况下的交互?一种可能的方法是将复选框置于非共享节点旁边,并在两棵树之间放置一个“执行” /“复制”按钮,但这是选择不拖放时的最佳解决方案吗?

您对替代设计有什么想法吗?

6
agib

树是很自然的,允许您拖放到rearrange节点;但是,您似乎想要保留层次结构,而只是merge结果...

因此,仅识别差异然后允许用户选择/提交每个更改(插入,更新或删除)可能对应用程序很有帮助。

1
Nescio

除非缺少一些约束,否则我将使用拖放操作。

1
Hisham

像您建议的那样,对象选择动作语法是一种常见的标准GUI方法,如果您将其扩展到复制以外的其他命令(例如,删除,移动,属性),则很好用。这样就形成了一个简单,一致但功能强大的UI。但是,我不确定是否建议您选择复选框。假设用户通常一次只复制一个上级节点,我将模仿Windows Explorer等文件管理器中的行为,并使用默认情况下为单选的图标,但支持通过元键(Shift和Ctrl)进行多选拖动选择。选择一个节点应突出显示该节点及其所有子节点,以帮助使其清楚用户所选择的内容。 OTOH,如果用户通常需要复制多个未关联的节点,则最好使用复选框,尤其是当您不确定他们是否熟悉标准的多选方法时。

对象选择动作语法的替代方法是对象专用控件方法,其中为每个节点包括一个小的Copy控件。一键复制。如果复制是用户可以对节点执行的唯一操作,则这可能是首选。相反,为每个节点设置单独的“复制”,“移动”,“删除”,“属性”等控件可能会太混乱。如果使用object-dedicated-control,则只能为A中在B中具有共享节点的节点提供“复制”控件,以明确指示要复制的内容。

在您的示例中,复制功能似乎仅限于复制到树之间的共享节点。那确实是所有可以允许的吗?总有不止一棵目的树吗?如果是这样,则最好使用单个“复制”按钮,并且可以避免拖放。拖放具有较差的可发现性,并且比单击“复制”按钮更难。拖放操作还可能使用户认为他们可以执行任意复制(例如,在树A中将Node= 4放在树B中,Node= 树B周围的节点)。

但是,如果有可能并且有利于支持任意复制,则可以考虑使用两个按钮来使用“复制和粘贴”习惯用法(添加第三个“剪切”按钮以支持移动)。如果您支持任意复制,则值得考虑将拖放作为复制和粘贴的专家快捷方式。

1
Michael Zuschlag