前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >PlantUML——程序员画架构图都靠它

PlantUML——程序员画架构图都靠它

作者头像
蛮三刀酱
发布2022-01-05 15:48:48
5.8K0
发布2022-01-05 15:48:48
举报

引言

作图可以说是程序员的必备技能,最近发现身边同学们主要还是在用 OmniGraffle、ProcessOn、draw.io 这类软件作图,用的过程中可以思考一下下面这些问题是否困扰了你:

  • 版本管理困难、团队协作困难、二次编辑困难:假如老文档中的设计图需要修改,是你画的还好就是找源文件得费点功夫,如果不是你画的那就别想找到源文件了,别指望可以二次编辑了,重画吧;
  • 作图效率不够高:如果希望作图质量保持一定的水准,又想画得快,多数人都做不到;
  • 强迫症患者经常把时间浪费在了对齐矩形、对齐间距上。

鉴于上述困扰,忍不住要向大家安利一下 PlantUML,上述问题迎刃而解。

1 PlantUML 简介

PlantUML 是一款开源的绘图工具,不,是绘图语言!所以它和 OmniGraffle 们并不是一个维度的东西。 PlantUML 优点多多:

  • 上手快:学习成本超低,部分场景(比如语雀中)甚至几乎没有学习成本;
  • 作图心智舒适:绝大多数情形不用关心布局、样式等问题,告别对齐矩形、调间距这种繁琐无意义的事情,我们只用把心里所想表达出来即可,心智自然;
  • 超强的可维护性:永远不用担心图的源文件丢了,它自己本身就是源文件,避免了文档维护的割裂;
  • 容易实现版本管理、团队协同;

具体语法没必要展开讲,和 markdown 一样简单,官网讲得非常清楚:https://plantuml.com

2 语雀 + PlantUML

语雀对 PlantUML 有非常好的支持,两者搭配食用更佳,编辑模式插入“文本绘图”即可开始作图:

在这里插入图片描述
在这里插入图片描述

一直强调学习成本超低,因为语雀提供了大量现成模板,照葫芦画瓢即可:

至此,你就已经能在语雀上画 UML 图了,上手真的很快,而且再也不用担心下次要修改图片找不到源文件了,换个人一样能修改,而且语雀的加持还有修改记录。

但如果你对脱离语雀如何单独使用 PlantUML 感兴趣,请接着往下看。

3 PlantUML 本地创作 + 远程渲染图片

如果有些站点没有支持 PlantUML 的渲染,那么需要先进行本地创作,再借助服务进行渲染,渲染后的图片链接可以随处使用,而创作的文本用 gitlab 之类的版本控制软件进行管理,便于团队成员共同维护图片的编辑。

3.1 本地编辑、预览

对于java开发者,则更推荐使用IDEA的插件PlantUml integration,这款插件渲染图片的速度比vscode的插件更快,每次渲染时间都有显示(测试结果简单的图只要100ms就能渲染好),以前渲染过的图都有缓存立马能加载出来。功能也会更多。

3.2 渲染图片

  • 源文件管理:假设你团队用 gitlab 管理团队文档,将创作好的 .puml 文件推送到远端,便于大家共同维护源文件
  • 生成图片:
    • 方式一(借助官网服务渲染):点击 gitlab 页面上的RAW按钮以生成 raw 的链接,将 raw 链接借助 PlantUML proxy 渲染服务生成最终的图片地址,这个 url 就可以自由引用了。代理服务地址的填写样式: http://www.plantuml.com/plantuml/proxy?cache=no&src=xxx
代码语言:javascript
复制
 方式一(借助官网服务渲染)示例:
 - 源地址:<https://github.com/viper140/painting/blob/main/plantuml/usecase/bank-domain.puml>
 - RAW地址:<https://raw.githubusercontent.com/viper140/painting/main/plantuml/usecase/bank-domain.puml>
 - 代理后的地址:<http://www.plantuml.com/plantuml/proxy?cache=no&src=https://raw.githubusercontent.com/viper140/painting/main/plantuml/usecase/bank-domain.puml>
  • 方式二(自搭建服务渲染):下载渲染服务 jar 包 https://plantuml.com/zh/download,本地启动,在 GUI 中选择要渲染的路径,这个设定比较奇怪,它会自动扫描路径下的所有可渲染文件自动生成目标图片,比如会把test.puml自动生成图片test.png

4 注意事项

  • PlantUML 官方不断有新特性迭代更新,比如图的主题样式,但语雀的 PlantUML 渲染能力并没有及时更新,为了兼容性,尽量还是别用些花里胡哨的特性,毕竟内容本身才是最重要的,好看的皮囊只能算锦上添花。

写在最后

当我跳出 PlantUML 的诸多优点,思考我追求的东西的本质是什么,其实就是用文本替代二进制文件,因为文本的可维护性强、易于团队协作、版本管理容易。

这里希望用 PlantUML 来描述设计图;再往早些看,尤其是研发人员喜欢用 markdown 来替代 word 甚至 excel 的最基础功能;再有,我个人会用 vscode 插件Markdown Preview Enhanced来做 ppt https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced。这些精神是一脉相承的。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2021-12-13 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 引言
  • 1 PlantUML 简介
  • 2 语雀 + PlantUML
  • 3 PlantUML 本地创作 + 远程渲染图片
    • 3.1 本地编辑、预览
      • 3.2 渲染图片
      • 4 注意事项
      • 写在最后
      相关产品与服务
      Prowork 团队协同
      ProWork 团队协同(以下简称 ProWork )是便捷高效的协同平台,为团队中的不同角色提供支持。团队成员可以通过日历、清单来规划每⽇的工作,同时管理者也可以通过统计报表随时掌握团队状况。ProWork 摒弃了僵化的流程,通过灵活轻量的任务管理体系,满足不同团队的实际情况,目前 ProWork 所有功能均可免费使用。
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档