最近在做系统设计的时候,发现要画不少时序图,以前用的最顺手的工具是 draw.io,后来也尝试了语雀自带的画图工具,感觉画画简单的图还行,但是复杂一点的,就比较吃力了。

是一个多功能组件,可快速、直接地创建图表。用户可以使用简单直观的语言起草各种图表。
官方文档:https://plantuml.com/zh/
是一个开源工具,它允许我们用简单的文本描述来创建图,包括序列图、用例图、类图、对象图、活动图、组件图、部署图、状态图,以及时序图

除了图之外, 还支持一系列其他图表,例如 数据、数据、图表、架构图等等。的一大优势,是图表完全用文本代码描述,这就意味着它可以作为文档嵌入到源代码中,也非常方便版本控制和多人协作,不管是迭代设计、文档编写、系统建模,都能胜任。
为了便捷地使用 ,许多流行的和代码编辑器提供了集成的插件,如、、 等。插件提供了实时预览、语法高亮和图表导出等功能,能帮助我们更快捷,更高效地画图,整体上IDEA的插件用起来体验最好。
:比如 可以让我们直接在 IDE 中查看和编辑 PlantUML 图表

插件使用效果

VS Code:https://marketplace.visualstudio.com/items?itemName=jebbs.plantuml

插件使用效果:

我们先来看个最简单的例子,通过 和 就可以在参与者之间传递消息,不用明确声明参与者。

接下来,我们看看 时序图的一些具体语法。
我们使用关键字 来声明参与者,就可以对该参与者进行更多的控制。声明的顺序就是默认的显示顺序。我们也可以用这些关键字来声明参与者,给参与者设置不同的形状。
- (角色)
- (边界)
- (控制)
- (实体)
- (数据库)
- (集合)
- (队列)
我们还可以通过 as关键字重命名参与者。

默认的颜色比较单调,也可以通过来设置参与者的颜色:

在不同参与者之间,通过+ 来表示消息传递。
1.4.2.1 同步消息
同步消息: 同步消息文本

1.4.2.2 异步消息
异步消息:由发送者A指向接收者B,表示A发送后不需要等待B立即处理。
异步消息文本

1.4.2.3 返回消息
返回消息:通常从接收者返回到发送者,标识一个回应。
返回消息文本

1.4.2.4 自调用
自调用:一个参与者直接发送消息给自己,表示自我处理或运算。
自调用

1.4.3.1 生命线的激活与撤销
生命线的激活与撤销,可以用下面这些关键字来控制生命线的激活与撤销
- :显示参与者的活动状态开始
- :指示参与者的活动状态结束
- :用于表示参与者的生命线终结,通常表示对象生命周期的结束

1.4.3.2 生命线的嵌套与颜色
可以使用嵌套激活条来表示内部调用,并可以给生命线添加颜色

1.4.3.3 自动激活
在发送消息时自动显示激活条。

1.4.3.4 自动去激活
在接收回应时自动隐藏激活条

分组:用于逻辑上分组一系列交互

替代():表示基于条件的替代执行流程


在 中,我们可以对时序图的各个元素自定义颜色,比如参与者(actors)、对象(objects)、激活条(activation bars)等,来让我们的时序图更加美观。在声明元素时,可以直接指定颜色,格式为。颜色代码可以是不同的形式:
1.4.6.1 直接指定颜色
颜色代码可以是一个十六进制颜色值,也可以是预定义的颜色名称

1.4.6.2 使用 skinparam 设置颜色
除了直接为特定元素指定颜色外,还可以使用 全局设置时序图中的颜色。用这种方式更改元素的默认颜色比较方便

当使用 时,我们可以设置许多不同属性的颜色,如边框颜色(BorderColor)、背景颜色(BackgroundColor)、字体颜色(FontColor)和激活条颜色(SequenceGroupBodyBackgroundColor)。更多语法可以直接查看官方文档:顺序图的语法和功能,目前这些内容,已经足够我们常见的时序图需求了。
我们接下来看一个稍微完整一点的例子,在这个例子中,我们的需求,是要在原本的登录的基础上,引入Google登录。

版权声明:
本文来源网络,所有图片文章版权属于原作者,如有侵权,联系删除。
本文网址:https://www.mushiming.com/mjsbk/9429.html