SpreadJSV14.2.0新特性解析 - 设计器Toolbar模式

星光点

本帖最后由 Derrick.Jiao 于 2021-10-21 16:29 编辑

在14.2之前，部分用户觉得设计器的工具栏比较大，在一些小屏或者移动端设备上使用可能会占用较大的地方，视觉以及使用体验上都不佳。在14.2我们提供了一个新的配置来支持移动设备的工具栏功能区。这是整体效果，名为ToolBarModeConfig。

在开始介绍ToolBarModeConfig之前，我们先来看下DefaultConfig和ToolBarModeConfig的区别。我们可以看到在外层结构上两者是一致的。

核心就是ribbon的变动。我们把原有defaultconfig里ribbon的内容放到panels里面，并且在ribbon下添加一个ribbonHeight属性来指定整个toolbar的高度。

为了支持toolbar工具栏，我们对config做了以下升级：

1、对于命令的options，我们支持用公式表达式来实现。

2、支持溢出情况下的布局和命令优先级

3、升级工具栏，使其支持高度的自定义

4、升级容器模型——支持下拉容器模型和组容器模型

5、从命令中移除所有的子命令，取而代之的是使用不同容器来显示组或者下拉式布局

6、添加一些新的状态在不同的配置下去区分不同的布局。

inDropdown(是否是下拉命令)

isToolbarMode(是否是toolbarMode)

ribbonHeight(工具栏高度)

toolbarHeight(toolbar高度)

这些状态我们都是可以通过getData去获取以及setData去设置

7、在congfig和命令中添加新的options

在接口上，暴露了一个GC.Spread.Sheets.Designer.ToolbarModeConfig的命名空间。

关于Toolbar的使用以及demo，可以参考这篇帖子。

https://gcdn.grapecity.com.cn/showtopic-132649-1-1.html

星光点 · 星光点

inDropdown， isToolbarMode， ribbonHeight， toolbarHeight这几个都是什么意思，怎么使用呢

Derrick.Jiao · Derrick.Jiao

星光点发表于 2021-10-21 16:33
inDropdown， isToolbarMode， ribbonHeight， toolbarHeight这几个都是什么意思，怎么使用呢

可以简单理解为是一种状态或是我们提前定义好的一个变量。分别代表，是否在下拉命令中，是否是toolbarmode，ribbon（工具栏）的高度，toolbar的高度。

你可以到设计上用designer.getData("inDropdown")试下获取的值。要修改这些值可以用desinger.setData image.png130184935.png