用代码画时序图!YYDS
前言
最近通过代码来画时序图,UML用例图,感觉很不错,所以给大家分享一下。
日常开发,一般在设计阶段,我们都需要画时序图、用例图等等。大家平时画图的时候,是用draw.io
还是processOn
呢?用它们画出的图,其实都很挺好看的。但是呢,今天田螺哥介绍一个款开源的画图神器!用代码就能画图,配合IDE
使用,画图高效简单,信手拈来,还挺美观的。这个神器就是PlantUML
。
1. PlantUML 简介
PlantUML是一个开源项目,可以快速编写UML图的工具。它可以支持编码的方式来生成图形。可以用来画时序图、UML用例图、类图、思维导图、ER图等等。
PlantUML 画出来的图,简洁美观,先给大家看看,一个用PlantUML画出来的登录时序图,以及对应画图的代码,如下:
/*** 关注公众号:键捡田螺的小男孩*/
@startuml
title Sequence Diagram of User login
actor User as userparticipant "gateway" as gateway
participant "user-core" as userCore
database "MySQL" as mysql
database "Redis" as redisautonumber
user-> gateway:login request,param:username,password
activate gateway
gateway-> userCore:forward the login request
activate userCore
userCore-> userCore :check the login param
userCore-> mysql:query user info from mysql by username
activate mysql
mysql-> userCore:response with username and password
deactivate mysql
userCore->userCore:compare the requested password with the DB's password
userCore-> userCore: generate an unique token
userCore--> redis: save the token to redis
userCore-> gateway: response with the token
deactivate userCore
gateway-> user: login success with the token
deactivate gateway
@enduml
登录用例时序图如下:
2. PlantUML的安装使用
PlantUML的安装很方便的.有个插件,名字是:PlantUML Integration
,大家可以去IDE的插件市场,搜索安装即可,如下:
安装成功后,想快速体验一般的话.可以新建一个项目,然后新建一个plantUML File文件,然后把我上个小节,登录时序图那个代码复制进去,就可以看到登录时序图啦.
(如果是非时序图,希望即时展示,需要安装下Graphviz
哈)
3.如何用PlantUML 画时序图
什么是时序图?
时序图(Sequence Diagram),又名序列图、循序图,是一种UML交互图。它通过描述对象之间发送消息的时间顺序显示多个对象之间的动态协作。它可以表示用例的行为顺序,当执行一个用例行为时,其中的每条消息对应一个类操作或状态机中引起转换的触发事件。
如何用PlantUML画时序图呢?
你可以先新建一个PlantUML文件
然后选择Sequence,并定义一个文件名称
就会有默认的时序图生成啦.
我们照着登录时序图的代码,来大概说下每个关键词的意思吧.
/*** 关注公众号:键捡田螺的小男孩*/
@startuml
title Sequence Diagram of User login
actor User as userparticipant "gateway" as gateway
participant "user-core" as userCore
database "MySQL" as mysql
database "Redis" as redisautonumber
user-> gateway:login request,param:username,password
activate gateway
gateway-> userCore:forward the login request
activate userCore
userCore-> userCore :check the login param
userCore-> mysql:query user info from mysql by username
activate mysql
mysql-> userCore:response with username and password
deactivate mysql
userCore->userCore:compare the requested password with the DB's password
userCore-> userCore: generate an unique token
userCore--> redis: save the token to redis
userCore-> gateway: response with the token
deactivate userCore
gateway-> user: login success with the token
deactivate gateway
@enduml
关键词解释如下:
title
:表示该UML用例图的标题actor
:表示人形的参与者as
: 使用as 关键字命名参与者。你可以把它理解成定义变量一样,as后面跟着的就是变量,声明后,我们后面就可以使用这个变量啦participant
:表示普通的参与者,它跟actor的主要区别是:形状不一样database
:表示参与者形状是数据库.显示的顺序是怎么定义的:声明的参与者顺序将是(默认的)显示顺序。
autonumber
:可以给参与者添加顺序->
:表示绘制两个参与者之间的信息,如果你希望是虚线,可以使用-->
.activate
和deactivate
:表示参与者的生命线
当然,PlantUML
功能挺丰富的,它还可以组合消息,虽然在我的登录时序图还没体现出来. 它提供了alt/else、opt、loop
来组合消息.如下:
@startuml
Alice -> Bob: 认证请求alt 登录成功Bob -> Alice: 认证接受else 某种失败情况Bob -> Alice: 认证失败group 我自己的标签Alice -> Log : 开始记录攻击日志loop 1000次Alice -> Bob: DNS 攻击endAlice -> Log : 结束记录攻击日志endelse 另一种失败Bob -> Alice: 请重复end
@enduml
对应的时序图如下:
4. 如何用PlantUML 画UML用例图
什么是用例图?
用例图(英语:use case diagram)是用户与系统交互的最简表示形式,展现了用户和与他相关的用例之间的关系。通过用例图,人们可以获知系统不同种类的用户和用例。用例图也经常和其他图表配合使用。
如何用PlantUML画UML用例图呢?
你可以先新建一个PlantUML文件,然后选择user case,并定义个文件名
就会有默认的UML用例图生成啦
我挑官网一个用例图demo来介绍吧,代码如下:
@startuml
left to right direction
actor Guest as g
package Professional {actor Chef as cactor "Food Critic" as fc
}
package Restaurant {usecase "Eat Food" as UC1usecase "Pay for Food" as UC2usecase "Drink" as UC3usecase "Review" as UC4
}
fc --> UC4
g --> UC1
g --> UC2
g --> UC3
@enduml
对应生成的用例图如下:
来看下每个关键词的意思:
left to right direction
:表示从左到右绘制用例图actor Guest as g
:定义一个人形参与者,变量别名是g.package Professional
:定义一个包package
,名字为Professional
.package
可以用来对用例和角色分组.usecase "Eat Food" as UC1
:定义一个用例,别名为UC1
.fc --> UC4
:表示角色fc
和用例UC4
关联起来.角色和用例之间的关系,用-->
来表示。
5. 如何用plantUML 画思维导图
什么是思维导图?
英文是The Mind Map,又名心智导图,是表达发散性思维的有效图形思维工具 ,它简单却又很有效同时又很高效,是一种实用性的思维工具。
写了一个简单的思维导图,代码如下:
@startmindmap
* 公众号:捡田螺的小男孩,干货面试题
** 计算机网络面试题
*** TCP/IP十五连问
*** 两万字计算机面试题汇总
** MySQL面试题
** Redis面试题
** 大厂面试真题
*** 虾皮十五连问
*** 五年Oppo后端面试真题
*** 腾讯云十五连问
@endmindmap
plantUML画思维导图,还是挺简单的,大家可以看下效果
6. 如何用planUML 画活动流程图
什么是活动图?
动态图(activity diagram,活动图)是阐明了业务用例实现的工作流程。
我画了一个简单版的登录活动流程图:
@startuml
title Activity Diagram of User loginstart
:user request login;
if (is request param null?) then (N):query user info by username;if (is user info null ?) then (N):compare the password;if (Is password right?) then (Y):generate a token ,and set it to redis;:response with login success;else(N):response with wrong password code;stopendifelse(Y):response with error userinfo;stopendif
else(Y):response with error param;stopendif
stop
@enduml
生成的流程图如下:
活动图关键解释如下:
start
表示活动图流程的开始stop
表示活动图流程的结束:user request login;
:表示活动流程节点为user request login
,需要加:
和;
的哈if+then+endif
表示一个完整的条件判断
推荐
Java面试题宝典
技术内卷群,一起来学习!!
PS:因为公众号平台更改了推送规则,如果不想错过内容,记得读完点一下“在看”,加个“星标”,这样每次新文章推送才会第一时间出现在你的订阅列表里。点“在看”支持我们吧!
用代码画时序图!YYDS相关推荐
- 用代码画时序图!绝了!
日常开发,一般在设计阶段,我们都需要画时序图.用例图等等.大家平时画图的时候,是用draw.io还是processOn呢?用它们画出的图,其实都很挺好看的.但是呢,今天田螺哥介绍一个款开源的,画图神器 ...
- 在线画时序图的工具:Web Sequence Diagrams ,支持实时生成预览图
因为工作需要,这两天在尝试着给手里壹些模块画时序图(Sequence Diagrams),壹般画这种图的时候,我们第壹反应会想到安装 IBM 的 Rational Rose,但是我不想为了画这种图就去 ...
- Markdown如何画时序图,一篇就够了
文章目录 markdown 如何画图 1. 时序图 1.1 时序图介绍 1.2 参与者 1.2.1 画法1(不带昵称) 1.2.2 画法2(使用参与者别名) 1.3 消息 1.4 激活框 1.5 注释 ...
- Intellij IDEA中安装使用PlantUML画时序图、类图等
转载自 https://www.jianshu.com/p/a6bd7e3048ef 一.在Intellij安装PlantUML插件 在菜单栏Intellij IDEA打开插件安装窗口(版本不一样,可 ...
- 【实用工具】Visio画时序图组件
本文由FPGA爱好者小梅哥编写,未经作者许可,本文仅允许网络论坛复制转载,且转载时请标明原作者. Visio画时序图组件,实用方法很简单,下载,解压,然后放到一个固定的位置,Visio默认的查找位置为 ...
- uml画时序图操作步骤
本人使用的是staruml工具,下载地址:https://share.weiyun.com/5HtcSvV 在日常工作中,不管是需求分析.流程设计.源码解读,通过uml工具画时序图都是一个很有效的辅助 ...
- 用viso画时序图(使用步骤)
在进行时序分析时,常常需要画出时序图来更直观的观察 下面就说明怎样使用viso画时序图(版本2016) 1.打开viso,新建一个空白绘图,点击创建 2.按照下图点击更多形状->工程->电 ...
- 画时序图你用什么软件?
软件设计时序图制作工具 在软件设计过程中,经常会使用到时序图来表达模块之间的交互.信息传递的动态行为或者其他软件逻辑.时序图可以清晰第表达软件层面的设计,甚至毫不夸张说是"一图顶千言&quo ...
- 用R画时序图、(偏)自相关图
画时序图 install.packages("readxl") library(readxl)te <- read_xls("D:/data/Rdata/tsdat ...
最新文章
- 编辑数学公式_LaTeXiT for mac(数学公式编辑器)
- vs2008中js的语法提示及修正功能(downmoonn)
- 源代码安装-非ROOT用户安装软件的方法
- 列表框QListWidget类
- oracle最佳环境,创建最适合的Oracle运行环境
- RGB与YUV相互转换
- Training a classifier
- [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify uniq
- 一步步编写操作系统 16 显卡概述
- linux内核学习笔记【一】临时内核页表 Provisional kernel Page Tables
- 【回文串10】LeetCode 479. Largest Palindrome Product
- vc2012编译speex (编译通过)
- Linux网络-MAC协议
- 【Echarts】三维地图叠加柱状图
- 烧毁DC/DC电路问题
- 微信小程序一定要设置服务器域名,微信小程序 设置域名 必须是https么
- CocosCreator之Tween缓动动画
- STM32学习笔记(11)电容触摸按键
- 从前端技术到体验科技(附演讲视频)
- 怎么给旧版本ios装旧版本软件
热门文章
- 分享一个电商、微商的得力助手
- linux安装docker
- mount命令挂载时出现libuuid.so.1 : no version information available
- 程序中调用CMD,运行命令或启动子程序
- 论文笔记:Densely Connected Convolutional Networks(DenseNet模型详解)
- 传说中的护眼灯真的能护眼吗?护眼台灯怎么样选择比较好
- SpringMVC对JSP的支持---Spring的JSP标签库---Spring通用标签库
- BS 476-33 标准的产品适用范围
- 20160126.CCPP体系详解(0005天)
- 解决Windows资源保护找到了损坏文件但无法修复的问题