用PlantUML和语雀画UML类图

概述

首先阐述一下几个简单概念：

  • UML：是统一建模语言（Unified Modeling Language）的缩写，它是一种用于软件工程的标准化建模语言，旨在提供一种通用的方式来可视化软件系统的结构、行为和交互。UML由Grady Booch、Ivar Jacobson和James Rumbaugh三位软件工程专家在1990年代初共同开发，并在1997年被对象管理组织（Object Management Group, OMG）正式采纳。
  • PlantUML：是一个开源工具，它允许我们用文本形式来描绘和创建UML图。在VSCode中可以安装扩展来绘制，而在语雀的MarkDown编辑器中，则可以用“文本绘图”形式直接在文档中创建。
  • UML类图：在面向对象语言或开发中类图是最基础也最有用的一种图，它可以描述类的成员以及多个类之间的关系。

在Godot中，我们使用GDScript进行游戏或类库开发时，也需要涉及面向对象开发和类图等，用于清晰表达自己的思路或详实自己的文档。

因为语雀文档内部创建更方便，所以本文主要介绍在语雀中绘制UML类图的方式。

在语雀中创建PlantUML类图

在语雀文档中，在任意一行行首输入“/wbht”，可以找到“文本绘图”，回车即可插入“文本绘图”的Block。
image.png
默认插入的“文本绘图”块如下：
image.png
点击顶部的“模板”，在下拉列表中选择“类图”：
image.png
会自动填充和渲染一个如下的类图：
image.png
我们便可以在这个基础上进行UML类图的绘制。

PlantUML类图基础语法

起止标记

首先是起止标记，绘图描述的内容必须包裹在一对@startuml和@enduml标记之间。

@startuml

@enduml

申明元素

在@startuml和@enduml标记之间，我们可以使用特定的语法来申明类图的元素。PlantUML本身支持很多种元素申明，详见：类图的语法和功能
但在GDScript中最常用到的便是类和枚举，其他的元素类型并不支持。

@startuml
class a
enum skills
@enduml

其中：

  • 以class为关键字，后面跟类名，可以声明一个类；
  • 以enum为关键字，后面跟枚举名，可以声明一个枚举；

上面代码生成的类图如下：
在这里插入图片描述

添加类或枚举的成员

以类为例，我们可以使用:（注意前后都有一个空格）来为申明的类添加成员，名称不带()的被视为是属性，带()的被视为是方法。

@startuml
class a
a : name
a : sex
a : age
a : say_hello()
@enduml

