乐于分享
好东西不私藏

这周没加新功能,但我把模板排版重写了一遍

这周没加新功能,但我把模板排版重写了一遍

本文字数:约 1100 字|阅读时间:3 分钟发布日期:2026-06-13版本:V1.1 更新公告


一、来自用户的留言

上周发完新增三个商务模板的文章后,有朋友留言:

💬 "发票模板导出之后,明细表格有时候会重叠,能修一下吗?"

能,当然能。

我点开代码一看,发现——

问题不只是发票模板一个。

合同模板的排版也有些小毛病。深浅色切换之后,某些文字颜色会变浅到看不清。PDF 导出的结果,有时候和预览看起来不太一样。

不是某一个模板的问题,是底层渲染逻辑的问题。


二、这周我做了什么

既然是底层问题,那就不能只打补丁了。

我把整个模板渲染逻辑,重新整理了一遍。


▎四项修复

① 深浅色模式统一

问题: 切换主题后,部分文字颜色变浅、表格线消失。

修复: 重构主题管理器,所有颜色从变量取值,不再硬编码。

效果: 不管深色还是浅色,所有模板都清晰可读。

② 合同排版修正

问题: 甲乙方信息对齐错位、条款列表缩进混乱、签章区域溢出页面。

修复: 重写合同模板的布局逻辑,区分"信息块 / 条款块 / 签章块"三段式。

效果: 排版恢复正常,符合合同文档规范。

③ 发票明细表格重叠修复

问题: 明细行数多时,表格会挤在一起。

修复: 重写表格渲染函数,强制每行最小高度,自动换行不溢出。

效果: 多行明细不会再挤在一起了。

④ PDF 导出一致性处理

问题: 预览和导出的效果有偏差。

修复: 预览和导出改为调用同一套渲染接口

效果: 你看到什么,导出就是什么。


三、"像截图"和"像文档",到底有什么区别?

关于第 ④ 项,我想多说一句。

很多人可能没注意过这个区别。

我用一张表对比一下:

维度
像截图的 PDF
像文档的 PDF
放大清晰度
❌ 模糊
✅ 锐利
文字可选中复制
❌ 不行
✅ 可以
全文搜索
❌ 不支持
✅ 支持
打印质量
⚠️ 一般
✅ 专业
文件本质
一张图
真正的文本

之前有些模板导出的 PDF,本质上就是一张图。

现在正在逐步变成真正的文本型 PDF。

还没全部改完,但至少发票模板先搞定了


四、这周的一点感受

修 Bug 和加功能,是两种完全不同的工作。

加功能的时候很爽。感觉自己很厉害,每天都有新东西可以晒。

修 Bug 的时候很苦。一个问题可能要花一整天,修完看起来和修之前没什么区别——但你知道它不一样了。

💬 用户不知道你修了什么,但他们能感觉到用起来顺不顺。