Canvas-Editor表格行高定制化配置解析

在基于Canvas的富文本编辑器开发中，表格渲染是一个常见但具有挑战性的功能点。近期Canvas-Editor项目针对表格行高定制化需求进行了重要优化，允许开发者更灵活地控制表格单元格的最小高度，这对于需要紧凑布局的场景（如通讯录、数据报表等）具有重要意义。

核心配置参数

项目通过IEditorOption接口提供了两个关键配置项来控制表格行高：

1. tdPadding
   该数组参数控制表格单元格的内边距，格式为[上, 右, 下, 左]。默认值为[0, 5, 0, 5]，表示只在左右两侧保留5px的内边距。

2. defaultTrMinHeight
   定义表格行的最小高度基准值，默认设置为32px。这是控制行高的基础参数。

行高计算公式

实际渲染的表格行高度由以下公式决定：

最终行高 = tdPadding[0] + tdPadding[2] + 行内容高度 + (2 * rowMargin)

其中：

• tdPadding[0]和tdPadding[2]分别代表上下内边距
• 行内容高度由文字行高或图片等元素决定
• rowMargin是行间距的固定值

实际应用场景

1. 紧凑型表格
   当需要显示大量数据时，可通过减小defaultTrMinHeight（如设为20px）和调整tdPadding来创建更紧凑的布局。

2. 多行文本表格
   对于包含多行文本的单元格，保持适当的defaultTrMinHeight并增加下边距(tdPadding[2])可改善可读性。

3. 特殊布局需求
   通过精细调整四个方向的padding值，可以实现非对称的单元格间距效果。

最佳实践建议

1. 在定义最小行高时，需考虑字体大小，确保文字不会出现截断
2. 移动端显示时，适当增加行高以提高触摸操作的准确性
3. 对于纯文本表格，可以移除上下padding([0,5,0,5])获得最紧凑布局
4. 测试时需验证不同DPI屏幕下的显示效果

这项优化体现了Canvas-Editor对开发者友好性的持续改进，使得表格布局控制更加精细化和灵活化。