VSCode 配置PlantUML绘制类图

1.概述

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

2.环境搭建

VSCode的安装比较简单,这里不再介绍。
配置PlantUML插件VSCode 配置PlantUML绘制类图_第1张图片
在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类图如下
VSCode 配置PlantUML绘制类图_第2张图片
具体类的成员变量及成员函数如下

@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之间不能有" ; " ,否则会生成错误。
生成图形为:
VSCode 配置PlantUML绘制类图_第3张图片

3.导出图像

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

4. 总结

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

附录

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

你可能感兴趣的:(环境搭建,c++)