【Godot4.2】用PlantUML和语雀画UML类图

概述

  • UML：统一建模语言(Unified Modeling Language,UML)是用来设计软件的可视化建模语言。
  • PlantUML：是一个开源工具，它允许我们用文本形式来描绘和创建UML图。在VSCode中可以安装扩展来绘制，而在语雀的MarkDown编辑器中，则可以用“文本绘图”形式直接在文档中创建。
  • UML类图：在面向对象语言或开发中类图是最基础也最有用的一种图，它可以描述类的成员以及多个类之间的关系。

在Godot中，我们使用GDScript进行开发时，也需要涉及类、继承、组合等。所以本篇就介绍一下如何在使用Godot编写类库或者进行OOP开发时，进行类图的绘制，用于详实自己的文档，并让人更好的看懂你的设计思路。

在语雀中创建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

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

也可以用花括号语法：

@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

绘制效果如下：
2

表示静态变量或方法

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/771380.html

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

相关文章

震惊！运气竟能如此放大！运气的惊人作用，你了解吗？

震惊！运气竟能如此放大！运气的惊人作用，你了解吗？

芒格&#xff1a;得到你想要的东西&#xff0c;最保险的办法&#xff0c;就是让自己配得上你想要的那个东西。今天仔细想了想这句话&#xff0c;他其实说的是无数成功人士的心声 —— “我配得上&#xff01;” 美剧《绝命毒师》有个导演叫文斯吉里根&#xff08;Vince Gilliga…
阅读更多...
如何看待制造业数字化转型？从不同维度来聊一聊

如何看待制造业数字化转型？从不同维度来聊一聊

作为一名TOB行业9年经验的老兵&#xff0c;近期我们团队拜访了不少制造企业&#xff0c;其以中小型企业居多&#xff0c;在与企业负责人交流数字化转型话题时&#xff0c;感触最多的还是管理者对“数字化转型”的认知。在数字化转型方面从国家层面到地方政府进行大量的宣传与政…
阅读更多...
数据结构 1.1 数据结构的基本概念

数据结构 1.1 数据结构的基本概念

本章总览&#xff1a; 一.什么是数据 1.数据 数据是信息的载体&#xff0c;是描述客观事物属性的数、字符及所有能输入到计算机中并被计算机程 序识别和处理的符号的集合。数据是计算机程序加工的原料。 早期计算机只能处理纯数值的问题&#xff0c;如世界第一题计算机ENI…
阅读更多...
【京存】AI人工智能时代的分布式存储

【京存】AI人工智能时代的分布式存储

如今&#xff0c;AI人工智能的浪潮席卷全球&#xff0c;数据以前所未有的速度增长与积累。如何高效存储、管理和利用海量数据&#xff0c;成为推动AI发展的关键。 今日&#xff0c;我们将为您深度剖析AI人工智能分布式存储方案&#xff0c;伴随AI技术在图像识别、自然语言处理…
阅读更多...
金融（基金）行业信创国产化特点及统一身份认证解决方案

金融（基金）行业信创国产化特点及统一身份认证解决方案

金融业在政策支持及自主驱动下&#xff0c;金融信创取得快速发展。从2020年开始&#xff0c;三期试点已扩容至5000余家&#xff0c;进入全面推广阶段。而基金行业信创建设与银行、证券、保险这些试点行业相比&#xff0c;进展较为缓慢。 基金行业信创当前面临的问题 与多家基…
阅读更多...
百度出品_文心快码Comate提升程序猿效率

百度出品_文心快码Comate提升程序猿效率

1.文心快码 文心快码包含指令、插件 和 知识三种功能&#xff0c; 1&#xff09;指令包含Base64编码、Base64解码、JSON转TS类型、JSON转YAML、JWT解码喂JSON。 2&#xff09;插件包含 3&#xff09;指令包含如下功能&#xff1a; 官网链接
阅读更多...
SQL Server 2022的组成

SQL Server 2022的组成

《SQL Server 2022从入门到精通&#xff08;视频教学超值版&#xff09;》图书介绍-CSDN博客 SQL Server 2022主要由4部分组成&#xff0c;分别是数据库引擎、分析服务、集成服务和报表服务。本节将详细介绍这些内容。 1.2.1 SQL Server 2022的数据库引擎 SQL Server 2022的…
阅读更多...
盘点几款国产AI高效神器！打工人赶紧码住

盘点几款国产AI高效神器！打工人赶紧码住

在这个AI技术飞速发展的时代&#xff0c;国产AI工具正成为提升工作效率的得力助手。作为AI工具测评博主&#xff0c;米兔有幸体验了多款国产AI工具&#xff0c;今天要向大家介绍几款超级好用的AI工具。这些工具不仅功能强大&#xff0c;而且操作简便&#xff0c;是职场人士不可…
阅读更多...
贵的智能猫砂盆值得买吗？包含百元、千元的高性价比品牌推荐！

贵的智能猫砂盆值得买吗？包含百元、千元的高性价比品牌推荐！

对于养猫的上班族来说&#xff0c;智能猫砂盆真的是越早买越好&#xff0c;普通猫砂盆用这么久下来能把我们这些上班的都累死&#xff0c;每次一回到家就能闻到猫屎的臭味&#xff0c;一看就收获猫砂盆里满满当当的猫屎&#xff0c;在外面要上班&#xff0c;在家里也要给猫上班…
阅读更多...
API-正则表达式

