PlantUML画出如女神漂亮的流程图 |
您所在的位置：网站首页 › uml绘图网站 › PlantUML画出如女神漂亮的流程图 |
PlantUML画出如女神漂亮的流程图
|
一：环境准备
1，本地安装好vscode 2，vscode安装PlantUML插件
3，本地安装java环境，我本地用的是jdk-11.0.17+8，配置好环境变量 4，在vscode上新建一个文件以wsd结尾，输入以下两行，然后按alt+d按键，右边可以调出预览视图，并且预览是实时的，每写一行在右边都会呈现出总体流程图，效果如下 @startuml @enduml
至此本地环境就准备好了 ，接下来就是逐步讲解每个组件的使用了 二：流程图详解 1，开始和结束 @startuml start end @enduml
条件判断就是if-else，有两种形式，如下所示 @startuml start if( a == b )then(yes) :a = 1; else(no) :b = 100; endif if( a ) equals ( b ) then : c = 888; else : d = 999; endif end @enduml
循环主要展示了如下三种样式，第一种就是常规的while循环流程图，第二种用的是repeat有些类似do-while的循环流程图，第三种是while的另一种表达方式，大家可以根据实际需要去选择使用哪一种的循环 @startuml start while( a == b ) :a++; if(a != b)then(yes) :break; endif endwhile end @enduml
switch case应该是程序设计中比较常见的语句了，在PlantUML中当然也有switch case的一席之地，建议大家在写 PlantUML语句时候，也和写代码一下，通过行的缩进来保持层次感，这样一是易读，二是也方便修改 @startuml start switch(type) case(1) :process-1; case(2) :process-2; case(3) :process-3; case(default) :process-default; endswitch end @enduml
这个这是锦上添花了，如果想要流程图好像些，可以给组件上色，语法如下，另外如果对某个流程相加注释也是可以的 。有的流程是属于一个模块可以用partition来囊括这个模块内的流程，使流程图更加的清晰。 @startuml title 流程图 start partition "proc" { #HotPink:psFunction1; note left #Pink 函数1-作用XXX end note #BlueViolet:psFunction2; note left 函数2-作用XXX end note } end @enduml
下面展示一个比较复杂的流程图，大家写复杂流程图的需求可以参考一下 @startuml start :ClickServlet.handleRequest (); :new page; if (Page.onSecurityCheck) then (true) :Page.onInit(); if (isForward?) then (no) :Process controls; if (continue processing?) then (no) stop endif if (isPost?) then (yes) :Page.onPost(); else (no) :Page.onGet(); endif :Page.onRender (); endif else (false) endif if (do redirect?) then (yes) :redirect process; else if (do forward?) then (yes) :Forward request; else (no) :Render page template; endif endif stop @enduml
以上只是展示PlantUML画流程图的一部分，PlantUML的能力远不止如此。后续仍将不断更新 |
【本文地址】