上面的代码生成的类图如下：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1zKGwWHp-1720151404747)(https://i-blog.csdnimg.cn/direct/e94e04d6b32e4fe0ada960213df64dba.png)]

也可以用花括号语法：

@startuml
class a{
    name
    sex
    age
    say_hello()
}
@enduml

这样的写法更接近于真实代码的形式，可以省去重复的类名和:。

申明成员类型

可以为类的成员申明数据类型。

@startuml
class a{
	String name
	bool sex
	int age
	void say_hello()
}
@enduml

可以采用C风格的前置类型声明：
在这里插入图片描述

也可以采用类似GDScript的冒号后置类型申明形式：

@startuml
class a{
	name:String 
	sex:bool
	age:int
	say_hello():void
}
@enduml

在这里插入图片描述

设定成员的可访问性

类图可以更具体的标记属性和方法的可访问性，也就是private、protected、public，如果是C++之类的或许可以用上，但是在GDScript中并不涉及这部分。
下面是具体的修饰符和意义。

字符图标(属性)图标(方法)可访问性
-private 私有
#protected 受保护
~package private 包内可见
+public 公有

下面是一个简单的例子：

@startuml
class a{
	+name:String 
	-sex:bool
	~age:int
	+say_hello():void
}
@enduml

绘制效果如下：

在这里插入图片描述

表示静态变量或方法

Godot3.x就支持静态函数，Godot4.x更是支持了静态变量。
在PlantUML类图中我们可以精确的表示静态函数和静态变量成员，以与非静态成员区分。
方法也很简单就是在静态成员之前添加{static}修饰符。

@startuml
class a{
	+ {static} name:String 
	-sex:bool
	~age:int
	+{static}say_hello():void
}
@enduml

绘制效果如下：
在这里插入图片描述

可以看到静态成员的名称下添加了下划线。

使用分隔线对成员进行自定义分组

可以在成员之间用--、..、==、__进行自定义分割线的绘制

@startuml
class a{
	ame:String 
	--
	sex:bool
	==
	age:int
	..
	say_hello():void
	__
	say_yes():void
}
@enduml

实际效果如下：
在这里插入图片描述

可以看到：

  • --是一条比较粗的横线，__是一条比较细的横线
  • ==是双横线
  • ..是虚线

你也可以在分割线基础上进行分组的命名。

@startuml
class a{
	ame:String 
	-- 性别  --
	sex:bool
	== 年龄 ==
	age:int
	.. 方法 ..
	say_hello():void
	__ 还是方法 __
	say_yes():void
}
@enduml

绘制效果如下：
在这里插入图片描述

这样我们可以将成员进行分组，让类的结构更清晰易懂。

多个类之间的关系表示

关系类型符号绘图
泛化关系<|–
组合关系*–
聚合关系o–
  • --代表实线，可以用..替代表示虚线。
  • <|、*和o分别代表箭头的类型

类与类之间的关系可以查阅相关的视频或文档，这里不做赘述，这里只举例说明继承关系的表示。

@startuml
Car <|-- Bus
@enduml

这里我们直接省略class关键字，申明了Car和Bus两个类，并且使用<|--连接它们。
生成的类图如下：
在这里插入图片描述

它的含义就是，Car作为父类，Bus作为子类，Bus继承自Car。

  • 新手注意：继承关系的箭头是由子类指向父类。

我们可以继续这个例子，添加Car的其他子类型：

@startuml
Car <|-- Bus
Car <|-- motorcycle
Car <|-- bicycle
@enduml

生成类图如下：
在这里插入图片描述

在箭头连线上添加文本

可以在整个箭头连线关系的最后，在:后面添加文本信息，用于显示在连线上。

@startuml
Car <|-- Bus:继承自
Car <|-- motorcycle:继承自
Car <|-- bicycle:继承自
@enduml

生成类图如下：
在这里插入图片描述

表示类之间的数量关系

也可以用双引号，在连线的起始端和末尾端添加文本，用于表示类似ER（实体关系图）中的“一对一”、“一对多”、“多对多”等关系。
在继承关系中可能使用这种描述不太恰当，可以在“组合”或“聚合”等关系中使用。
下面的代码表示，一个汽车有4个轮子组成：

@startuml
汽车 "1" *-- "4" 轮子:组成
@enduml

生成类图如下：
在这里插入图片描述

控制类绘制的位置

在连线之间可以使用up、down、left和right关键字来手动控制类的绘制位置。
以之前的Car派生的例子为例：

@startuml
Car <|-- Bus:继承自
Car <|-- motorcycle:继承自
Car <|-- bicycle:继承自
@enduml

默认绘制为：
在这里插入图片描述

通过在表示实线的--之间，指定上下左右方位的关键字：

@startuml
Car <|-left- Bus:继承自
Car <|-up- motorcycle:继承自
Car <|-right- bicycle:继承自
@enduml

就可以将类图渲染为如下形式：
在这里插入图片描述

绘制备注

note关键字用于绘制备注。
可以使用note 位置 of 元素的形式，为类、枚举或者其他类图元素设定备注。

@startuml
Car <|-left- Bus:继承自
Car <|-up- motorcycle:继承自
Car <|-right- bicycle:继承自

note bottom of Car:车，基类
note bottom of Bus:公共汽车
note bottom of bicycle:自行车
note left of motorcycle:摩托车
@enduml

绘制效果如下：
在这里插入图片描述

还有一种写法，可以省略of 元素，但是需要紧跟在class申明之后，或者指定两个类的关系之后。

@startuml
class Car
note bottom:车，基类

Car <|-left- Bus:继承自
note bottom:公共汽车

Car <|-up- motorcycle:继承自
note left:摩托车

Car <|-right- bicycle:继承自
note bottom:自行车
@enduml

绘制效果如下：
在这里插入图片描述

可以看到效果基本上无异。
还可以用note "备注内容" as 变量形式将备注申明为一个类似单独元素的东西。
再使用--或..进行连接：

@startuml
class Car
note "车，基类" as N1
Car -- N1
@enduml

效果如下：
在这里插入图片描述

另外，在备注中，可以使用\n进行多行文本的换行控制。

为类图添加标题

使用title关键字可以为类图添加标题。

@startuml
title 车类的继承关系类图
Car <|-left- Bus:继承自
Car <|-up- motorcycle:继承自
Car <|-right- bicycle:继承自

note bottom of Car:车，基类
note bottom of Bus:公共汽车
note bottom of bicycle:自行车
note left of motorcycle:摩托车
@enduml

绘制效果如下：
在这里插入图片描述

为类图添加页脚

如果你不喜欢顶部的标题，可以使用footer关键字指定一个底部的页脚。

@startuml

Car <|-left- Bus:继承自
Car <|-up- motorcycle:继承自
Car <|-right- bicycle:继承自

note bottom of Car:车，基类
note bottom of Bus:公共汽车
note bottom of bicycle:自行车
note left of motorcycle:摩托车
footer 车类的继承关系类图
@enduml

绘制效果如下：
在这里插入图片描述

Godot中的一些类图实例

上面我们已经学习了如何用PlantUML进行类图的绘制。下面就举一些Godot中的例子。

子类与父类（继承关系）

@startuml

Control <|-- Button
note bottom:泛化关系（继承关系）\n子类指向父类，\n实线空心三角箭头

@enduml

绘图效果：
在这里插入图片描述

成员引用（一般关联关系）

@startuml

class class01{
	attr:class02
}

class01 --> class02
note bottom:单向关联关系\n引用者指向被引用者

class class03{
	attr:class04
}

class class04{
	attr:class03
}

class03 -- class04
note bottom:双向关联关系\n箭头消失

class class05{
	sub_itm:class05
}

class05 --> class05
note bottom:自关联关系\n自己的成员变量引用自己

@enduml

绘制效果：
在这里插入图片描述

部分与整体（聚合与组合）

@startuml

class Player {
}
note left:玩家
Player -up-|> CharacterBody2D
Player o-- CollisionShape2D
note bottom:碰撞形状
Player o-- Sprite
note bottom:玩家长相
@enduml

绘制效果：
在这里插入图片描述

更复杂的可以有：

@startuml
title Godot中2D角色的节点组成结构（2）
class Player {
}
note left:玩家
Player -up-|> CharacterBody2D
Player o-- CollisionShape2D
note bottom:碰撞形状
Shape2D <-down- CollisionShape2D
Player o-- HitBox
note bottom:攻击判定区域
HitBox -up-|> Area2D
CollisionShape2D2 -down-o HitBox
Shape2D <-down- CollisionShape2D2

Player o-- Sprite
note bottom:玩家长相
@enduml

在这里插入图片描述

组合关系

@startuml
title Godot中的组合关系
class Tree {
}

Tree *-- TreeItem
note right:组合关系，\n父类由子类组成，\n父类消失，子类失去意义，\n子类消失，父类无法构成。

@enduml

在这里插入图片描述

依赖关系

@startuml
title Godot中类的依赖关系
class ShapePoints {
+static rect():PackedVector2Array
}

class myCanvas{
+ draw_rect():void
}


ShapePoints <.. myCanvas
note right: 依赖关系：\n一个类用**局部变量**、\n**方法参数**或者\n**对静态方法的调用**\n来访问另一个类

@enduml

在这里插入图片描述

总结

本文带领Godot使用者，学习和使用基础的PlantUML类图绘制技巧。
希望对Godoter们编写和设计自己的类以及类库有所帮助，你也可以用来绘制和讲解设计模式等。
本文不详之处，可以查阅其他大佬的文章或翻找PlantUML官方文档。
若有错误之处，还请指正。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mfbz.cn/a/788671.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

HTML 标签简写和全称及其对应的中文说明和实例

HTML 标签简写和全称及其对应的中文说明和实例

<!DOCTYPE html> <html lang"zh-CN"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>HTML 标签简写及全称</title><style>…
阅读更多...
WSL2编译使用6.6版本内核

WSL2编译使用6.6版本内核

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、有什么变化二、下载6.6内核三、开始编译1.安装环境2.开始编译 四、使用1.杀死虚拟机2.防止内核文件3.修改配置文件 总结 前言 最近出了一件不大不小的事&a…
阅读更多...
Collection 和 Collections 的区别与用法

Collection 和 Collections 的区别与用法

Collection 和 Collections 的区别与用法 1、Collection 接口1.1 主要特点1.2 常见方法 2、 Collections 工具类2.1 主要特点2.2 常见方法 3、示例代码3.1 使用 Collection 接口3.2 使用 Collections 工具类 4、总结 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收…
阅读更多...
PostgreSQL 里怎样解决多租户数据隔离的性能问题？

PostgreSQL 里怎样解决多租户数据隔离的性能问题？

文章目录 一、多租户数据隔离的性能问题分析&#xff08;一&#xff09;大规模数据存储和查询&#xff08;二&#xff09;并发访问和锁争用&#xff08;三&#xff09;索引维护成本高&#xff08;四&#xff09;资源分配不均 二、解决方案&#xff08;一&#xff09;数据分区&a…
阅读更多...
神经网络构成、优化、常用函数+激活函数

神经网络构成、优化、常用函数+激活函数

Iris分类 数据集介绍&#xff0c;共有数据150组&#xff0c;每组包括长宽等4个输入特征&#xff0c;同时给出输入特征对应的Iris类别&#xff0c;分别用0&#xff0c;1&#xff0c;2表示。 从sklearn包datasets读入数据集。 from sklearn import darasets from pandas impor…
阅读更多...
申请商标用什么颜色：企业和个人申请注册商标攻略！

申请商标用什么颜色：企业和个人申请注册商标攻略！

在申请注册商标到底要用什么颜色&#xff0c;许多初次申请注册主体都不是特别清楚&#xff0c;普推知产商标老杨建议&#xff0c;在一般情况下建议尽量用黑白色&#xff0c;因为商标用黑白色在使用时可以着任何色。 在用黑色申请注册成功&#xff0c;别的主体用其它颜色要在同…
阅读更多...
前端javascript中的排序算法之插入排序

前端javascript中的排序算法之插入排序

插入排序&#xff08;Selection Sort&#xff09;基本思想&#xff1a; 插入排序每次排一个数组项&#xff0c;以此方式构建最后的排序数组。假定第一项已经排序了&#xff0c;接着&#xff0c; 它和第二项进行比较&#xff0c;第二项是应该待在原位还是插到第一项之前呢&#…
阅读更多...
类似评论、省市区这种具有层次结构的数据表怎么设计？

类似评论、省市区这种具有层次结构的数据表怎么设计？

业务功能模块 评论、回复模块省市区表 设置一个给每个数据设置一个parent_id 例如&#xff1a; 某个视频下a写了条评论&#xff0c;那a的parent_id就是0;b回复了a&#xff0c;那b的parent_id就是a的id;c回复了b&#xff0c;那c的parent_id就是b的id; 这样&#xff0c;所有评论…
阅读更多...
大话光学原理：1.“实体泛光说”、反射与折射

大话光学原理：1.“实体泛光说”、反射与折射

一、实体泛光说 在古希腊&#xff0c;那些喜好沉思的智者们中&#xff0c;曾流传着一个奇妙的设想&#xff1a;他们认为&#xff0c;我们的眼睛仿佛伸出无数触手般的光线&#xff0c;这些光线能向四面八方延伸&#xff0c;紧紧抓住周围的每一个物体。于是&#xff0c;当我们凝视…
阅读更多...
Apache部署与配置

Apache部署与配置

概述 介绍 Apache HTTP Server(简称Apache)是Apache的一个开源的网页服务器&#xff0c;它源自NCSAhttpd服务器&#xff0c;并经过多次修改和发展&#xff0c;如今已经成为全球范围内广泛使用的Web服务器软件之一 特点 跨平台&#xff1a;可以运行在几乎所有广泛使用的计算机平…
阅读更多...
Java面试八股之描述一下MySQL使用索引查询数据的过程

Java面试八股之描述一下MySQL使用索引查询数据的过程

描述一下MySQL使用索引查询数据的过程 1.解析查询语句与查询优化 用户提交一个 SQL 查询语句&#xff0c;MySQL 的查询解析器对其进行词法分析和语法分析&#xff0c;生成解析树。 查询优化器根据解析树、表结构信息、统计信息以及索引信息&#xff0c;决定是否使用 B树索引…
阅读更多...
限流组件都有哪些

限流组件都有哪些

限流组件有很多&#xff0c;下面是一些常见的限流组件&#xff1a; 1.Sentinel&#xff1a;轻量级的流量控制、熔断降级组件&#xff0c;适用于分布式系统间的流量控制、负载保护和系统防护。 1.Guava RateLimiter&#xff1a;Google 的 Guava 库提供的限流器&#xff0c;基于令…
阅读更多...
利用远程桌面进行开发，

利用远程桌面进行开发，

现在的软硬件开发都涉及庞杂的软硬件环境和多种外设总线部署&#xff0c;这时我们利用远程工具和windows自带的wsl虚拟机环境再配合vscode的remote ssh远程开发模式&#xff0c;可自由的在linux windows android等平台上切换&#xff0c;让开发更顺畅&#xff0c;也可以更好的利…
阅读更多...
python源码分享：视频srt字幕文件生成

python源码分享：视频srt字幕文件生成

前言 最近有个项目需要使用srt字幕&#xff0c;我通过数分钟了解了它&#xff0c;并快速使用python完成了这一功能&#xff0c;现在分享此源码&#xff1a; 1、已知目标时间段的srt弹幕文件生成 2、自动识别视频的最后五秒钟&#xff0c;并添加提示弹幕 已知目标时间段的srt弹幕…
阅读更多...
LLM 研究方向(一): LLM Prompts--p-tuning、LoRA

LLM 研究方向(一): LLM Prompts--p-tuning、LoRA

目录 1. prompt-tuning background 2. Prompt Tuning 模型介绍 2.1 2021 prefix-tuning 2.2 2021 P-tuning v1 2.3 2021 Parameter-efficient prompt tuning (PET) 2.4 2022 P-tuning v2 2.5 2019 Adapter ​2.6 2021 LoRA (Low-Rank Adaptation) 2.7 2024 DoRA (…
阅读更多...
Linux学习——Linux中无法使用ifconfg命令

Linux学习——Linux中无法使用ifconfg命令

Linux学习——Linux中无法使用ifconfg命令&#xff1f; &#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅…
阅读更多...
文献解读-基准与方法研究-第十六期|《GeneMind 公司的 GenoLab M 测序平台 WGS 和 WES 数据基准测试》

文献解读-基准与方法研究-第十六期|《GeneMind 公司的 GenoLab M 测序平台 WGS 和 WES 数据基准测试》

关键词&#xff1a;基准与方法研究&#xff1b;基因测序&#xff1b;变异检测&#xff1b; 文献简介 标题&#xff08;英文&#xff09;&#xff1a;Accuracy benchmark of the GeneMind GenoLab M sequencing platform for WGS and WES analysis标题&#xff08;中文&#xf…
阅读更多...
mysql查询的一些问题

mysql查询的一些问题

解决方案一&#xff1a;给字段起别名&#xff0c;让别名与实体类属性一致 解决方案二&#xff1a;通过Results和Result注解手动映射 推荐使用方案三&#xff1a;开启驼峰命名在application.properties文件中添加mybatis.configuration.map-underscore-to-camel-casetrue
阅读更多...
14-65 剑和诗人39 - 打造你自己的 Devin

14-65 剑和诗人39 - 打造你自己的 Devin

​​​​​ 绝密 Devin 架构 更具体地说，构建您自己的 AI 代理。 Devin 使用 GPT-4 ，而人们已经开始用 Claude-3-Opus 构建替代方案 Devin 的 UI 体验更好。 例如，它甚至看不到浏览器，但它确实存在于用户面前 此外，你可以随时与它“交谈”，就像与人交谈一样，它会在后…
阅读更多...
『大模型笔记』GraphRAG：利用复杂信息进行发现的新方法！

『大模型笔记』GraphRAG：利用复杂信息进行发现的新方法！

GraphRAG：利用复杂信息进行发现的新方法！ 文章目录 一. GraphRAG：利用复杂信息进行发现的新方法！1. 将RAG应用于私人数据集2. 整个数据集的推理3. 创建LLM生成的知识图谱4. 结果指标5. 下一步二. 参考文献微软官方推文：https://www.microsoft.com/en-us/research/blog/gra…
阅读更多...
最新文章

Copyright @ 2022~2023