API-正则表达式

学习目标&#xff1a; 掌握正则表达式 学习内容&#xff1a; 什么是正则表达式语法元字符修饰符 什么是正则表达式&#xff1a; 正则表达式是用于匹配字符串中字符组合的模式。在JavaScript中&#xff0c;正则表达式也是对象。 通常用来查找、替换那些符合正则表达式的文本&a…
阅读更多...
二叉树的链式访问 与 二叉树专题

二叉树的链式访问 与 二叉树专题

目录 二叉树的前、中、后序遍历求二叉树第K层节点的个数二叉树查找值为x的节点leetcode相同的树对称二叉树二叉树的前序遍历另一棵子树牛客 二叉树的遍历 二叉树的前、中、后序遍历 1.前序遍历&#xff1a;先访问根节点&#xff0c;再访问左子树&#xff0c;最后访问右子树 根…
阅读更多...
# windows 安装 mysql 显示 no packages found 解决方法

# windows 安装 mysql 显示 no packages found 解决方法

windows 安装 mysql 显示 no packages found 解决方法 一、问题描述&#xff1a; 安装 mysql 时&#xff0c;出现 no packages found 不能进行下一步安装了&#xff0c; 如下图&#xff1a; 二、解决方法&#xff1a; 1、路径问题&#xff0c;系统不能识别你的安装包路径&…
阅读更多...
MTK6769芯片性能参数_MT6769规格书_datasheet

MTK6769芯片性能参数_MT6769规格书_datasheet

联发科MT6769处理器采用了台积电12nm工艺。它具有8核CPU&#xff0c;采用2Cortex A75 2.0GHz 6Cortex A55 1.7GHz的构架。该处理器搭载了Mali-G52 MC2 GPU&#xff0c;运行速度高达820MHz&#xff0c;能够提供出色的图形处理性能。此外&#xff0c;MT6769还提供高达8GB的快速L…
阅读更多...
无法启动此程序，因为计算机中丢失 api-ms-win-crt-string-11-1-0.dl。尝试重新安装该程序以解决此问题。

无法启动此程序，因为计算机中丢失 api-ms-win-crt-string-11-1-0.dl。尝试重新安装该程序以解决此问题。

在windows server2012系统中利用WinSW部署jar包时&#xff0c;报错&#xff1a;无法启动此程序&#xff0c;因为计算机中丢失 api-ms-win-crt-string-11-1-0.dl。尝试重新安装该程序以解决此问题。 原因&#xff1a; 缺少Microsoft Visual C 2015运行库或者已安装低版本运行库…
阅读更多...
DevExpress WPF中文教程：Grid - 如何显示摘要（设计时）？

DevExpress WPF中文教程：Grid - 如何显示摘要（设计时）？

DevExpress WPF拥有120个控件和库&#xff0c;将帮助您交付满足甚至超出企业需求的高性能业务应用程序。通过DevExpress WPF能创建有着强大互动功能的XAML基础应用程序&#xff0c;这些应用程序专注于当代客户的需求和构建未来新一代支持触摸的解决方案。 无论是Office办公软件…
阅读更多...
conda中创建环境并安装tensorflow1版本

conda中创建环境并安装tensorflow1版本

conda中创建环境并安装tensorflow1版本 一、背景二、命令三、验证一下 一、背景 最近需要使用tensorflow1版本的&#xff0c;发个记录&#xff01; 二、命令 conda create -n tf python3.6 #创建tensorflow虚拟环境 activate tf #激活环境&#xff0c;每次使用的时候都…
阅读更多...
机器学习与AI大数据的融合：开启智能新时代

机器学习与AI大数据的融合：开启智能新时代

在当今这个信息爆炸的时代&#xff0c;大数据和人工智能&#xff08;AI&#xff09;已经成为推动社会进步的强大引擎。作为AI核心技术之一的机器学习&#xff08;Machine Learning, ML&#xff09;&#xff0c;与大数据的深度融合正引领着一场前所未有的科技革命&#xff0c;不…
阅读更多...
太速科技-FMC209-基于FMC的4路125MAD输入、2路1GDA输出子卡

太速科技-FMC209-基于FMC的4路125MAD输入、2路1GDA输出子卡

FMC209-基于FMC的4路125MAD输入、2路1GDA输出子卡 一、板卡概述 本子卡基于FMC连接器实现4路125M采样率AD输出&#xff0c;两路1G采样率DA输出子卡&#xff0c;板卡默认由FMC连接器12V供电&#xff0c;支持外参考时钟&#xff0c;外输入时钟&#xff0c;外触发。 …
阅读更多...
PE文件学习

PE文件学习

一、介绍 PE文件&#xff0c;即Portable Executable文件&#xff0c;是一种标准的文件格式&#xff0c;主要用于微软的Windows操作系统上。这种格式被用来创建可执行程序&#xff08;如.exe文件&#xff09;、动态链接库&#xff08;.DLL文件&#xff09;、设备驱动&#xff0…
阅读更多...
汽车信息安全--数据安全：图像脱敏

汽车信息安全--数据安全：图像脱敏

General 随着车联网的发展&#xff0c;汽车越来越智能化&#xff0c;就像是一部“装着四个轮子的手机”。 有人说&#xff0c;智能手机就如同一部窃听器&#xff0c;无论你开机或者关机&#xff0c;它都会无时不刻地监听着用户的一举一动。 可想而知&#xff0c;智能车辆上…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站