xinglie / report-designer

⚡打印设计、可视化、标签打印、编辑器、设计器、数据分析、报表设计、组件化、表单设计、h5页面、调查问卷、pdf生成、流程图、试卷、SVG、图形元素、物联网、标签纸
https://xinglie.github.io/report-designer/
902 stars 232 forks source link

元素多选扩展 #74

Open xinglie opened 10 months ago

xinglie commented 10 months ago

基础的元素多选可参考:选择元素操作

除了使用鼠标拉框、按下Shift以及使用结构树进行元素多选外,后续设计器支持了如下的元素多选方式,让操作更便捷

同类多选

同类多选分为整体设计区中的同类多选区域设计区同类多选,部分元素添加了批量操作(所有元素均支持批量操作,后续会逐步为所有元素增加批量操作功能),当多选相同类型时,可批量设置这些元素相关的属性,在这种情况下,同类多选功能比较有用

整体同类多选

可以在要选中的元素上点击右键,选择全选所有同类或选中某些元素后,按下快捷键Alt+A进行选择

区域同类多选

当元素处于某个容器内时,可以在要选中的元素上点击右键,选择区域所有同类或选中某些元素后,按下快捷键Shift+Alt+A进行选择,这种选择只会选择已选中元素所属的设计区内其它元素

需要说明的是,同类多选支持先选中不同类型的元素,然后在此基础上对区域或所有与选中类型相同的元素进行选中操作,并不只针对单一类型

选中矩形内多选

考虑如下图中示例

image

如果我们已经选中了文本1,后续需要把其它的文本2文本8都选中,我们可以使用前面介绍的基础的元素多选方式进行选择,也可以使用如下的方式

文本1已经处于选中状态,我们只需要在按下Alt键时点击文本8即可,此时已选择的文本1和待选中的文本8会组成一个矩形,在按下Alt时,只要处于该矩形内的其它元素均会被选中

考虑如下图中示例

image

如果我们仍然先选中文本1,在选择文本10时,我们仍然按着Alt键,此时因为有容器的存在,会选中容器内的文本9,如果我们不想选择容器内的元素,就想选中容器怎么办?按之前的操作,先选中文本1,在选择文本10时,我们按着Shift+Alt键,此时将只选中外层的容器,而不再选择内部的元素

包含锁定元素

使用选中矩形内多选时,默认会排除锁定的元素,但有时候我们确实需要使用选中矩形内多选时,把锁定编辑的元素也选上该如何操作呢?

我们只需要在前述快捷键的基础上再按下Ctrl键即可,比如原来使用Alt时,则变成Ctrl+Alt或原来的Shift+Alt则变成Ctrl+Shift+Alt

这样就实现了包含锁定元素

xinglie commented 9 months ago

已选元素同类型

前述全部同类区域同类都是对整个设计区或所在单元格进行操作的操作,后续增加了选中矩形内多选允许我们快速选中某个区域内的元素

但有时候我们想在已选中的元素中快速获取某个类型的元素,排除掉其它元素,该如何操作?

首先我们对某个区域进行选中,无论您是用鼠标拉框选中还是使用前述的选中矩形内多选方式,然后在你想要的元素上点击右键,选择已选元素同类即可,这样就会把与鼠标下类型一致的元素选取出来。

已选元素同类的激活条件是:所有已选中的元素与鼠标下的元素类型相同需要超过2个以上

为什么需要选择同类元素?因为目前设计器对同类型的元素有批量操作,选中同类型的元素后方便进行批量处理。