VSCode 配置PlantUML绘制类图

1.概述

最近在绘制UML类图时,发现一个比较好用的绘制UML的工具PlantUML,因为项目使用的开发工具是VSCode,所以本文在VSCode上安装PlantUML插件来绘制UML类图。

2.环境搭建

VSCode的安装比较简单,这里不再介绍。
配置PlantUML插件![在这里插入图片描述](https://img-blog.csdnimg.cn/20210312153549591.png
在VSCode插件列表中选择PlantUML安装。
由于PlantUML的插件是 plantUML.jar,所以需要按张Java JDK来支持Java开发环境。
此外PlantUML只能生成sequence图,其它图需要依赖Graphviz引擎,否则会报错误如下:

Dot executable is /opt/local/bin/dot Error: File does not exist

安装JDK比较简单,可参考网上方法,这里不介绍
安装Graphviz,在Ubuntu环境下执行:

sudo apt-get update  #无此操作可能出现 E: Package 'graphviz' has no installation candidate 错误
sudo apt install graphviz

总结下,PlantUML需要安装:

  1. java JDK
  2. graphviz

2.绘制UML类图

首先新建一个*.wsd, *.pu, *.puml, *.plantuml, *.iuml的文件。此文件用于生成UML图形,执行ALT+D可生成对应的UML类图。
类的关系说明

泛化(继承) <|- -
关联 <- -
组合 *- -
聚合 o–
实现 <|- -
依赖 < . .

如:

@startuml
class1 <|-- class2:泛   化
class3 <-- class4:关   联
class5 *-- class6:组   合
class7 o-- class8:聚   合
class9 <|-- class10:实   现
class11 <.. class12:依   赖
@enduml

生成的uml类图如下
在这里插入图片描述
具体类的成员变量及成员函数如下

@startuml
class class1
{
    +void operation1();
    +int operation2(int i);

    -int attribute1;
    -char attribute2;
}

class class2
{
    +void operation1();
    +int operation2(int i);

    -int attribute1;
    -char attribute2;
}

class1 <|-- class2 
@enduml

注意class 与class之间不能有" ; " ,否则会生成错误。
生成图形为:
在这里插入图片描述

3.导出图像

VSCode完成后的绘图,可以导出多种格式,通过 Ctrl + Shift + P,打开命令面板,输入 Export Current Diagram 命令后选择图片格式后便可导出。

4. 总结

PlantUML采用这种写代码的方式来绘制UML类图,相比于传统其他需要拖动对应图像控件,编辑类成员函数及变量的方式,效率提升很多,必竟我们直接可以从头文件中复制出类的声明,而无需在控件上一条一条的编辑。

附录

推荐比较好的学习plantUml语法的网站:
https://plantuml.com/zh/

  • 8
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
VSCode中快速生成类图的方法如下: 1. 首先,在VSCode中安装插件"PlantUML"。 2. 在Java项目目录下创建一个.sh文件,比如命名为aa.sh。 3. 在aa.sh文件中,使用以下命令生成aa.puml文件: ``` find . -name '*.java' | xargs cat | \ awk -vRS='{' 'match($0,/public\s+((class|interface).+(extends|implements).+$)/,a){print a\[1\] "#" }' | \ awk -vRS="" '{gsub("\n"," ");print}'| awk -vRS="" '{gsub("#","\n");print}' > aa.puml ``` 这个命令会找到项目中的所有Java文件,并将其内容合并为一个字符串。然后,使用正则表达式匹配类名或接口名,并输出到aa.puml文件中。 4. 编辑aa.puml文件,在开头和结尾各添加一行: ``` @startuml uml @enduml ``` 其中,"uml"是生成的图片名称。 5. 在命令行中运行以下代码,生成类图图片: ``` java -DPLANTUML_LIMIT_SIZE=25000 -jar path_to_plantuml\plantuml.jar java_proj_dir\aa.puml ``` 这个命令会使用PlantUML生成一个长为25000像素的uml.png图片。你可以根据需要调整图片大小,直到完全包含类图。 请注意,如果在执行第4步时出现错误,提示某个行中有文字错误,你可以尝试删除aa.puml文件中的`<>`及其内的内容,然后再次执行命令。 希望这些步骤能帮助你在VSCode中快速生成类图。 #### 引用[.reference_title] - *1* [在vscode中生成java类图](https://blog.csdn.net/xuex_chen/article/details/129301724)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [VSCode使用plantuml插件快速生成java项目uml类图【从springboot项目快速绘制UML类图】](https://blog.csdn.net/qq_37746855/article/details/124798124)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [前端提升开发效率之vsCode 快速生成自定义模板](https://blog.csdn.net/Sanzhutech/article/details/117991302)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值